:root { color-scheme: light; --ink:#151c28; --muted:#687284; --blue:#3159cc; --surface:#fff; --page:#f1f3f7; }
* { box-sizing:border-box; }
body { margin:0; background:var(--page); font-family:-apple-system,BlinkMacSystemFont,"PingFang TC",sans-serif; color:var(--ink); }
button,a { -webkit-tap-highlight-color:transparent; }
button { font:inherit; border:0; cursor:pointer; }
.review { min-height:100svh; display:flex; justify-content:center; align-items:center; gap:72px; padding:36px 24px; }
.phone { position:relative; flex:none; width:390px; height:780px; max-height:calc(100svh - 72px); min-height:540px; overflow:hidden; border-radius:42px; background:var(--surface); color:var(--ink); box-shadow:0 22px 75px #18233e12,0 1px 3px #18233e09; transition:background .2s; }
.status { position:absolute; top:20px; left:27px; right:25px; display:flex; justify-content:space-between; align-items:center; font-size:12px; font-weight:600; letter-spacing:.3px; }
.intro { position:absolute; top:38%; left:0; width:100%; transform:translateY(-50%); text-align:center; }
.wordmark { width:262px; max-width:78%; margin:0 auto; }
.wordmark > svg { display:block; width:100%; height:auto; overflow:visible; }
.tagline { margin:27px 0 0; padding-left:1.7px; text-align:center; font-size:15px; font-weight:500; letter-spacing:1.7px; color:var(--ink); opacity:0; }
.wordmark[data-phase="settled"] + .tagline { opacity:1; transition:opacity .35s ease; }
.home-indicator { position:absolute; bottom:9px; left:50%; transform:translateX(-50%); width:121px; height:4px; border-radius:3px; background:var(--ink); opacity:.86; }
.controls { width:270px; flex:none; }
.caption { margin:0 0 20px; font-size:22px; font-weight:600; letter-spacing:-.6px; }
.notes { margin:0; font-size:14px; line-height:1.9; color:var(--muted); }
.actions { display:flex; gap:10px; margin-top:28px; flex-wrap:wrap; }
.actions button { min-height:44px; padding:0 17px; background:#e5e9f1; color:#263044; border-radius:24px; font-size:13px; font-weight:500; }
.actions .primary { background:var(--blue); color:white; }
.downloads { margin-top:24px; display:flex; flex-wrap:wrap; gap:22px; }
.downloads a { color:var(--blue); font-size:13px; text-underline-offset:4px; }
.fine { margin:32px 0 0; color:var(--muted); font-size:12px; line-height:1.8; }
.phone.dark { --ink:#f4f7ff; --surface:#121924; }
button:focus-visible,a:focus-visible { outline:3px solid #809fff; outline-offset:4px; }
@media(max-width:760px) {
 .review { min-height:100svh; padding:0; display:block; }
 .phone { width:100%; height:73svh; min-height:410px; max-height:none; border-radius:0; box-shadow:none; }
 .intro { top:45%; }
 .controls { width:100%; padding:22px 24px 28px; background:var(--page); }
 .caption { font-size:17px; margin-bottom:7px; }
 .notes { display:none; }
 .actions { margin-top:14px; }
 .downloads { margin-top:18px; }
 .fine { margin-top:20px; }
 .home-indicator { display:none; }
}
@media(prefers-reduced-motion:reduce) { * { transition:none!important; } }
