/* The frame protects the WordPress page from workshop CSS and vice versa. */
:root{--dv-font:system-ui,sans-serif;--dv-heading-font:var(--dv-font);--paper:#fafafa;--white:#fff;--muted:var(--ink)}
body{font-family:var(--dv-font);background:var(--paper);line-height:1.65}
h1,h2,h3,.brand,.resource-card>summary span{font-family:var(--dv-heading-font)}
header{position:static;height:auto;min-height:78px;gap:16px;flex-wrap:wrap;padding:16px 20px}
.brand{font-size:15px}.brand .mark{display:none}.header-right{flex-wrap:wrap;gap:12px}
.welcome,.home-page{margin-top:28px;padding:0 20px}.home-page>h1{font-size:clamp(30px,4vw,44px)}
.shell{grid-template-columns:200px minmax(0,1fr);min-height:0}.workspace{padding:26px 24px 45px}
aside{padding:24px 12px}.reading,.inline-reading,.resource-task,.outcome,.round-inline,.notice{background:#f1f3f1}
@supports(background:color-mix(in srgb,red,white)){.reading,.inline-reading,.resource-task,.outcome,.round-inline,.notice{background:color-mix(in srgb,var(--green) 7%,white)}}
.mark{color:white}.home-page>.lead{max-width:740px}.small,.hint{opacity:.85}
#toast{position:sticky;bottom:16px;left:auto;transform:none;margin:0 auto;width:fit-content;max-width:95%}
@media(max-width:900px){.shell{display:block}aside{display:none}.mobile-nav{display:block;margin-bottom:20px}.home-steps,.home-bottom{grid-template-columns:1fr}.workspace{padding:22px 16px}.header-right{width:100%}}
@media print{header{display:none!important}#toast{display:none!important}}
/* The WordPress page supplies the title; the workshop supplies navigation. */
header{background:var(--paper);border-bottom:0;max-width:1080px;margin:0 auto;padding:18px 20px 0;min-height:0;justify-content:space-between}
.brand{font-size:13px;letter-spacing:0;font-weight:600;gap:0}
.brand>span:last-child{font-size:0}
.brand>span:last-child::after{content:'← Til start';font-size:13px}
.header-right{justify-content:flex-end}
.home-page{margin-top:24px}
@media(max-width:700px){header{padding:16px 20px 0}.header-right{width:auto}.header-right .saved{display:block;max-width:none;font-size:11px}.home-page{margin-top:24px}}
/* Practical information as four equal, clearly grouped labels. */
.home-facts{gap:10px;margin:24px 0 30px}
.home-facts>span{display:inline-flex;align-items:center;gap:9px;background:#fbf0f3;border:1px solid #efdae0;border-radius:8px;padding:9px 13px;color:var(--ink);font-size:13px;line-height:1.5}
.home-facts>span::before,.home-facts>span+span::before{content:'✓';display:inline-block;color:var(--green);font-size:14px;font-weight:700;margin:0}
@supports(background:color-mix(in srgb,red,white)){.home-facts>span{background:color-mix(in srgb,var(--green) 7%,white);border-color:color-mix(in srgb,var(--green) 15%,white)}}
@media(max-width:520px){.home-facts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.home-facts>span{padding:9px 10px;font-size:12px}}
/* Core Group blocks may add a layout wrapper in classic WordPress themes. */
.home-steps>.wp-block-group__inner-container,.home-bottom>.wp-block-group__inner-container{display:contents}
.wp-block-image img{max-width:100%;height:auto}.wp-block-embed iframe{width:100%;aspect-ratio:16/9;border:0}
/* The timer stays in the document flow so it cannot cover the work. */
.countdown{display:flex;flex-direction:column;align-items:flex-end;gap:9px;min-width:225px;max-width:310px;padding:14px;border:1px solid var(--line);border-radius:14px;background:white}
.countdown output{font:700 30px/1.2 var(--dv-heading-font);font-variant-numeric:tabular-nums;color:var(--ink)}
.countdown .actions{justify-content:flex-end}.countdown .btn{font-size:12px;padding:8px 11px}.countdown .small{font-size:11px;text-align:right}.countdown .pill{display:inline-block!important}.countdown .time-up{color:#a52d43}
header{position:static!important;top:auto!important;z-index:auto!important;transform:none!important}
@media(max-width:700px){.page-heading{display:block}.countdown{align-items:flex-start;max-width:none;width:100%;margin:15px 0}.countdown .actions{justify-content:flex-start}.countdown .small{text-align:left}}
@media print{.countdown{display:none!important}}

/* Optional planning support stays inside the existing workflow. */
.phase-editor{margin-top:18px}.phase-row{padding:16px 0;border-top:1px solid #d6ddd5}.phase-row h3{margin-top:0}.review-reminder{padding:14px 18px;margin:16px 0;border-left:3px solid #73917c;background:#f1f5ee;border-radius:8px}.review-reminder p{font-size:.9em;margin:6px 0;line-height:1.5}.review-reminder .text-btn{font-size:.9em}.phase-row textarea{min-height:90px}
.camera-dialog{width:min(680px,calc(100% - 32px));max-height:90vh;overflow:auto;border:1px solid #ccd6cc;border-radius:18px;padding:24px;color:inherit;background:#fff}.camera-dialog::backdrop{background:rgba(15,35,29,.65)}.camera-dialog h2{margin-top:0}.camera-stage{background:#172820;border-radius:10px;overflow:hidden}.camera-stage video,.camera-stage img{display:block;width:100%;max-height:45vh;object-fit:contain}.camera-dialog [hidden]{display:none!important}.camera-dialog .actions{margin-top:14px}.camera-dialog input[type=checkbox]{margin-right:8px}