:root{
  color-scheme:dark;
  --bg:#000;
  --surface:#000;
  --surface-2:#0b0b0b;
  --text:#fff;
  --muted:#a3a3a3;
  --line:rgba(255,255,255,.18);
  --line-strong:rgba(255,255,255,.34);
  --accent:#fff;
  --accent-hover:#e6e6e6;
  --accent-ink:#000;
  --shadow:none;
  --reading:760px;
  --page-gap:clamp(40px,6vw,88px);
}
html[data-theme=light]{
  color-scheme:light;
  --bg:#fff;
  --surface:#fff;
  --surface-2:#f4f4f4;
  --text:#000;
  --muted:#656565;
  --line:rgba(0,0,0,.16);
  --line-strong:rgba(0,0,0,.32);
  --accent:#000;
  --accent-hover:#1c1c1c;
  --accent-ink:#fff;
}
@media(prefers-color-scheme:light){html:not([data-theme]){color-scheme:light;--bg:#fff;--surface:#fff;--surface-2:#f4f4f4;--text:#000;--muted:#656565;--line:rgba(0,0,0,.16);--line-strong:rgba(0,0,0,.32);--accent:#000;--accent-hover:#1c1c1c;--accent-ink:#fff}}

html,body{overflow-x:clip;background:#000;background:var(--bg)}
body{min-height:100vh;color:var(--text)}
body{font-kerning:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body>main,body>.site-footer{position:relative;z-index:2}
::selection{background:var(--text);color:var(--bg)}
:focus-visible{outline-color:var(--text)}

.toc a:before,.support-state i{background:var(--text);box-shadow:none!important}

.page-main{padding-top:clamp(64px,8vw,100px);padding-bottom:clamp(88px,10vw,140px)}
.page-head{grid-template-columns:minmax(170px,.38fr) minmax(0,1.62fr);gap:var(--page-gap);align-items:start;padding-bottom:clamp(52px,7vw,82px)}
.page-head .page-title{max-width:930px;font-size:clamp(58px,7.4vw,98px);text-wrap:balance}
.page-kicker,.legal-aside .meta{padding-top:10px}
.legal-layout,.support-layout{grid-template-columns:minmax(190px,.38fr) minmax(0,1.62fr);gap:var(--page-gap)}
.legal-aside{max-width:240px}
.legal{width:100%;max-width:900px}
.legal h1{max-width:900px;margin-bottom:48px;font-size:clamp(52px,6.8vw,92px);text-wrap:balance}
.legal h2{margin-top:48px;font-size:clamp(22px,2.2vw,28px)}
.legal p,.legal li,.prose p,.prose li{font-size:15px;line-height:1.72}
.legal p,.prose p{margin-block:0 18px}
.legal ul,.prose ul{margin-block:16px 24px}
.legal li+li,.prose li+li{margin-top:8px}
.prose{width:100%;max-width:var(--reading)}
.prose section{padding-bottom:58px}
.prose h2{margin-bottom:20px;font-size:clamp(23px,2.4vw,30px)}
.notice{margin-block:26px;padding:18px 0 18px 22px;border-left-width:1px;background:transparent}
.actions{margin-top:32px}
.support-panel{border-radius:22px;background:var(--bg)}
.field input,.field select,.field textarea{border-radius:10px}
.upload-field{border-radius:12px}
.site-footer{padding:30px 0 42px}
.footer-row{min-height:42px}
.site-crocodile{opacity:.026}
html[data-theme=light] .site-crocodile{opacity:.022}

/* Reading navigation: one active point, no pills or backplates. */
.toc{padding:0;border:0}
.toc a{position:relative;width:max-content;max-width:100%;padding:4px 0 4px 16px;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--muted)!important;font-weight:500!important;transform:none!important;transition:color .18s ease!important}
.toc a:hover{color:var(--text)!important}
.toc a:before{content:"";position:absolute;left:0;top:50%;width:5px;height:5px;border-radius:50%;opacity:0;transform:translateY(-50%) scale(.4);transition:opacity .18s ease,transform .18s ease}
.toc a[aria-current=location],.toc a.is-current{color:var(--text)!important}
.toc a[aria-current=location]:before,.toc a.is-current:before{opacity:1!important;transform:translateY(-50%) scale(1)!important;box-shadow:none!important}

.hero{position:relative;min-height:calc(100svh - 92px);display:grid;grid-template-columns:minmax(0,1fr) clamp(260px,27vw,370px);place-items:center;gap:clamp(24px,4vw,64px);padding:72px 0 96px;text-align:center}
.hero-copy{position:relative;z-index:2;display:flex;width:100%;max-width:720px;flex-direction:column;align-items:center;margin-inline:auto}
.hero h1{max-width:720px;font-size:clamp(62px,7.4vw,112px);line-height:.86}
.hero h1 em,.page-title em,.legal h1 em{color:var(--text)}
.hero-copy>p:not(.eyebrow){max-width:650px;margin:28px auto}
.hero-actions{justify-content:center}
.google-play-button{width:clamp(210px,16vw,224px);height:40px;display:inline-flex;align-items:center;justify-content:flex-start;padding:6px 10px 6px 14px;border:1px solid var(--line-strong);border-radius:10px;background:#fff;box-shadow:0 8px 22px rgba(0,0,0,.12);cursor:pointer;transition:transform .28s cubic-bezier(.22,.8,.24,1),border-color .2s ease,box-shadow .28s ease}
.google-play-button:hover{transform:translateY(-2px) scale(1.035);border-color:var(--text);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.google-play-button:active{transform:translateY(0) scale(.965);transition-duration:.09s;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.google-play-button img{display:block;width:min(184px,100%);height:23px;object-fit:contain;object-position:left center;user-select:none;-webkit-user-drag:none}
.button{border-color:var(--text);background:var(--text);color:var(--bg)}
.button:hover{background:var(--bg);color:var(--text)}
.button.secondary{border-color:var(--line);background:transparent;color:var(--text)}
.button.secondary:hover{border-color:var(--text);background:var(--text);color:var(--bg)}
.product-frame{position:relative;z-index:1;right:auto;top:auto;width:100%;aspect-ratio:618/584;display:grid;place-items:center;overflow:visible;translate:0 0}
.hero-crocodile{display:block;width:100%;height:100%;object-fit:contain;filter:invert(1);animation:crocodile-breathe 6.6s ease-in-out infinite;transform-origin:58% 58%;user-select:none;-webkit-user-drag:none}
html[data-theme=light] .hero-crocodile{filter:none}

.section{text-align:center}
.section-intro{margin-inline:auto}
.section-intro p{margin-inline:auto}
.feature-grid{grid-template-columns:repeat(3,1fr);overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--bg)}
.feature{position:relative;min-height:220px;padding:30px!important;border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line);text-align:left;transition:background-color .22s ease}
.feature:nth-child(3n){border-right:0!important}
.feature:nth-last-child(-n+3){border-bottom:0}
.feature:hover{background:var(--surface-2)}
.feature-label{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.feature h3{margin:42px 0 12px;font-size:clamp(20px,1.75vw,27px);line-height:1.08;letter-spacing:-.035em}
.feature p{max-width:34ch;font-size:14px;line-height:1.55}
.features-section{position:relative;overflow:hidden;isolation:isolate}
.features-section>.shell{position:relative;z-index:2}
.features-section>.social-shape{z-index:1;pointer-events:none}
.storage-section{position:relative}
.storage-intro{margin-bottom:58px}
.storage-grid{display:grid;grid-template-columns:repeat(2,1fr);overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--bg)}
.storage-item{min-height:220px;padding:30px;text-align:left;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background-color .22s ease}
.storage-item:nth-child(2n){border-right:0}
.storage-item:nth-last-child(-n+2){border-bottom:0}
.storage-item:hover{background:var(--surface-2)}
.storage-item h3{margin:42px 0 12px;font-size:clamp(22px,2vw,30px);line-height:1.05;letter-spacing:-.04em}
.storage-item p{max-width:44ch;margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.download-card{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);align-items:center;gap:clamp(24px,5vw,72px);border:1px solid var(--text);background:var(--text);color:var(--bg)}
.download-card:after{display:none}
.download-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start}
.download-cassette{position:absolute;z-index:1;right:-18%;top:50%;display:block;width:min(58vw,720px);max-width:none;filter:none;transform:translateY(-50%) rotate(-14deg);transform-origin:50% 55%;animation:cassette-float 6.8s ease-in-out infinite;user-select:none;-webkit-user-drag:none;pointer-events:none}
html[data-theme=light] .download-cassette{filter:none}
.download-card .eyebrow{color:var(--bg)}
.download-card .button{border-color:var(--bg);background:var(--bg);color:var(--text)}
.download-card .button:hover{background:transparent;color:var(--bg)}
.page-head,.site-footer,.feature-grid,.section{border-color:var(--line)}
.footer-logo{display:inline-flex;width:clamp(152px,14vw,190px);align-items:center;pointer-events:none;user-select:none;-webkit-user-select:none}
.footer-logo img{display:block;width:100%;height:auto;filter:invert(1);transition:filter .28s ease;user-select:none;-webkit-user-drag:none}
html[data-theme=light] .footer-logo img{filter:none}
.page-kicker,.eyebrow,.meta{color:var(--muted)}
.notice,.support-panel,.contact-card{border-color:var(--line);background:var(--bg)}
.field input,.field select,.field textarea,.support-success>strong{border-color:var(--line);background:var(--bg)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--text);box-shadow:0 0 0 3px color-mix(in srgb,var(--text) 12%,transparent)}
.upload-field:hover{border-color:var(--text);background:var(--surface-2)}

.site-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;user-select:none;-webkit-user-select:none}
.ambient-sprite{position:absolute;display:block;width:clamp(22px,2.5vw,42px);max-height:64px;object-fit:contain;opacity:.075;filter:invert(1);animation:ambient-drift 11s ease-in-out infinite;animation-delay:var(--delay,0s);rotate:var(--rotate,0deg);scale:var(--sprite-scale,1);will-change:translate}
.ambient-sprite[src*="crocodile"]{width:clamp(48px,5vw,82px);max-height:78px}
html[data-theme=light] .ambient-sprite{filter:none;opacity:.065}
.ambient-sprite--1{left:4%;top:15%}.ambient-sprite--2{left:20%;top:9%}.ambient-sprite--3{left:42%;top:18%}.ambient-sprite--4{right:25%;top:11%}
.ambient-sprite--5{right:5%;top:22%}.ambient-sprite--6{left:8%;top:43%}.ambient-sprite--7{left:27%;top:55%}.ambient-sprite--8{right:38%;top:42%}
.ambient-sprite--9{right:10%;top:52%}.ambient-sprite--10{left:3%;bottom:13%}.ambient-sprite--11{left:38%;bottom:8%}.ambient-sprite--12{right:28%;bottom:17%}
.ambient-sprite--13{right:3%;bottom:7%}.ambient-sprite--14{left:17%;bottom:26%}
.social-shape{--repel-x:0px;--repel-y:0px;position:absolute;display:block;width:var(--shape-w,160px);height:var(--shape-h,160px);background:color-mix(in srgb,var(--text) 5%,var(--bg));opacity:1;-webkit-mask:url('/social-distance-square.svg') center/100% 100% no-repeat;mask:url('/social-distance-square.svg') center/100% 100% no-repeat;transform:translate(var(--repel-x),var(--repel-y)) rotate(var(--shape-rotate,0deg));transition:transform .24s cubic-bezier(.22,.8,.24,1);will-change:transform}
html[data-theme=light] .social-shape{background:color-mix(in srgb,var(--text) 4%,var(--bg));opacity:1}
.features-section>.social-shape,html[data-theme=light] .features-section>.social-shape{background:var(--text);opacity:1}
.social-shape--1{left:-5vw;top:5%;--shape-w:clamp(230px,18vw,350px);--shape-h:clamp(150px,15vw,245px);--shape-rotate:-3deg}
.social-shape--2{left:15%;top:9%;--shape-w:clamp(105px,8vw,155px);--shape-h:clamp(120px,12vw,190px);--shape-rotate:2deg}
.social-shape--3{left:-5vw;top:27%;--shape-w:clamp(300px,23vw,450px);--shape-h:clamp(260px,28vw,430px);--shape-rotate:-2deg}
.social-shape--4{left:21%;top:50%;--shape-w:clamp(110px,9vw,170px);--shape-h:clamp(150px,17vw,250px);--shape-rotate:4deg}
.social-shape--5{left:-5vw;bottom:-5%;--shape-w:clamp(300px,23vw,460px);--shape-h:clamp(200px,22vw,340px);--shape-rotate:2deg}
.social-shape--6{left:22%;bottom:-8%;--shape-w:clamp(190px,14vw,280px);--shape-h:clamp(155px,18vw,270px);--shape-rotate:-4deg}
.social-shape--7{right:-5vw;top:4%;--shape-w:clamp(260px,20vw,390px);--shape-h:clamp(220px,25vw,380px);--shape-rotate:3deg}
.social-shape--8{right:16%;top:21%;--shape-w:clamp(105px,9vw,170px);--shape-h:clamp(115px,13vw,200px);--shape-rotate:-3deg}
.social-shape--9{right:-6vw;top:40%;--shape-w:clamp(300px,24vw,470px);--shape-h:clamp(290px,33vw,500px);--shape-rotate:2deg}
.social-shape--10{right:9%;bottom:-8%;--shape-w:clamp(210px,17vw,330px);--shape-h:clamp(120px,16vw,240px);--shape-rotate:-3deg}
.social-shape--11{right:-3vw;bottom:-6%;--shape-w:clamp(100px,9vw,175px);--shape-h:clamp(125px,14vw,210px);--shape-rotate:3deg}
.social-shape--12{right:22%;bottom:7%;--shape-w:clamp(95px,8vw,150px);--shape-h:clamp(105px,11vw,170px);--shape-rotate:-2deg}

@keyframes crocodile-breathe{0%,100%{transform:translateY(0) scaleX(-1) scaleY(1)}50%{transform:translateY(-10px) scaleX(-1.025) scaleY(.985)}}
@keyframes ambient-drift{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes cassette-float{0%,100%{translate:0 0;scale:1}50%{translate:-5px -8px;scale:1.012}}

@media(max-width:920px){
  .brand>span{width:96px;height:30px}
  .hero{grid-template-columns:1fr;padding-top:56px}
  .hero-copy{width:min(690px,78vw)}
  .hero h1{font-size:clamp(58px,13vw,96px)}
  .product-frame{position:relative;right:auto;top:auto;width:min(52vw,350px);margin:0 auto;translate:0 0;opacity:.92}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .feature:nth-child(n){border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)}
  .feature:nth-child(2n){border-right:0!important}
  .feature:nth-last-child(-n+2){border-bottom:0}
  .ambient-sprite{opacity:.055}
  html[data-theme=light] .ambient-sprite{opacity:.05}
  .social-shape{opacity:1}
  html[data-theme=light] .social-shape{opacity:1}
  .page-head,.legal-layout,.support-layout{grid-template-columns:1fr;gap:32px}
  .legal-aside{max-width:620px}
  .toc{display:flex;max-width:100%;gap:18px;overflow-x:auto;padding:0 0 14px;flex-wrap:nowrap;scrollbar-width:none;scroll-snap-type:x proximity}
  .toc::-webkit-scrollbar{display:none}
  .toc a{flex:0 0 auto;padding-left:14px;scroll-snap-align:start;white-space:nowrap}
}
@media(max-width:600px){
  .brand>img{width:34px;height:34px;border-radius:9px}
  .brand>span{width:82px;height:26px}
  .hero{gap:34px;padding:46px 0 72px}
  .hero h1{font-size:clamp(50px,16vw,72px)}
  .hero{display:flex;flex-direction:column}
  .hero-copy{width:100%}
  .product-frame{position:relative;right:auto;top:auto;width:min(74vw,320px);margin:0 auto;translate:0 0;opacity:1}
  .feature{text-align:center}
  .feature-grid{grid-template-columns:1fr;border-radius:18px}
  .feature:nth-child(n){min-height:0;padding:26px 22px!important;border-right:0!important;border-bottom:1px solid var(--line)}
  .feature:last-child{border-bottom:0}
  .feature h3{margin-top:26px}
  .feature p{margin-inline:auto}
  .storage-grid{grid-template-columns:1fr;border-radius:18px}
  .storage-item:nth-child(n){min-height:0;padding:26px 22px;text-align:center;border-right:0;border-bottom:1px solid var(--line)}
  .storage-item:last-child{border-bottom:0}
  .storage-item h3{margin-top:26px}
  .storage-item p{margin-inline:auto}
  .footer-logo{width:150px}
  .download-card{display:flex;min-height:520px;align-items:center;text-align:center}
  .download-copy{align-items:center}
  .download-cassette{right:-45%;top:78%;width:min(112vw,470px);transform:translateY(-50%) rotate(-12deg)}
  .page-main{padding-top:46px;padding-bottom:86px}
  .page-head{gap:20px;padding-bottom:46px}
  .page-head .page-title,.legal h1{font-size:clamp(46px,14vw,62px);line-height:.92}
  .legal h1{margin-bottom:34px}
  .legal h2{margin-top:38px}
  .legal p,.legal li,.prose p,.prose li{font-size:14px;line-height:1.68}
  .support-panel{padding:20px;border-radius:16px}
  .ambient-sprite{opacity:.045;animation:none}
  html[data-theme=light] .ambient-sprite{opacity:.04}
  .ambient-sprite:nth-of-type(n+10),.social-shape:nth-of-type(n+7){display:none}
  .social-shape{opacity:1;transition:none}
  html[data-theme=light] .social-shape{opacity:1}
}
@media(prefers-reduced-motion:reduce){.hero-crocodile,.ambient-sprite,.download-cassette{animation:none!important}.social-shape{transition:none!important}}

/* Keep decorative artwork fixed; social squares retain their independent motion. */
.hero-crocodile,.ambient-sprite,.download-cassette{animation:none!important}

/* Portrait/mobile system: one resilient layout shared by every page. */
@media(max-width:767px){
  :root{--shell:min(calc(100% - 32px),720px);--page-gap:28px}
  html{-webkit-text-size-adjust:100%;scroll-padding-top:82px}
  body{min-width:0}
  img,svg{max-width:100%}
  .homebar-links a i{flex:0 0 auto}
  .hero{min-height:auto;gap:24px;padding:48px 0 68px}
  .hero-copy{width:100%;max-width:100%}
  .hero h1{max-width:100%;font-size:clamp(44px,15vw,66px);line-height:.9;letter-spacing:-.065em;overflow-wrap:anywhere}
  .hero-copy>p:not(.eyebrow){max-width:34ch;margin:20px auto;font-size:15px;line-height:1.55}
  .hero-actions{width:100%;gap:12px}
  .hero-actions .button{width:100%;min-height:48px}
  .google-play-button{width:min(100%,224px);height:40px;padding:6px 10px 6px 14px}
  .format-note{width:100%;font-size:10px;text-align:center}
  .product-frame{width:min(68vw,280px);max-width:100%;aspect-ratio:618/584;margin-inline:auto}
  .section{padding:72px 0}
  .section-intro{max-width:100%;margin-bottom:34px}
  .section-intro .eyebrow{margin-bottom:16px}
  .section-intro h2{font-size:clamp(36px,11.5vw,52px);line-height:.98;letter-spacing:-.055em;overflow-wrap:anywhere}
  .section-intro p{max-width:35ch;margin-top:16px;font-size:15px}
  .feature-grid,.storage-grid{grid-template-columns:minmax(0,1fr);border-radius:18px}
  .feature:nth-child(n),.storage-item:nth-child(n){min-height:0;padding:24px 20px!important;border-right:0!important;border-bottom:1px solid var(--line)!important;text-align:left}
  .feature:last-child,.storage-item:last-child{border-bottom:0!important}
  .feature h3,.storage-item h3{margin:24px 0 10px;font-size:23px}
  .feature p,.storage-item p{max-width:none;margin:0;font-size:14px}
  .features-section>.social-shape{display:none}
  .storage-intro{margin-bottom:34px}
  .download{padding:72px 0}
  .download-card{min-height:470px;padding:30px 22px;align-items:stretch;justify-content:flex-start;border-radius:22px;text-align:left}
  .download-copy{width:100%;align-items:flex-start;padding-bottom:220px}
  .download-card h2{max-width:10ch;margin-bottom:24px;font-size:clamp(40px,12vw,56px);line-height:.92;overflow-wrap:anywhere}
  .download-card .button{width:100%;min-height:48px}
  .download-cassette{right:-40%;top:auto;bottom:-18%;width:min(138vw,540px);transform:rotate(-13deg)}
  .page-main{min-height:auto;padding:48px 0 80px}
  .page-head{gap:16px;padding-bottom:38px}
  .page-head .page-title,.legal h1{max-width:100%;font-size:clamp(42px,12vw,58px);line-height:.94;letter-spacing:-.06em;overflow-wrap:anywhere;hyphens:auto}
  .page-kicker,.legal-aside .meta{padding-top:0}
  .legal-layout,.support-layout{gap:28px;padding-top:28px!important}
  .legal-aside,.support-aside{max-width:none;padding-top:0}
  .legal h1{margin-bottom:30px}
  .legal h2,.prose h2{margin-top:36px;font-size:clamp(22px,7vw,28px);line-height:1.08;overflow-wrap:anywhere}
  .legal p,.legal li,.prose p,.prose li{font-size:15px;line-height:1.65;overflow-wrap:anywhere}
  .legal ul,.prose ul{padding-left:20px}
  .notice{padding:15px 0 15px 16px}
  .toc{width:100%;display:flex;gap:8px;margin:0 -16px;padding:2px 16px 12px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-padding-inline:16px}
  .toc a{min-height:36px;display:flex;align-items:center;padding:6px 9px 6px 15px;font-size:12px}
  .contact-grid,.field-row{grid-template-columns:minmax(0,1fr)}
  .contact-card{padding:20px}
  .support-panel{min-width:0;padding:20px 16px;border-radius:16px}
  .support-form-head{display:grid;gap:14px;margin-bottom:28px}
  .support-state{justify-self:start;white-space:normal}
  .field input,.field select{height:50px;font-size:16px}
  .field textarea{min-height:150px;font-size:16px}
  .field small{gap:6px;align-items:flex-start;flex-direction:column}
  .upload-field{min-height:82px;gap:12px;padding:14px}
  .upload-field>span:last-child{flex:0 0 auto}
  .support-submit{align-items:stretch;flex-direction:column;gap:10px}
  .support-submit .button,.actions .button{width:100%}
  .actions{display:grid;grid-template-columns:1fr}
  .support-success>strong{font-size:18px;overflow-wrap:anywhere}
  .footer-row{min-height:0;align-items:flex-start;flex-direction:column;gap:16px}
  .footer-logo{width:140px}
  .site-footer{padding:26px 0 34px}
  .ambient-sprite{animation:none;opacity:.035}
  .ambient-sprite:nth-of-type(n+7){display:none}
}

@media(max-width:390px){
  :root{--shell:calc(100% - 24px)}
  .hero h1{font-size:clamp(40px,14.5vw,56px)}
  .section-intro h2{font-size:clamp(34px,11vw,44px)}
  .page-head .page-title,.legal h1{font-size:clamp(38px,11.5vw,48px)}
  .download-card h2{font-size:clamp(36px,11vw,46px)}
}

@media(hover:none),(pointer:coarse){
  .feature:hover,.storage-item:hover{background:var(--bg)}
  .button:hover{transform:none}
  .google-play-button:hover{transform:none}
  .google-play-button:active{transform:scale(.965)}
}
