/* ==========================================================
   更新情報（updates.html）専用スタイル
   共通部分は common.css
   ========================================================== */

/* timeline */
.upd-list{position:relative;max-width:880px;margin:0 auto;padding:10px 24px 90px}
.tl-line{position:absolute;left:31px;top:28px;bottom:70px;width:2px;background:linear-gradient(var(--green),rgba(18,156,94,.15))}
.entry{position:relative;padding-left:40px;margin-bottom:34px}
.tl-dot{position:absolute;left:0;top:36px;width:16px;height:16px;border-radius:50%;background:var(--green);border:3.5px solid var(--green-pale);box-shadow:0 0 0 1.5px var(--green)}

/* entry card */
.entry-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 34px 38px;box-shadow:0 14px 40px rgba(15,53,39,.08)}
.upd-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.upd-date{font-family:var(--latin);font-size:14px;font-weight:700;color:var(--ink-2)}
.upd-h2{font-size:28px;font-weight:900;line-height:1.35;letter-spacing:-.02em;margin:0 0 10px}
.upd-item{margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}
.upd-item.first{margin-top:8px;padding-top:8px;border-top:0}
.upd-num{font-family:var(--latin);font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--green-ink);margin-right:10px}
.upd-h3{display:inline;font-size:16.5px;font-weight:700;margin:0}
.upd-p{font-size:14.5px;color:var(--ink);line-height:1.95;margin-top:8px}
.upd-p.solo{font-size:15px;margin-top:0}
.upd-p b,.upd-p strong{font-weight:700;color:var(--ink)}
.upd-badges{margin-top:20px}
.upd-badges img{height:44px}

/* screenshots */
.upd-fig{display:flex;justify-content:center;margin-top:22px}
.upd-fig.wide{margin-top:26px}
.upd-shot{display:block;width:300px;max-width:100%;height:auto;border:1px solid var(--line);border-radius:16px}
.upd-shot.sm{width:250px}
.upd-shot.framed{width:250px;border:5px solid #080808;border-radius:28px}

/* device frame */
.dev-row{display:flex;gap:18px;justify-content:center;margin-top:26px}
.dev-col{flex:1 1 0;min-width:0;max-width:250px}
.dev-solo{width:250px;max-width:76%}
.dev{position:relative;width:100%;background:linear-gradient(150deg,#20201f,#050505);border-radius:12.6%/6%;padding:2.4%;box-shadow:0 34px 60px rgba(15,53,39,.24),0 6px 16px rgba(15,53,39,.14),inset 0 0 0 1.3px rgba(255,255,255,.1);isolation:isolate}
.dev-scr{position:relative;border-radius:10%/4.7%;overflow:hidden;background:#0b0b0c}
.dev-img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
.dev-sbar{position:absolute;top:0;left:0;right:0;height:4.4%;background:#fff;z-index:2}
.dev-island{position:absolute;top:1.9%;left:50%;transform:translateX(-50%);width:27%;height:2.9%;min-height:14px;background:#000;border-radius:999px;z-index:3;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.dev-cap{display:block;font-size:11.5px;font-weight:700;color:var(--ink-2);text-align:center;margin-top:10px}

@media (max-width:560px){
  .upd-list{padding:6px 18px 70px}
  .entry{padding-left:30px}
  .tl-line{left:25px}
  .entry-card{padding:24px 20px 28px;border-radius:18px}
  .upd-h2{font-size:23px}
  .dev-row{gap:12px}
}