/* Stock Mom theme layer for the Options Deep Dive course.
   Loaded after styles.css. Colors come from the main site. */
body{font-synthesis:none;-webkit-font-smoothing:antialiased}
.rail .nav-mark,.brand-lockup small,.rail-chapter.open .rail-toggle{color:#FDB83E}
.rail-link.active{box-shadow:inset 3px 0 #FDB83E}
.brand-lockup img,.mobile-brand img{object-fit:contain;border-radius:50%;background:transparent}
figure img,.content img:not(.brand-lockup img):not(.mobile-brand img){border-radius:14px}
figure{border-radius:16px}

/* links back to the main site */
.site-back{display:inline-flex;align-items:center;gap:6px;margin-bottom:18px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.1);color:#F4EBDD;text-decoration:none;font:600 12px var(--sans)}
.site-back:hover{background:rgba(255,255,255,.18)}
.site-home{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:#fff;color:#2B2118;text-decoration:none;font-weight:700;font-size:14px;box-shadow:0 1px 2px rgba(110,64,16,.06),0 2px 8px rgba(110,64,16,.1)}
.site-home img{width:24px;height:24px}
.site-home:hover{box-shadow:0 2px 4px rgba(110,64,16,.05),0 12px 28px -8px rgba(110,64,16,.25)}
@media (max-width:700px){.site-home span{display:none}}
:focus-visible{outline:3px solid #42A652;outline-offset:3px;border-radius:6px}

/* rounded, shadowed cards to match the main site */
.playground-panel,.payoff-lab,.callout,.tldr,.position-matrix,figure,.calc-panel{border-radius:18px;box-shadow:0 2px 4px rgba(110,64,16,.05),0 12px 28px -8px rgba(110,64,16,.18);overflow:hidden}
.playground-panel,.payoff-lab{border-color:transparent;border-top:0;background:#fff}
.callout,.tldr{border-left-width:4px}
.playground-panel input,.playground-panel select,.payoff-lab input,.payoff-lab select{border-radius:10px}
.lab-note,.playground-panel p:last-child{color:var(--muted)!important}

/* broker screenshot walkthroughs */
.shot-gallery{margin:28px 0 8px}
.shot-gallery:not(:has(figure)){display:none}
.shot-title{font:700 15px var(--sans);margin:0 0 14px;color:var(--ink)}
.shots{display:grid;gap:22px}
.shots-phone{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.shot{margin:0;background:#fff;border-radius:18px;box-shadow:0 2px 4px rgba(110,64,16,.05),0 12px 28px -8px rgba(110,64,16,.2);overflow:hidden}
.shot img{display:block;width:100%;height:auto;border-radius:0!important;background:var(--panel)}
.shot-phone img{max-width:320px;margin:0 auto}
.shot figcaption{display:flex;gap:12px;align-items:flex-start;padding:14px 18px 16px;font-size:14px;line-height:1.5;color:var(--muted)}
.shot-step{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#FFE7C3;color:#D9741F;font:700 13px var(--sans);box-shadow:inset 0 0 0 1.5px #F39A4B}
.official-guide{margin:18px 0 26px;padding:16px 20px;border-radius:16px;background:#FFF1DE;font-size:15px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline}
.official-guide strong{width:100%;font-weight:700}
.official-guide a{color:#2E7D3E;font-weight:600}

/* members-only lock card (written by tools/split_course.py, filled in by js/course-access.js) */
.lock-card{margin:40px 0 64px;padding:32px;border-radius:22px;background:#FFF9F1;border:1px solid #EADBC6;box-shadow:0 2px 4px rgba(110,64,16,.05),0 12px 28px -8px rgba(110,64,16,.18);display:grid;gap:14px;justify-items:start;max-width:760px}
.lock-card h2{margin:0;font:400 clamp(26px,3vw,34px)/1.15 var(--serif);color:#2B2118}
.lock-icon{width:52px;height:52px;border-radius:16px;background:#FFF0CC;color:#B35F12;display:grid;place-items:center}
.lock-kicker{margin:0;font:700 12px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:#B35F12}
.lock-who{margin:0;font-size:17px;color:#4A3B2E;max-width:60ch}
.lock-list{margin:4px 0 0;padding-left:20px;color:#6E5F51;columns:2 260px;column-gap:32px}
.lock-list li{margin:0 0 6px;break-inside:avoid;scroll-margin-top:96px}
.lock-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.lock-btn{display:inline-flex;align-items:center;padding:10px 18px;border-radius:999px;font:700 14px var(--sans);text-decoration:none;color:#2B2118;border:1px solid #EADBC6;background:#fff}
.lock-btn:hover{border-color:#F39A4B}
.lock-btn.lock-primary{background:#F39A4B;border-color:#F39A4B}
.lock-premium .lock-icon{background:#FDB83E;color:#2B2118}
.account-btn{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;background:#fff;color:#2B2118;text-decoration:none;font-weight:700;font-size:14px;box-shadow:0 1px 2px rgba(110,64,16,.06),0 2px 8px rgba(110,64,16,.1);white-space:nowrap}
.account-btn:hover{box-shadow:0 2px 4px rgba(110,64,16,.05),0 12px 28px -8px rgba(110,64,16,.25)}
@media (max-width:700px){.lock-card{padding:22px}.account-btn{padding:7px 10px;font-size:13px}}

/* premium toolkit: calculators, verdicts, checklists (js/toolkit.js) */
.playground-panel.tool{padding:20px 22px}
.tool-checks{border:1px solid var(--hair);border-radius:14px;padding:12px 16px;margin:6px 0 4px;display:grid;gap:8px}
.tool-checks legend{font:600 10px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:0 6px}
.tool-checks label{display:flex;gap:10px;align-items:flex-start;font-size:15px;cursor:pointer}
.tool-checks input,.checklist input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:#2E7D3E}
.tool-verdicts{list-style:none;margin:10px 0 6px;padding:0;display:grid;gap:8px}
.tool-verdicts li{padding:10px 14px 10px 40px;border-radius:12px;font-size:15px;line-height:1.45;position:relative;background:#F6F1EA}
.tool-verdicts li::before{position:absolute;left:14px;top:10px;font-weight:700}
.tool-verdicts .v-ok{background:#E3F3E3}.tool-verdicts .v-ok::before{content:"✓";color:#2E7D3E}
.tool-verdicts .v-warn{background:#FFF0CC}.tool-verdicts .v-warn::before{content:"!";color:#9A5A0B}
.tool-verdicts .v-bad{background:#FBE3DC}.tool-verdicts .v-bad::before{content:"✕";color:#B3361F}
.tool-verdicts .v-info::before{content:"i";color:#6E5F51;font-style:italic}
.tool-call{margin:16px 0 4px;padding:18px 20px;border-radius:16px;background:#F6F1EA;border-left:5px solid #6E5F51}
.tool-call small{display:block;font:600 10px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.tool-call strong{display:block;margin:4px 0 6px;font:400 26px/1.15 var(--serif);color:#2B2118}
.tool-call p{margin:0;font-size:15px;max-width:68ch}
.tool-call.tone-ok{background:#E3F3E3;border-color:#42A652}
.tool-call.tone-warn{background:#FFF0CC;border-color:#FDB83E}
.tool-call.tone-bad{background:#FBE3DC;border-color:#C2412D}
.checklist{list-style:none;margin:14px 0;padding:0;display:grid;gap:6px}
.checklist label{display:flex;gap:12px;align-items:flex-start;padding:10px 14px;border:1px solid var(--hair);border-radius:12px;background:#fff;cursor:pointer;font-size:16px;line-height:1.45}
.checklist input:checked+*,.checklist label:has(input:checked){color:#6E5F51}
.checklist label:has(input:checked){background:#F3FAF3;border-color:#BFE3C4}
.playbook-actions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}
.tool-btn{font:700 14px var(--sans);padding:10px 18px;border-radius:999px;border:1px solid #F39A4B;background:#F39A4B;color:#2B2118;cursor:pointer}
.tool-btn.ghost{background:#fff;border-color:#EADBC6}
.tool-btn:hover{filter:brightness(1.04)}
/* print one playbook: everything else hidden */
@media print{
  body.print-one .rail,body.print-one .topbar,body.print-one .mobile-scrim,body.print-one .search-layer,
  body.print-one .chapter-hero,body.print-one .local-toc,body.print-one .playground-intro,body.print-one .lock-card{display:none!important}
  body.print-one .page-screen section.article:not(.print-target){display:none!important}
  body.print-one .shell{margin:0!important;padding:0!important}
  body.print-one .playbook-actions,body.print-one .see-also{display:none!important}
  body.print-one .checklist label{border:1px solid #999;break-inside:avoid}
}
.article ul.checklist{padding-left:0;margin-left:0}
.article ul.checklist li{margin-left:0}
.article ul.tool-verdicts{padding-left:0;margin-left:0}
/* narrow phones: the menu already has "Back to Stock Mom", so drop the logo button to fit the top bar */
@media (max-width:480px){.site-home{display:none}}
@media (max-width:480px){.topbar .crumb{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
/* premium lock cards: what's in the bundle */
.lock-bundle{width:100%;max-width:560px;background:#fff;border:1px solid #EADBC6;border-radius:16px;padding:14px 18px}
.lock-bundle-title{margin:0 0 8px;font:700 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#B35F12}
.lock-bundle ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.article .lock-bundle ul,.lock-card .lock-bundle ul{padding-left:0}
.lock-bundle li{display:flex;justify-content:space-between;gap:12px;padding:6px 8px;border-radius:8px;font-size:15px}
.lock-bundle li span{color:#6E5F51;white-space:nowrap;font-variant-numeric:tabular-nums}
.lock-bundle li.current{background:#FFF0CC}
.lock-fine{margin:8px 0 0;font-size:13px;color:#6E5F51}
