:root{color-scheme:dark;font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#f1f5f9;background:#182e41;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-width:300px;background:radial-gradient(ellipse at 16% 8%,#895c4355,transparent 42%),radial-gradient(ellipse at 89% 20%,#3a759275,transparent 47%),#182e41}
.portal{width:min(100%,1720px);min-height:100svh;padding:0 clamp(20px,5vw,86px);margin:auto;display:flex;flex-direction:column}
.masthead{min-height:86px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #b6c9d129}
.brand{position:relative;display:flex;width:min(270px,48vw)}
.brand img{width:100%;height:auto;display:block;filter:brightness(0) invert(1)}
.brand .brand-color{position:absolute;inset:0;filter:none;clip-path:polygon(0 0,15% 0,15% 100%,0 100%)}
.masthead-label{display:flex;align-items:center;gap:11px;color:#c4d0da;font-size:13px;letter-spacing:.12em}
.masthead-label i,.eyebrow i{width:4px;height:4px;border-radius:50%;background:currentColor}
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,4vh,60px) 0}
.screens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,38px)}
.screen{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--panel);min-width:0;box-shadow:0 16px 44px #01071042}
.account{--accent:#ffca8f;--line:#a66e466e;--panel:#372a25;--lift:#53382a;--text:#d6c5b8}
.opinion{--accent:#92dcff;--line:#42799280;--panel:#18364b;--lift:#23495f;--text:#c1d7e8}
.screen-visual{min-height:clamp(235px,32vh,378px);position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,2.6vw,42px)}
.screen-visual>img{position:absolute;z-index:-2}
.scenes{inset:0;width:100%;height:100%;object-fit:cover;object-position:54% 46%}
.account .screen-visual::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#362016c9,#21191095 48%,#21191012),linear-gradient(0deg,#372a25 0%,transparent 58%)}
.opinion .screen-visual{background:radial-gradient(ellipse at 78% 31%,#164767,#18364b 73%)}
.opinion .screen-visual::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#18364b 2%,#18364bb3 32%,transparent 73%),linear-gradient(0deg,#18364b,transparent 45%)}
.map{width:78%;height:116%;right:-11%;top:-7%;object-fit:contain;opacity:.83}
.visual-content h2{font-size:clamp(34px,4.3vw,74px);font-weight:680;margin:0;letter-spacing:.05em;line-height:1.15;text-shadow:0 4px 25px #0008}
.visual-content>p:last-child{font-size:clamp(13px,1.15vw,18px);line-height:1.65;margin:12px 0 0;color:#f1e9e1;max-width:310px}
.visual-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.visual-tags span{background:#101820b3;border:1px solid var(--line);color:var(--accent);padding:5px 10px;border-radius:4px;font-size:12px}
.screen-data{padding:0 clamp(20px,2.6vw,42px)}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:17px 0 14px;border-top:1px solid var(--line);gap:10px}
.metrics div{display:flex;flex-direction:column;justify-content:start}
.metrics dd{margin:3px 0 0;font-size:clamp(23px,3vw,49px);font-weight:620;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--accent);white-space:nowrap}
.metrics dd small{font-size:.36em;font-weight:500}
.metrics dt{font-size:clamp(11px,1vw,15px);color:var(--text)}
.scope{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;margin:0 0 18px;color:var(--text);font-size:12px;line-height:1.45}
.scope span{opacity:.9}
.enter{display:flex;align-items:center;justify-content:flex-end;min-height:62px;padding:12px clamp(20px,2.6vw,42px);border-top:1px solid var(--line);background:var(--lift);color:var(--accent);font-size:clamp(15px,1.4vw,21px);font-weight:580;letter-spacing:.04em;text-decoration:none;transition:filter .18s ease}
.enter:hover{filter:brightness(1.22)}
.enter:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.arrow{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;font-size:19px}
footer{min-height:59px;border-top:1px solid #b6c9d129;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#a6b7c7;font-size:12px}
@media(max-width:720px){.screens{grid-template-columns:1fr}.masthead{min-height:65px}.masthead-label{font-size:10px;gap:6px}.screen-visual{min-height:229px}.map{right:-4%}.metrics dd{font-size:clamp(24px,6vw,38px)}footer{line-height:1.5;padding:12px 0}}
@media(prefers-reduced-motion:reduce){.enter{transition:none}}