
#blob-stoic{--bg:#101715;--panel:#1b2520;--line:#485347;--ink:#f1ebd8;--muted:#bdc4b5;--orange:#f47736;--olive:#a6b66e;font-family:system-ui,Arial,sans-serif;color:var(--ink);background:var(--bg);max-width:1100px;margin:auto;border:1px solid var(--line);line-height:1.55}#blob-stoic *{box-sizing:border-box}#blob-stoic .hero{padding:48px 26px;background:linear-gradient(95deg,#0d1714ee,#0d1714aa),url('https://images.unsplash.com/photo-1531058020387-3be344556be6?auto=format&fit=crop&w=1500&q=80') center/cover}#blob-stoic .eyebrow{color:var(--olive);letter-spacing:.18em;font-size:.75rem;font-weight:800}#blob-stoic h1{font-size:clamp(2.7rem,9vw,5.6rem);line-height:1;margin:12px 0;color:var(--ink);font-weight:950;letter-spacing:-.055em}#blob-stoic h2{font-size:clamp(1.5rem,4vw,2.2rem);margin:0 0 12px;line-height:1.15}#blob-stoic h3{margin:0 0 8px;font-size:1.13rem}#blob-stoic p{margin:0 0 14px}#blob-stoic .accent{color:var(--orange)}#blob-stoic .lead{max-width:680px;font-size:1.15rem}#blob-stoic .wrap{padding:28px 22px}#blob-stoic .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:14px}#blob-stoic .panel{background:var(--panel);border:1px solid var(--line);padding:20px;border-radius:8px}#blob-stoic .panel p:last-child{margin:0}#blob-stoic .section{margin-bottom:30px}#blob-stoic .tag{font-size:.73rem;font-weight:800;color:var(--olive);letter-spacing:.12em;margin-bottom:9px}#blob-stoic button,#blob-stoic .btn{font:inherit;font-weight:800;border-radius:5px;cursor:pointer;padding:11px 16px;border:1px solid var(--orange);background:var(--orange);color:#141714;text-decoration:none;display:inline-block}#blob-stoic button:hover,#blob-stoic .btn:hover{filter:brightness(1.13)}#blob-stoic button:focus-visible,#blob-stoic a:focus-visible{outline:3px solid #fff;outline-offset:3px}#blob-stoic .secondary{background:transparent;color:var(--ink);border-color:var(--line)}#blob-stoic .choices{display:grid;gap:9px;margin:15px 0}#blob-stoic .choices button{text-align:left;background:#25322b;color:var(--ink);border-color:#607064;font-weight:600}#blob-stoic .choices button[aria-pressed=true]{border-color:var(--orange);background:#4a3529}#blob-stoic .feedback{padding:14px;border-left:4px solid var(--olive);background:#26352b;margin-top:12px}#blob-stoic .small{font-size:.9rem;color:var(--muted)}#blob-stoic .meter{height:8px;background:#3a453e;border-radius:20px;overflow:hidden;margin:12px 0}#blob-stoic .meter span{display:block;height:100%;background:var(--orange);transition:width .2s}#blob-stoic .quote{font-size:1.35rem;font-weight:700;border-left:4px solid var(--orange);padding:12px 18px;background:#222c26}#blob-stoic .comic{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}#blob-stoic .comic .panel{min-height:150px;background:linear-gradient(140deg,#303e30,#17211d)}#blob-stoic .comic .face{font-size:2.4rem}#blob-stoic .footer{text-align:center;background:#0b110f;padding:24px;color:var(--muted)}#blob-stoic .hidden{display:none}#blob-stoic .result{font-size:1.3rem;font-weight:800;color:var(--olive)}@media(max-width:640px){#blob-stoic .comic{grid-template-columns:1fr}#blob-stoic .hero{padding:35px 20px}#blob-stoic .wrap{padding:20px 14px}}

/* Illustrated field-guide edition */
#blob-stoic{--bg:#181b15;--panel:#262b20;--line:#64694c;--ink:#eee7cf;--muted:#c3c5ad;--orange:#f18b43;--olive:#bdc78d;max-width:1240px;border:2px solid #080b08;box-shadow:8px 8px 0 #0a0c09;font-size:16px;isolation:isolate;background-image:repeating-linear-gradient(0deg,transparent,transparent 3px,#ffffff02 4px)}
#blob-stoic .masthead{display:flex;justify-content:space-between;gap:18px;padding:14px 28px;border-bottom:2px solid #080b08;background:#333a28;font-family:monospace;letter-spacing:.08em;font-size:12px}
#blob-stoic .masthead b{font-size:18px;color:var(--ink)}
#blob-stoic .hero{padding:0;display:grid;grid-template-columns:1fr 1.12fr;background:#1e241a;border-bottom:5px solid #080b08;overflow:hidden}
#blob-stoic .hero-copy{padding:40px 24px 36px 32px;z-index:1}
#blob-stoic h1{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(3.5rem,7vw,6.6rem);letter-spacing:-.03em;line-height:.95;margin:20px 0;transform:rotate(-2deg)}
#blob-stoic .hero-deck{font-size:clamp(1.3rem,2.8vw,2rem);line-height:1.12;font-weight:900;text-transform:uppercase;margin:22px 0}
#blob-stoic .lead{font-size:1.05rem;max-width:360px}
#blob-stoic .hero-art{margin:0;position:relative;min-width:0;display:flex;flex-direction:column;background:#737850;border-left:3px solid #080b08}
#blob-stoic .hero-art img{width:100%;height:100%;min-height:420px;object-fit:cover;object-position:center;display:block;flex:1}
#blob-stoic .hero-art figcaption{background:var(--orange);color:#171b13;font:900 12px monospace;letter-spacing:.08em;padding:10px 16px;transform:rotate(-2deg);position:absolute;bottom:20px;right:12px;box-shadow:4px 4px #0c100b;max-width:90%}
#blob-stoic .text-link{color:var(--ink);display:inline-block;padding:14px 0;font-weight:bold;font-size:13px}
#blob-stoic a{color:var(--orange)}
#blob-stoic .btn{color:#141714}
#blob-stoic .field-nav{display:flex;flex-wrap:wrap;gap:0;background:#0d100c;border-bottom:1px solid var(--line)}
#blob-stoic .field-nav a{font:700 11px monospace;letter-spacing:.03em;padding:16px;color:var(--ink);text-decoration:none;border-right:1px solid #484d38;flex:1;white-space:nowrap}
#blob-stoic .field-nav a:hover{background:#3a422b}
#blob-stoic .wrap{padding:38px 32px}
#blob-stoic .section{margin-bottom:38px;padding-bottom:36px;border-bottom:1px dashed #64694c;scroll-margin-top:24px}
#blob-stoic h2{font-family:Impact,'Arial Narrow',sans-serif;font-weight:900;font-size:clamp(1.9rem,3.6vw,2.7rem);letter-spacing:.01em}
#blob-stoic .tag{font-family:monospace;color:var(--orange);font-size:12px;margin-bottom:12px}
#blob-stoic .grid{gap:12px}
#blob-stoic .panel{border:1px solid #60664b;border-radius:0;background:linear-gradient(120deg,#333b28,#252b20);box-shadow:3px 3px #0c100b;padding:22px}
#blob-stoic .panel h3{color:#e5e8be}
#blob-stoic .comic .panel{padding:0 0 16px;background:#e2d8b7;color:#20251a;border:3px solid #070a07;box-shadow:5px 5px #080b08;transform:rotate(-1deg)}
#blob-stoic .comic .panel:nth-child(2){transform:rotate(1deg)}
#blob-stoic .comic h3,#blob-stoic .comic p{padding:0 16px;color:#20251a}
#blob-stoic .comic h3{font-size:1.2rem;margin-top:8px}
#blob-stoic .comic-art{height:230px;border-bottom:3px solid #080b08;background-image:url('comic.webp');background-size:300% auto;background-repeat:no-repeat}
#blob-stoic .comic-1{background-position:0 50%}#blob-stoic .comic-2{background-position:50% 50%}#blob-stoic .comic-3{background-position:100% 50%}
#blob-stoic .incident{font:900 11px monospace;background:#20251a;color:#f18b43;padding:5px 10px;display:inline-block;margin:12px 16px 2px}
#blob-stoic button,#blob-stoic .btn{border-radius:0;box-shadow:3px 3px #080b08;min-height:46px;font-size:14px}
#blob-stoic button:disabled{cursor:default;opacity:1}
#blob-stoic .choices button{line-height:1.5;white-space:normal}
#blob-stoic .hidden{display:none!important}
#blob-stoic .activity,#blob-stoic .exam{padding:28px;background:#303724;border:2px solid #858d5c;box-shadow:6px 6px #0b0e09}
#blob-stoic .exam{border-top:8px solid var(--orange)}
#blob-stoic .quote{margin-top:22px;font-size:1.3rem}
#blob-stoic .footer{font:800 13px monospace;line-height:1.8;border-top:3px solid var(--orange)}
#blob-stoic .meter{border-radius:0}
#blob-stoic .feedback{color:var(--ink)}
@media(max-width:800px){#blob-stoic .hero{grid-template-columns:1fr}#blob-stoic .hero-art{border-left:0;border-top:3px solid #080b08}#blob-stoic .hero-art img{min-height:0;aspect-ratio:3/2}#blob-stoic .hero-copy{padding:30px 24px}#blob-stoic .hero h1{font-size:5rem}#blob-stoic .masthead{padding:14px 18px}#blob-stoic .masthead span{max-width:180px}#blob-stoic .comic{grid-template-columns:1fr}#blob-stoic .comic-art{height:auto;aspect-ratio:1.35}#blob-stoic .wrap{padding:28px 18px}#blob-stoic .activity,#blob-stoic .exam{padding:20px 16px}}
@media(max-width:380px){#blob-stoic .hero h1{font-size:4rem}#blob-stoic .grid{grid-template-columns:1fr}#blob-stoic .masthead{flex-direction:column;gap:4px}#blob-stoic .masthead span{max-width:none}}
@media(prefers-reduced-motion:reduce){#blob-stoic *{transition:none!important;scroll-behavior:auto!important}}
