@font-face{font-family:"Bricolage";src:url(/static/fonts/BricolageGrotesque-VF.ttf) format("truetype");font-weight:200 800;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/static/fonts/IBMPlexMono-Medium.ttf) format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/static/fonts/IBMPlexMono-SemiBold.ttf) format("truetype");font-weight:600;font-display:swap}
:root{--bg:#0e1015;--card:#151821;--line:#262a35;--fg:#f1ece2;--dim:#a3a9b7;--soft:#b9b5ac;--amber:#ffb23e;--ink:#1a1206;
  --sans:"Bricolage","Avenir Next",system-ui,sans-serif;--mono:"Plex Mono",ui-monospace,Menlo,monospace;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-text-size-adjust:100%}
body.pub{background:radial-gradient(90% 40% at 50% 18%,#1b2030 0%,rgba(14,16,21,0) 100%),var(--bg);min-height:100vh;
  display:flex;flex-direction:column;align-items:center;padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
.pub-main{width:100%;max-width:420px;flex:1;display:flex;flex-direction:column;gap:18px;padding-top:8px}
a{color:var(--amber)}
.mark{display:flex;align-items:center;gap:9px;font-weight:800;font-size:22px;letter-spacing:-.03em}
.mark i{width:14px;height:14px;border-radius:3px;background:var(--amber);box-shadow:0 0 18px rgba(255,178,62,.55)}
h1{margin:0;font-size:44px;line-height:.98;font-weight:800;letter-spacing:-.045em;text-wrap:balance}
h1 .em{color:var(--amber);font-size:30px;letter-spacing:-.02em;word-break:break-all}
h2{margin:18px 0 6px;font-size:20px;letter-spacing:-.02em}
.lede{margin:0;font-size:18px;line-height:1.4;color:var(--soft)}
.fine{margin:0;font:500 12.5px/1.55 var(--mono);color:var(--dim)}
.note{margin:0;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line);font-size:15px;line-height:1.4}
.note.bad{border-color:rgba(252,165,165,.4);color:#fecaca}
.note.good{border-color:rgba(134,239,172,.35);color:#bbf7d0}
.choices{display:flex;flex-direction:column;gap:10px}
.btn{min-height:52px;border-radius:26px;display:flex;align-items:center;justify-content:center;gap:10px;font:700 17px/1 var(--sans);
  text-decoration:none;cursor:pointer;border:0;padding:0 22px;width:100%}
.btn-google{background:#fff;color:#1f1f1f}
.btn-amber{background:var(--amber);color:var(--ink);font-weight:800}
.btn-line{background:transparent;color:var(--fg);border:1px solid #3a3f4b}
.btn:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
details.email summary{list-style:none}
details.email summary::-webkit-details-marker{display:none}
details.email[open] summary{display:none}
.email-form{display:flex;flex-direction:column;gap:10px}
input[type=email]{min-height:52px;border-radius:16px;border:1px solid #3a3f4b;background:#0b0c10;color:var(--fg);font:500 17px var(--sans);padding:0 16px;width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.pub-foot{display:flex;gap:8px;justify-content:center;font:500 12px var(--mono);color:var(--dim);padding-top:20px}
.pub-foot a{color:var(--dim)}
.doc ul{padding-left:20px;line-height:1.55;color:var(--soft)}
.doc p{line-height:1.55;color:var(--soft)}
/* the little cube on the sign-in page */
.mini{height:190px;display:flex;align-items:center;justify-content:center;perspective:900px;position:relative}
.mini:after{content:"";position:absolute;left:28%;right:28%;bottom:8px;height:34px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,160,70,.28),rgba(255,160,70,0))}
.mini-cube{width:124px;height:124px;position:relative;transform-style:preserve-3d;transform:rotateX(-24deg) rotateY(-36deg);animation:spin 14s ease-in-out infinite alternate}
@keyframes spin{to{transform:rotateX(-24deg) rotateY(-54deg)}}
@media (prefers-reduced-motion:reduce){.mini-cube{animation:none}}
.mf{position:absolute;inset:0;padding:3px;background:#040506;display:grid;grid-template-columns:repeat(3,1fr);gap:2px;box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.mf b{border-radius:2px;display:flex;align-items:flex-end;padding:3px;font:800 10px/1 var(--sans);letter-spacing:-.02em;overflow:hidden;white-space:nowrap}
.f-front{transform:translateZ(62px)}
.f-right{transform:rotateY(90deg) translateZ(62px);filter:brightness(.76)}
.f-top{transform:rotateX(90deg) translateZ(62px);grid-template-columns:repeat(2,1fr);filter:brightness(1.08)}
.c1{background:#15171e;color:#f1ece2}.c2{background:#2f6fb8;color:#fff}.c3{background:#efe9dc;color:#16171b}.c4{background:#1f7a55;color:#fff}
.c5{background:#000;color:#ffb23e}.c6{background:#b42318;color:#fff}.c7{background:#0d3b2a;color:#6ee7a8}.c8{background:#1d2029;color:#f1ece2}.c9{background:#0a6da3;color:#fff}
.r1{background:#ff8a5c}.r2{background:#c2410c}.r3{background:#7c2d12}.r4{background:#15161c}.r5{background:#3b23a0}.r6{background:#ffb23e}.r7{background:#6b1d5c}.r8{background:#1e2a5a}.r9{background:#2a2d38}
.t1{background:#efe9dc}.t2{background:#14532d}.t3{background:#ff9f6e}.t4{background:#5b1d6e}
