@import url('btcoffice-spectrum.css');
:root { color-scheme:dark; background:#0a1018; color:#f0f2e9; font-family:var(--site-font); --office-muted:#a7b5c5; --office-line:#283747; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:radial-gradient(ellipse at 90% 5%,#17243a80,transparent 42%),#0a1018; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:3px solid #bda2ff; outline-offset:5px; }
.office-wrap { width:calc(100% - 64px); max-width:1080px; margin-inline:auto; }
.office-topbar { min-height:104px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--office-line); }
.office-home { font-size:15px; letter-spacing:.08em; color:#c7d2df; }
.office-topbar .product-language { display:inline-flex; align-items:center; gap:4px; padding:5px 7px 5px 12px; border:1px solid #35495b; border-radius:99px; background:#14212d; }
.office-topbar .product-language__globe { width:18px; height:18px; margin-right:4px; color:#9cafc2; }
.office-topbar .product-language a { padding:8px 11px; font-size:12px; border-radius:99px; color:#9cafc2; }
.office-topbar .product-language a[aria-current] { background:#283c43; color:#d3efdf; }
.office-topbar .product-language a:hover { color:#f0f2e9; }
.office-topbar .product-language__divider { display:none; }
.office-hero { position:relative; display:grid; grid-template-columns:1.3fr 1fr; gap:48px; align-items:center; padding-block:76px 68px; }
.office-eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 22px; font-size:11px; letter-spacing:.14em; color:#aec6da; line-height:1.8; }
.office-live-dot { width:7px; height:7px; background:#9bf2d1; box-shadow:0 0 13px #9bf2d199; }
.office-wordmark { display:flex; align-items:center; gap:12px; font-size:29px; margin:0 0 30px; letter-spacing:-.04em; }
.office-wordmark>span { margin-left:-6px; color:#adbed0; }
.office-wordmark img { image-rendering:pixelated; }
h1,h2,p { word-break:keep-all; }
h1 { margin:0; font-size:clamp(30px,4.3vw,48px); line-height:1.6; font-weight:400; letter-spacing:-.04em; }
.office-intro { max-width:520px; margin:25px 0 30px; color:var(--office-muted); font-size:16px; line-height:2; }
.office-actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.office-play { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:17px 22px; border:1px solid #d7eddf; background:#e8eee0; color:#12211d; font-size:15px; line-height:1.6; border-radius:3px; box-shadow:4px 4px 0 #466257; transition:transform .2s,box-shadow .2s; }
.office-play:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 #587e6e; }
.office-play>span:first-child { font-size:12px; }
.office-explore { padding:12px 0; color:#c0cfdb; font-size:13px; }
.office-availability { color:#8a9bae; font-size:11px; line-height:1.8; margin-top:19px; }
.office-market-art { position:relative; min-height:320px; overflow:hidden; background:#0d1727; border:1px solid #39506a; border-radius:3px; isolation:isolate; }
.office-market-art:before { content:''; position:absolute; inset:0; box-shadow:inset 0 0 70px #59dcca17; border:1px solid #7debd38c; pointer-events:none; animation:office-hue 14s linear infinite; }
.office-market-art__grid { position:absolute; inset:0; background:linear-gradient(#567e981f 1px,transparent 1px),linear-gradient(90deg,#567e981f 1px,transparent 1px); background-size:32px 32px; }
.office-market-art__label { position:absolute; top:22px; left:22px; color:#9baec6; font-size:10px; line-height:2; letter-spacing:.08em; }
.office-market-art__chart { position:absolute; width:110%; left:-5%; bottom:30px; color:#86e7cc; filter:drop-shadow(0 0 8px #86e7cc66); animation:office-hue 14s linear infinite; }
.office-market-art__coin { position:absolute; right:25px; top:37px; width:64px; height:84px; color:#b5a5ef; animation:office-hue 14s linear infinite reverse; }
.office-market-art__status { position:absolute; bottom:15px; left:22px; font-size:9px; letter-spacing:.14em; color:#a3b8c9; }
.office-showcase { position:relative; padding:1px; border:1px solid #4e736d; background:#101a25; box-shadow:0 0 42px #63caba0c; }
.office-windowbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 17px; color:#a7bed0; border-bottom:1px solid var(--office-line); font-size:10px; letter-spacing:.08em; }
.office-windowbar>span:first-child { color:#95d9bf; font-size:9px; }
.office-showcase>img { display:block; width:100%; height:auto; background:#050709; }
.office-showcase figcaption { padding:16px 18px; color:var(--office-muted); font-size:11px; line-height:1.8; }
.office-story { padding-block:110px 20px; display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; scroll-margin-top:30px; }
h2 { font-size:clamp(25px,3.4vw,34px); line-height:1.7; font-weight:400; margin:0 0 20px; letter-spacing:-.03em; }
.office-story__copy>p:last-child,.office-character>p:last-child { color:var(--office-muted); font-size:15px; line-height:2.1; margin-bottom:0; }
.office-desk { padding:40px 28px 20px; }
.office-desk__monitor { margin:auto; max-width:300px; padding:22px 20px 13px; border:7px solid #62788d; background:#101f31; color:#89e5d0; box-shadow:6px 6px 0 #04080d; }
.office-desk__monitor>span { font-size:11px; letter-spacing:.12em; color:#c2d3dc; }
.office-desk__monitor svg { margin-top:25px; animation:office-hue 14s linear infinite; }
.office-desk__stand { margin:auto; height:26px; width:18px; background:#62788d; }
.office-desk__table { height:18px; border-bottom:5px solid #98774d; background:#d1b17e; }
.office-desk>span { display:block; padding-top:25px; text-align:center; color:#8fa5b9; font-size:10px; letter-spacing:.12em; }
.office-story--hall { padding-bottom:90px; }
.office-floor-sign { display:grid; gap:20px; justify-items:center; max-width:320px; width:100%; padding:30px; border:1px solid #61716a; background:#151e25; box-shadow:6px 6px 0 #060b10; color:#e9d391; }
.office-floor-sign>span { font-size:15px; letter-spacing:.08em; }
.office-floor-sign>strong { font:100px/1.3 monospace; text-shadow:0 0 32px #e9d39130; animation:office-hue 16s linear infinite; }
.office-floor-sign>div { display:flex; gap:28px; font-size:11px; color:#aabac7; }
.office-character { border-block:1px solid var(--office-line); padding-block:52px; }
.office-character>p { max-width:660px; }
.office-controls { padding-block:76px; }
.office-controls h2 { font-size:25px; }
.office-controls dl { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin:35px 0 0; }
.office-controls dt { margin-bottom:15px; }
kbd { display:inline-block; padding:10px 13px; border:1px solid #53677d; border-bottom-width:4px; background:#182332; color:#d6e4ed; font:12px/1.5 var(--site-font); border-radius:3px; }
.office-controls dd { margin:0; color:var(--office-muted); font-size:13px; line-height:1.8; }
.office-preview { position:relative; overflow:hidden; padding:40px; background:#121e2a; border:1px solid #4a6e72; }
.office-preview>p { max-width:760px; color:#bbc9d7; font-size:14px; line-height:2; }
.office-preview .office-preview__note { color:#8fa4b8; font-size:12px; margin-bottom:28px; }
.office-preview h2 { font-size:27px; }
.office-footer { display:flex; justify-content:space-between; align-items:flex-start; gap:30px; padding-block:60px 35px; }
.office-footer strong { font-size:19px; font-weight:400; }
.office-footer p { color:#859bae; font-size:11px; line-height:1.8; }
.office-footer .business-footer { color:#91a4b5; }
@media (max-width:760px) { .office-wrap { width:calc(100% - 40px); } .office-topbar { flex-wrap:wrap; padding-block:23px; min-height:0; } .office-hero { grid-template-columns:1fr; gap:32px; padding-block:45px; } .office-market-art { min-height:230px; } .office-market-art__chart { width:100%; max-height:210px; } .office-story { grid-template-columns:1fr; gap:25px; padding-top:68px; } .office-story--hall .office-floor-sign { order:2; } .office-floor-sign { max-width:none; } .office-controls dl { grid-template-columns:1fr 1fr; } .office-preview { padding:26px; } .office-footer { flex-direction:column; } }
@media (max-width:420px) { .office-actions { gap:15px; } .office-play { font-size:13px; padding:15px 18px; } .office-windowbar { font-size:8px; padding:12px; } .office-windowbar>span:first-child { display:none; } .office-controls dl { grid-template-columns:1fr; gap:24px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .office-page *,.office-page:before { animation:none!important; } }
