:root{--paper:#f4f1ec;--ink:#111;--bg-deep:#ede8e0;--line:#1111111a;--line-strong:#11111140;--mute:#11111194;--mute-2:#11111161;--accent:#dc2626;--accent-muted:#dc262614;--accent-strong:#b91c1c}*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{background:var(--paper);color:var(--ink);letter-spacing:-.005em;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}.nav{z-index:20;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#f4f1ecdb;justify-content:space-between;align-items:center;padding:16px clamp(18px,4vw,54px);display:flex;position:sticky;top:0}.brand{letter-spacing:-.035em;align-items:center;gap:12px;font-weight:880;display:flex}.brand img{width:32px;height:43px}.nav a{letter-spacing:.18em;text-transform:uppercase;min-height:44px;color:var(--mute);align-items:center;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,monospace;font-size:11px;display:flex}.hero{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1.03fr) minmax(340px,.78fr);align-items:end;gap:clamp(24px,5vw,70px);min-height:calc(100vh - 76px);padding:clamp(44px,7vw,92px) clamp(18px,4vw,54px);display:grid}.eyebrow{text-transform:uppercase;letter-spacing:.22em;color:var(--mute);margin:0 0 14px;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,monospace;font-size:10.5px}h1,h2,h3{letter-spacing:-.04em;margin:0;line-height:.98}h1{max-width:970px;font-size:clamp(60px,10vw,162px);font-weight:940}h2{font-size:clamp(44px,7vw,118px);font-weight:930}h3{font-size:24px;font-weight:820;line-height:1.1}.lead{color:#111111b8;max-width:760px;margin:26px 0 0;font-size:clamp(20px,2.2vw,30px);line-height:1.28}.example-row{flex-wrap:wrap;gap:8px;margin-top:28px;display:flex}.example-row button{border:1px solid var(--line);color:var(--mute);background:0 0;border-radius:999px;min-height:40px;padding:9px 12px}.example-row button:hover{border-color:var(--ink);color:var(--ink)}.roast-form{background:var(--ink);color:var(--paper);border-radius:28px;gap:12px;padding:clamp(20px,3vw,30px);display:grid;box-shadow:0 24px 80px #1111112e}.roast-form label{text-transform:uppercase;letter-spacing:.18em;color:#f4f1eca3;margin-top:6px;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,monospace;font-size:10px}.roast-form input,.roast-form textarea{width:100%;color:var(--paper);background:#f4f1ec14;border:1px solid #f4f1ec2e;border-radius:14px;outline:none;min-height:48px;padding:14px 15px}.roast-form textarea{resize:vertical;min-height:96px}.roast-form input::placeholder,.roast-form textarea::placeholder{color:#f4f1ec6b}.roast-form input:focus,.roast-form textarea:focus{background:#f4f1ec1c;border-color:#f4f1ec80}.roast-form button[type=submit]{background:var(--accent);color:#fff;border:0;border-radius:999px;min-height:52px;margin-top:8px;padding:14px 18px;font-weight:880}.roast-form button[disabled]{opacity:.72;cursor:wait}.error{color:#fecaca;margin:0}.empty-state,.results{padding:clamp(48px,8vw,106px) clamp(18px,4vw,54px)}.preview-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.preview-grid article{border:1px solid var(--line);background:var(--bg-deep);flex-direction:column;justify-content:space-between;min-height:240px;padding:22px;display:flex}.preview-grid span{letter-spacing:.18em;color:var(--accent);font-family:JetBrains Mono,ui-monospace,SFMono-Regular,monospace}.preview-grid p,.score-card p,.list-card li{color:var(--mute);line-height:1.45}.result-hero{grid-template-columns:1fr auto;align-items:end;gap:24px;margin-bottom:30px;display:grid}.result-hero a{color:var(--mute);word-break:break-all;margin-top:12px;display:inline-block}.big-score{aspect-ratio:1;background:var(--ink);width:clamp(150px,18vw,240px);color:var(--paper);border-radius:50%;align-content:center;place-items:center;display:grid}.big-score span{letter-spacing:-.07em;font-size:clamp(58px,8vw,110px);font-weight:940;line-height:.8}.big-score label{color:#f4f1ec8f;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,monospace}blockquote{border-left:8px solid var(--accent);background:var(--accent-muted);letter-spacing:-.035em;margin:0 0 30px;padding:18px 22px;font-size:clamp(26px,4vw,52px);font-weight:860;line-height:1.03}.score-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:12px;display:grid}.score-card{border:1px solid var(--line);background:#fff;padding:20px}.score-card>div{justify-content:space-between;align-items:baseline;gap:16px;display:flex}.score-card strong{letter-spacing:-.05em;font-size:38px}.score-bar{background:var(--bg-deep);border-radius:99px;height:10px;margin:16px 0;overflow:hidden}.score-bar span{background:var(--accent);height:100%;display:block}.list-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.list-card{border:1px solid var(--line);background:var(--bg-deep);min-height:270px;padding:22px}.list-card.kill{background:#dc262614}.list-card.steal{background:#15803d14}.list-card ul{gap:11px;margin:18px 0 0;padding-left:18px;display:grid}.refs{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px;margin-top:24px;padding-top:24px;display:flex}.refs .eyebrow{width:100%;margin-bottom:8px}.refs span{border:1px solid var(--line);color:var(--mute);background:#fff;border-radius:999px;padding:9px 12px}.login-shell{place-items:center;min-height:100vh;padding:22px;display:grid}.login-card{border:1px solid var(--line-strong);background:var(--bg-deep);width:min(540px,100%);padding:clamp(24px,5vw,38px)}.login-mark{width:54px;height:72px;margin-bottom:28px}.login-card h1{font-size:clamp(48px,8vw,80px)}.muted{color:var(--mute);line-height:1.45}.login-form{grid-template-columns:1fr auto;gap:10px;margin-top:26px;display:grid}.login-form input{border:1px solid var(--line-strong);background:#fff;min-height:50px;padding:14px 16px}.login-form button{background:var(--ink);color:var(--paper);border:0;min-height:50px;padding:14px 18px;font-weight:840}@media (max-width:980px){.hero,.result-hero{grid-template-columns:1fr}.roast-form{max-width:680px}.preview-grid,.score-grid,.list-grid{grid-template-columns:1fr 1fr}.big-score{width:160px}}@media (max-width:640px){.nav{padding:13px 18px}.brand img{width:28px;height:37px}.brand span{font-size:15px}.hero{min-height:auto;padding-top:42px;padding-bottom:52px}h1{font-size:clamp(52px,16vw,72px)}h2{font-size:clamp(46px,14vw,64px)}.lead{font-size:19px;line-height:1.34}.example-row{grid-template-columns:1fr 1fr;display:grid}.example-row button{width:100%}.roast-form{border-radius:22px}.preview-grid,.score-grid,.list-grid{grid-template-columns:1fr}.preview-grid article{min-height:190px}.result-hero{align-items:start}blockquote{font-size:28px}.big-score{width:138px}.login-form{grid-template-columns:1fr}}.tone-row{grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:4px;display:grid}.tone-pill{color:#f4f1ecbd;background:#f4f1ec14;border:1px solid #f4f1ec29;border-radius:999px;min-height:42px;padding:10px 8px;font-weight:600}.tone-pill.active{background:var(--accent);color:#fff;border-color:var(--accent)}.history{border-bottom:1px solid var(--line);padding:24px clamp(18px,4vw,54px)}.history .eyebrow{margin-bottom:12px}.history-row{gap:8px;padding-bottom:6px;display:flex;overflow-x:auto}.history-row button{border:1px solid var(--line);background:var(--bg-deep);text-align:left;border-radius:14px;flex:none;gap:4px;min-width:180px;padding:12px 16px;display:grid}.history-row button:hover{border-color:var(--ink)}.history-row strong{letter-spacing:-.02em;font-size:15px}.history-row span{letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-family:JetBrains Mono,ui-monospace,SFMono-Regular,monospace;font-size:11px}.actions-row{flex-wrap:wrap;gap:10px;margin:0 0 32px;display:flex}.btn-action{border:1px solid var(--line-strong);min-height:44px;color:var(--ink);background:0 0;border-radius:999px;padding:12px 18px;font-weight:700}.btn-action:hover{border-color:var(--ink)}.btn-action.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.loading-state{padding:clamp(48px,8vw,106px) clamp(18px,4vw,54px)}.loading-state h2{margin:0 0 14px;font-size:clamp(40px,6vw,80px)}.loading-state .muted{font-size:18px}@media (max-width:640px){.actions-row .btn-action{text-align:center;flex:calc(50% - 10px)}.actions-row .btn-action.primary{flex:100%}.history-row button{min-width:160px}}
