/*! You Suck at Living. © 2026 Jef van de Graaf. All rights reserved. https://yousuckatliving.com */
:root{--bg: #14110d;--paper: #f3efe6;--ink: #1d1a15;--dim: #6b6358;--light: #f3efe6;--sodium: #ffae62}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -10%,#3a2a16 0%,var(--bg) 60%) fixed;color:var(--light);font:16px/1.6 Courier Prime,Courier New,monospace;min-height:100vh}a{color:inherit}.top{text-align:center;padding:48px 16px 20px}.logo{display:inline-block;font:400 44px/.95 Anton,Impact,sans-serif;letter-spacing:.01em;text-decoration:none}h1{font:400 34px Special Elite,Courier New,monospace;margin:22px 0 6px}.lede{margin:0 auto 20px;max-width:520px;color:#cfc8bb;text-wrap:balance}.cta{display:inline-block;background:#000;color:#fff;border:2px solid #fff;border-radius:12px;padding:12px 26px;font:800 16px Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer}.cta:hover{background:#fff;color:#000}.cta.ghost{background:transparent}.tabs{display:flex;justify-content:center;gap:8px;margin:8px 0 24px}.tab{background:none;border:1px solid rgba(243,239,230,.35);color:var(--light);border-radius:999px;padding:8px 16px;font:600 14px Inter,system-ui,sans-serif;cursor:pointer}.tab.on{background:var(--light);color:var(--ink)}main{max-width:1120px;margin:0 auto;padding:0 16px 40px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:18px;align-items:start}.card{background:var(--paper);color:var(--ink);padding:22px 22px 16px;box-shadow:0 10px 30px #00000073;position:relative}.card pre{margin:0 0 14px;white-space:pre-wrap;font:17px/1.55 Courier Prime,Courier New,monospace}.card .prompt{margin:0 0 14px;font-size:13px;color:var(--dim)}.card .by{display:flex;align-items:center;gap:10px;border-top:1px dashed rgba(29,26,21,.3);padding-top:12px}.card .av{width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font:400 15px Anton,Impact,sans-serif;flex:none}.card .name{font-weight:700;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card .share{background:none;border:1px solid var(--ink);border-radius:8px;padding:5px 10px;font:600 12px Inter,system-ui,sans-serif;color:var(--ink);cursor:pointer}.card .stamp{position:absolute;top:12px;right:12px;font:400 12px Special Elite,monospace;color:#8a3a12;border:2px solid #8a3a12;padding:2px 8px;transform:rotate(4deg)}#single{max-width:620px;margin:0 auto 30px}#single .card pre{font-size:20px}#single .back{display:block;text-align:center;margin:16px 0 0}.empty{text-align:center;color:#cfc8bb}#more{display:block;margin:26px auto 0}.foot{text-align:center;padding:20px 16px 40px;color:#a39b8e;font:14px Inter,system-ui,sans-serif}@media (max-width: 600px){.top{padding-top:32px}.logo{font-size:36px}h1{font-size:28px}}[hidden]{display:none!important}.card pre.clamp{max-height:9.3em;overflow:hidden;-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}.card .more{background:none;border:0;padding:0;margin:-6px 0 14px;font:700 14px Courier Prime,monospace;color:#8a3a12;text-decoration:underline;cursor:pointer}.chip{position:fixed;top:max(14px,env(safe-area-inset-top));right:14px;height:36px;padding:0 14px;display:inline-flex;align-items:center;border-radius:18px;border:1px solid rgba(243,239,230,.3);background:#00000080;color:var(--light);font:600 13px Inter,system-ui,sans-serif;text-decoration:none;z-index:5}.card.has-stamp{padding-top:46px}.card .mine{display:flex;flex-wrap:wrap;gap:10px;align-items:center;border-top:1px dashed rgba(29,26,21,.3);padding-top:12px;font-size:14px}.card .mine .st{flex:1 1 100%;color:var(--dim);font-size:13px}.card .mine label{display:flex;gap:6px;align-items:center;cursor:pointer}.card .mine .enter{margin-left:auto;background:#000;color:#fff;border:2px solid #000;border-radius:10px;padding:7px 14px;font:800 13px Inter,system-ui,sans-serif;cursor:pointer}.card .mine .enter[disabled]{background:transparent;color:#8a3a12;border-color:#8a3a12;cursor:default}.card .stamp.sample{right:auto;left:12px;color:var(--dim);border-color:var(--dim);transform:rotate(-3deg);letter-spacing:.08em;text-transform:uppercase}.beta-note{margin:0 auto 26px;max-width:560px;font:14px/1.5 Inter,system-ui,sans-serif;color:#cfc8bb;text-wrap:balance}.beta-note strong{display:inline-block;margin-right:8px;padding:1px 8px;border:1px solid var(--sodium);border-radius:999px;color:var(--sodium);font-size:11px;letter-spacing:.1em;text-transform:uppercase;vertical-align:1px}
