/* IDGAF house look — set by the X product page (Doug's Claude Design handoff, 13 Oct 2026).
   Every page on idgaf.ai links this file. Page-specific rules live in the page. */
*{box-sizing:border-box}
:root{
  --ink:#14120F; --paper:#FFFFFF; --field:#F4F3F1; --strip:#F3F2EF; --rule:#E6E3DD; --mut:#8A847B; --mut2:#5E5A53; --dash:#B5B0A7;
  --night:#0E1220; --night-ink:#ECE8E6; --night-mut:#A9ADBB; --night-rule:#232B42;
  --matcha:#1C5A3A; --grapefruit:#F0435A; --honey:#F5B400;
  --mono:'Noto Sans','Noto Sans JP',system-ui,sans-serif; /* house face Noto Sans since 31 Oct (Doug); small data sets with tabular numerals */ --blk:'Noto Sans','Noto Sans JP',sans-serif;
  --pad:40px; --sectionPad:96px 40px; --h2:56px; --h3:40px;
}
@media (max-width:1023px){
  :root{ --pad:16px; --sectionPad:64px 20px; --h2:36px; --h3:30px; }
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);font-family:'Noto Sans','Noto Sans JP',system-ui,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;transition:opacity .18s}
a:hover{opacity:.8}
button{font:inherit}
img{display:block}
[hidden]{display:none !important}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.blk{font-family:var(--blk);font-weight:900;text-transform:uppercase;letter-spacing:-.01em;line-height:.92;text-wrap:balance}
.eyebrow{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.open{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);border:1px dashed var(--dash);padding:1px 6px;border-radius:2px;margin-left:6px;white-space:nowrap}
.wrap{max-width:1200px;width:100%;margin:0 auto}
.section{padding:var(--sectionPad)}
.section h2{margin:0;font-size:var(--h2)}
.section h3{margin:0;font-size:var(--h3)}
.lead{font-size:17px;line-height:1.6;max-width:52ch;text-wrap:pretty;margin:0}
@media (max-width:1023px){.lead{font-size:15px}}

/* strip + nav */
.strip{height:30px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;letter-spacing:.08em;background:var(--strip);white-space:nowrap}
nav.top{height:60px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--pad);border-bottom:1px solid var(--rule);font-size:13px;font-weight:500;letter-spacing:.04em;text-transform:uppercase}
nav.top .menu{all:unset;cursor:pointer;display:flex;align-items:center;gap:8px;white-space:nowrap;min-height:44px}
nav.top .menu i{display:inline-flex;flex-direction:column;gap:4px}
nav.top .menu i b{display:block;width:18px;height:1.5px;background:var(--ink)}
nav.top img{height:28px;width:auto}
nav.top .right{text-align:right;white-space:nowrap;display:flex;justify-content:flex-end;gap:20px}

/* the menu: white sheet over the page, page frozen underneath */
#menu{position:fixed;inset:0;z-index:30;background:var(--paper);display:flex;flex-direction:column;justify-content:space-between;padding:0 var(--pad) 32px;overflow-y:auto;overscroll-behavior:contain}
#menu .menu-top{height:60px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule)}
#menu .menu-top img{height:28px;width:auto}
#menu .menu-close{all:unset;cursor:pointer;display:flex;align-items:center;gap:8px;min-height:44px;font-size:13px;font-weight:500;letter-spacing:.04em;text-transform:uppercase}
#menu .menu-links{display:flex;flex-direction:column;gap:4px;padding:40px 0}
#menu .menu-links a{display:flex;align-items:baseline;gap:18px;font-family:var(--blk);text-transform:uppercase;font-size:clamp(36px,6vw,72px);line-height:1.05;letter-spacing:-.01em;padding:6px 0}
#menu .menu-links a span{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--mut);min-width:2.4em}
#menu .menu-foot{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--mut2);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--rule);padding-top:16px}

/* buttons */
.btn-ink{all:unset;cursor:pointer;height:56px;display:flex;align-items:center;justify-content:center;gap:12px;padding:0 24px;background:var(--ink);color:#fff;font-size:14px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;border-radius:2px;transition:opacity .18s;white-space:nowrap}
.btn-ink:hover{opacity:.85}
.btn-line{all:unset;cursor:pointer;height:44px;display:flex;align-items:center;justify-content:center;padding:0 18px;border:1px solid var(--ink);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;border-radius:2px;transition:background .18s,color .18s;white-space:nowrap}
.btn-line:hover{background:var(--ink);color:#fff}

/* chips and dose rows */
.chip{font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:2px;white-space:nowrap;border:1px solid;font-family:var(--mono)}
.chip.top{background:transparent;color:var(--night-mut);border-color:var(--night-mut)}
.chip.studied{background:#ECE8E6;color:#14120F;border-color:#ECE8E6}
.chip.pending{background:transparent;color:#F5B400;border-color:#F5B400}
.chip.garnish{background:transparent;color:#F0435A;border-color:#F0435A}
.chip.design{background:transparent;color:#1C5A3A;border-color:#1C5A3A}
.light .chip.top{color:var(--mut2);border-color:var(--dash)}
.light .chip.studied{background:var(--ink);color:#fff;border-color:var(--ink)}
.dose{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--night-rule);font-family:var(--mono);font-size:14px;font-variant-numeric:tabular-nums}
.dose .n{color:var(--night-mut)}
.dose .a{white-space:nowrap}
.light .dose{border-bottom-color:var(--rule)}
.light .dose .n{color:var(--mut2)}
@media (max-width:1023px){.dose{font-size:12px}}

/* footer */
footer.site{border-top:1px solid var(--rule);padding:var(--sectionPad)}
footer.site .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;font-size:13px;line-height:1.7}
@media (max-width:1023px){footer.site .wrap{grid-template-columns:minmax(0,1fr)}}
footer.site .col{display:flex;flex-direction:column;gap:14px;min-width:0}
footer.site .handles{font-family:var(--mono);font-size:12px;display:flex;flex-direction:column;gap:4px}
footer.site form{display:flex;border:1px solid var(--ink);border-radius:2px;overflow:hidden;max-width:360px}
footer.site input{flex:1;min-width:0;border:0;padding:12px 14px;font:inherit;font-size:13px;color:var(--ink);background:#fff;outline:none}
footer.site input::placeholder{color:var(--mut)}
footer.site button{border:0;padding:12px 16px;background:var(--ink);color:#fff;font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;cursor:pointer}
footer.site .links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}
footer.site .links div{display:flex;flex-direction:column;gap:6px}
footer.site .links .eyebrow{margin-bottom:6px}
footer.site .legal{grid-column:1 / -1;border-top:1px solid var(--rule);padding-top:16px;font-size:12px;color:var(--mut2);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer.site .legal img{height:22px;width:auto;opacity:.6}
.sr{position:absolute;left:-9999px}
