:root{--paper:#f7f7f4;--ink:#11110f;--muted:#777770;--line:rgba(17,17,15,.14);--shadow:rgba(17,17,15,.08)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;background:var(--paper);color:var(--ink)}
body{overflow:hidden;font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit}
.page{position:fixed;inset:0;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 50% 43%,#fff 0%,#fbfbf8 48%,#efefe9 100%)}
.fleet{position:absolute;inset:0;z-index:2;pointer-events:none}.geekbar{position:absolute;width:clamp(100px,9.8vw,170px);transform-origin:center;will-change:transform,filter,opacity;user-select:none;filter:drop-shadow(0 18px 18px rgba(0,0,0,.11))}.geekbar img{display:block;width:100%;height:auto}
.soft-vignette{position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(circle at center,transparent 34%,rgba(33,33,28,.065) 100%)}
.grain{position:absolute;inset:-50%;z-index:5;pointer-events:none;opacity:.022;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.hero{position:absolute;z-index:10;left:50%;top:50%;width:min(900px,92vw);transform:translate(-50%,-52%);text-align:center;pointer-events:none}
.eyebrow{font-size:9px;font-weight:800;letter-spacing:.34em;color:#9b9b92;opacity:0;animation:rise .65s .05s both}.logo{margin:13px 0 15px;font-family:"Space Grotesk",sans-serif;font-size:clamp(5.2rem,13.2vw,12rem);line-height:.8;letter-spacing:-.095em;font-weight:700;color:#11110f;opacity:0;animation:logoIn .95s .12s both cubic-bezier(.16,.8,.2,1);text-shadow:0 1px 0 #fff,0 9px 20px rgba(0,0,0,.08)}
.subtitle{margin:0 0 28px;color:#6f6f68;font-size:clamp(.75rem,1.05vw,.92rem);letter-spacing:.02em;opacity:0;animation:rise .65s .34s both}
.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;opacity:0;animation:rise .65s .48s both}
.pill,.round,.ui-sound{border:1px solid var(--line);background:rgba(255,255,255,.80);color:#181816;box-shadow:0 12px 32px var(--shadow),inset 0 1px rgba(255,255,255,.98);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease}
.pill{border-radius:999px;padding:11px 17px;display:flex;align-items:center;gap:9px}.pill span{width:18px;height:18px;border:1px solid #181816;border-radius:5px;display:grid;place-items:center;font-size:9px;font-weight:800}
.pill:hover,.ui-sound:hover{transform:translateY(-3px);background:#fff;border-color:rgba(17,17,15,.25);box-shadow:0 18px 42px rgba(0,0,0,.11)}.pill:active,.round:active,.ui-sound:active{transform:translateY(-1px) scale(.985)}
.music-panel{position:absolute;z-index:11;left:19px;bottom:18px;width:min(340px,calc(100vw - 38px));padding:14px 15px 10px;border:1px solid var(--line);border-radius:19px;background:rgba(255,255,255,.82);box-shadow:0 18px 48px rgba(0,0,0,.08),inset 0 1px #fff;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);pointer-events:auto}
.music-top{display:flex;align-items:center;gap:10px}.music-top>div{flex:1}.music-kicker{font-size:8px;color:#999990;font-weight:800;letter-spacing:.21em}.music-title{margin-top:4px;font-size:13px;font-weight:800}.round{width:35px;height:35px;padding:0;border-radius:50%;display:grid;place-items:center;font-size:13px}.round:hover{transform:translateY(-2px);background:#fff;box-shadow:0 12px 24px rgba(0,0,0,.11)}
#visualizer{display:block;width:100%;height:44px;margin-top:10px}.music-foot{display:flex;justify-content:space-between;font-size:9px;font-weight:700;letter-spacing:.12em;color:#999990}
.ui-sound{position:absolute;right:19px;bottom:18px;z-index:11;border-radius:999px;padding:9px 12px;display:flex;align-items:center;gap:8px}.mini-bars{display:flex;gap:2px;align-items:center;height:14px}.mini-bars i{width:2px;height:5px;background:#111;border-radius:2px}.ui-sound[aria-pressed=true] .mini-bars i:nth-child(1){height:8px}.ui-sound[aria-pressed=true] .mini-bars i:nth-child(2){height:13px}.ui-sound[aria-pressed=true] .mini-bars i:nth-child(3){height:7px}
.loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#f7f7f4;transition:opacity .42s ease,visibility .42s ease}.loader.done{opacity:0;visibility:hidden}.loader-card{width:min(720px,calc(100vw - 42px));padding:27px 31px 26px;border:1px solid rgba(17,17,15,.12);border-radius:22px;background:rgba(255,255,252,.95);box-shadow:0 28px 90px rgba(0,0,0,.1),inset 0 1px #fff}.loader-head{display:flex;justify-content:space-between;align-items:center}.loader-head>span{font-size:10px;letter-spacing:.32em;font-weight:800;color:#7f7f77}.loader-close{border:0;background:transparent;color:#666;font-size:23px;cursor:pointer;transition:transform .2s ease}.loader-close:hover{transform:rotate(90deg);color:#111}.loader-copy{display:flex;align-items:end;justify-content:space-between;margin:42px 0 17px}.loader-copy strong{font-family:"Space Grotesk";font-size:22px;letter-spacing:-.03em}.loader-copy span{font-size:12px;color:#777770}.load-track{height:2px;background:#e6e6e0;overflow:hidden}.load-track i{display:block;width:0;height:100%;background:#111;transition:width .05s linear}
.modal-backdrop{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:22px;background:rgba(247,247,244,.52);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.modal{position:relative;width:min(700px,100%);max-height:min(78vh,720px);overflow:auto;padding:34px;border-radius:24px;border:1px solid rgba(17,17,15,.13);background:rgba(255,255,253,.96);box-shadow:0 32px 100px rgba(0,0,0,.14);animation:modalIn .3s cubic-bezier(.2,.8,.2,1)}.modal-close{position:absolute;right:13px;top:11px;border:0;background:transparent;color:#666;font-size:28px;cursor:pointer;transition:transform .2s ease}.modal-close:hover{transform:rotate(90deg);color:#111}.modal-brand{font-size:9px;letter-spacing:.28em;font-weight:800;color:#999990}.modal h2{margin:8px 0 19px;font-family:"Space Grotesk";font-size:31px;letter-spacing:-.045em}.modal-body{font-size:14px;line-height:1.75;color:#50504a}.modal-body h3{font-size:15px;color:#181815;margin:22px 0 7px}.modal-body p{margin:0 0 10px}[hidden]{display:none!important}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes logoIn{from{opacity:0;transform:translateY(21px) scale(.985);filter:blur(9px)}to{opacity:1;transform:none;filter:none}}@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:700px){.hero{top:48%}.music-panel{left:13px;bottom:13px;width:calc(100vw - 26px)}.ui-sound{right:13px;bottom:13px}.loader-card{padding:22px}.loader-copy{margin-top:30px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important}}