:root{font-family:Inter,Arial,sans-serif;font-synthesis:none;--ink:#183d30;--muted:#536d60;--green:#176b48;--line:#d9e5dc;--paper:#f4f7f3;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit;color:inherit}button,select{cursor:pointer}button,a,select,input{-webkit-tap-highlight-color:transparent}button{border:1px solid var(--line);background:white;border-radius:10px;padding:10px 13px;font-weight:650}button:hover{background:#e9f4eb;border-color:#83ad91}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e7a348;outline-offset:3px}a{color:var(--green)}button.primary{background:var(--green);color:white;border-color:var(--green)}.player{height:100svh;min-height:560px;padding:14px 18px;max-width:2000px;margin:auto;display:grid;grid-template-rows:34px 65px minmax(0,1fr);gap:12px}.player:fullscreen{max-width:none;background:var(--paper)}header{display:flex;gap:16px;align-items:center;min-width:0}.brand{font-size:21px;font-weight:800;text-decoration:none;letter-spacing:-.7px;color:var(--ink)}.brand span{color:#28875a}#format-title{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}header>button{margin-left:auto;font-size:12px;padding:7px 11px}.toolbar{display:grid;grid-template-columns:1.4fr 1fr 1.1fr 1.1fr .7fr;gap:8px}.toolbar>label,.toolbar>button{min-width:0;border:1px solid var(--line);background:white;border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;justify-content:center;text-align:left}.toolbar span{font-size:11px;color:var(--muted);margin-bottom:5px}.toolbar strong,.toolbar select{font-size:13px;font-weight:650}.toolbar select{border:0;background:none;width:100%;padding:0}.toolbar small{color:var(--muted);font-size:11px;font-weight:400}.toolbar #fullscreen{align-items:center;flex-direction:row;gap:7px;font-size:23px}.toolbar #fullscreen span{font-size:12px;margin:0;font-weight:650}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 295px;gap:12px;min-height:0}.scene{background:white;border:1px solid var(--line);border-radius:17px;min-width:0;min-height:0;display:grid;grid-template-rows:40px minmax(0,1fr) 35px;overflow:hidden}.scene-top,.scene-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px}.scene-top{border-bottom:1px solid #edf1ed;font-size:13px}.scene-top button,.scene-foot button{border:0;padding:5px;font-size:11px}.scene-foot{border-top:1px solid #edf1ed;font-size:11px;color:var(--muted)}.canvas{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden}.stage{position:relative;width:100%;aspect-ratio:3/2;flex:none;isolation:isolate}.stage>img{display:block;width:100%;height:100%;object-fit:contain}.stage>svg,.stage>div{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.stage>svg{z-index:2;overflow:visible}.stage #zone-layer{z-index:3}.stage #module-layer{z-index:4}.zone{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;font-size:clamp(9px,.8vw,12px);font-weight:700;line-height:1.2;padding:5px 7px;border-radius:6px;border:1px solid #bed0c2;background:#fffffff2;box-shadow:0 2px 5px #193e3312;max-width:22%;white-space:normal}.zone.active{background:#176b48;color:white;border-color:#176b48}.hotspot{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;width:29px;height:29px;padding:0;border-radius:50%;border:2px solid white;background:#1a674a;color:white;font-size:11px;font-weight:800;box-shadow:0 1px 6px #143e3345;display:grid;place-items:center}.hotspot:hover,.hotspot.active{background:#e8ad4c;color:#253e2b;box-shadow:0 0 0 3px #e8ad4c55;border-color:white}.hotspot.off{display:none}.route{fill:none;stroke:#148455;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;pointer-events:stroke;cursor:pointer;filter:drop-shadow(0 1px 2px white)}.route.future{opacity:.35;stroke-dasharray:5 5}.route.gap{stroke:#bd662c;stroke-dasharray:5 5}.route.active{stroke-width:5}.route-hit{fill:none;stroke:transparent;stroke-width:16;pointer-events:stroke;cursor:pointer}.route-dot{fill:white;stroke:#176b48;stroke-width:3;pointer-events:none}#loading{position:absolute;inset:0;display:grid;place-items:center;background:white;font-size:14px;color:var(--muted);margin:0}#loading[hidden]{display:none}.card{background:white;border:1px solid var(--line);border-radius:17px;padding:19px;display:flex;flex-direction:column;min-height:0;overflow:hidden}.eyebrow{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#647a6c;margin:0 0 9px;font-weight:750}.card h1,.card h2{font-size:21px;line-height:1.2;letter-spacing:-.025em;margin:0 0 12px}.card p{font-size:14px;line-height:1.55;margin:0 0 12px;color:var(--muted)}.card .number{display:inline-grid;place-items:center;background:#e5f0e5;color:#1b6a47;width:31px;height:31px;border-radius:9px;margin-bottom:12px;font-size:12px;font-weight:800}.tabs{display:flex;border-bottom:1px solid var(--line);gap:3px;margin-bottom:14px}.tabs button{border:0;border-bottom:2px solid transparent;border-radius:0;padding:10px 4px;font-size:11px;flex:1;background:none}.tabs button[aria-selected=true]{color:#136140;border-bottom-color:#176b48}.card-content{min-height:0;overflow:auto;scrollbar-width:thin;flex:1}.card-content ul,.card-content ol{padding-left:18px;font-size:13px;line-height:1.5;margin:0 0 12px}.card-content li{margin-bottom:8px}.card .actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.card .actions button,.card .actions a{font-size:12px;padding:9px 10px}.card .actions a{display:inline-flex;align-items:center}.step-counter{font-size:11px;color:var(--muted);margin:0 0 12px;display:flex;align-items:center;gap:8px}.step-track{flex:1;height:3px;background:#e4ebe5;border-radius:3px;overflow:hidden}.step-track i{height:100%;display:block;background:var(--green)}.step-controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:auto;padding-top:14px}.step-controls button{font-size:12px;padding:10px 4px}.card .notice{padding:10px 12px;border-radius:9px;font-size:12px;background:#fff2e4;color:#87531f;border:1px solid #efd6b9}.card .related{display:flex;flex-wrap:wrap;gap:6px}.related button{font-size:11px;padding:7px 8px}.card .compact-more{display:none}dialog{border:1px solid var(--line);border-radius:22px;padding:24px;color:var(--ink);width:min(740px,calc(100% - 28px));max-height:85svh;box-shadow:0 24px 80px #153e3340}dialog::backdrop{background:#0e2e255c;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}.dialog-head h2{margin:4px 0 0;font-size:24px;letter-spacing:-.02em}.dialog-head small{font-size:10px;color:var(--muted);letter-spacing:.08em}.dialog-head button{flex:none}.dialog-foot{display:flex;justify-content:space-between;margin-top:20px;position:sticky;bottom:-24px;padding:15px 0;background:white}#search{width:100%;border:1px solid var(--line);padding:12px;border-radius:10px;margin-bottom:14px}#module-list{display:grid;grid-template-columns:1fr 1fr;gap:7px}.module-choice{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:11px;cursor:pointer;font-size:13px}.module-choice input{accent-color:var(--green);width:18px;height:18px;flex:none}.module-choice small{font-size:11px;color:var(--muted);margin-right:4px}.module-choice:has(input:not(:checked)){background:#f6f7f5;color:#6c7a70}#detail-body{font-size:15px;line-height:1.6}#detail-body h3{font-size:18px;margin-top:23px}#detail-body li{margin-bottom:8px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 350px}.card{padding:25px}.card h2{font-size:25px}.card p{font-size:16px}.card-content ul,.card-content ol{font-size:15px}.hotspot{width:33px;height:33px;font-size:12px}}
@media(max-width:1050px){.player{padding:10px;gap:9px}.toolbar{grid-template-columns:1.2fr 1fr 1fr 1fr 48px}.toolbar #fullscreen span{display:none}.workspace{grid-template-columns:minmax(0,1fr) 250px}.card{padding:15px}.card h2{font-size:19px}.zone{font-size:9px;padding:4px 5px}.hotspot{width:25px;height:25px;font-size:10px}}
@media(max-width:900px){.player{height:100svh;min-height:520px;padding:8px;grid-template-rows:30px 107px minmax(0,1fr);gap:8px}header{gap:8px}.brand{font-size:17px}#format-title{font-size:11px}header>button{font-size:10px;padding:6px} .toolbar{grid-template-columns:1fr 1fr 42px;grid-template-rows:1fr 1fr;gap:5px}.toolbar>label,.toolbar>button{padding:7px 9px;border-radius:9px}.toolbar>label:first-child{grid-column:1/3}.toolbar>label:nth-child(2){grid-row:2;grid-column:1}.toolbar #modules-open{grid-row:2;grid-column:2}.toolbar>label:nth-child(4){display:none}.toolbar #fullscreen{grid-column:3;grid-row:1/3;justify-content:center;padding:0}.toolbar span{font-size:9px;margin-bottom:3px}.toolbar select,.toolbar strong{font-size:11px}.toolbar small{font-size:9px;display:block;margin-top:2px}.workspace{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 200px;gap:8px}.scene{grid-template-rows:31px minmax(0,1fr) 26px;border-radius:12px}.scene-top,.scene-foot{padding:0 8px;gap:5px}.scene-top{font-size:10px}.scene-top button,.scene-foot button{font-size:9px}.scene-foot{font-size:9px}.hotspot{width:23px;height:23px;font-size:9px;border-width:1.5px}.zone{font-size:8px;padding:3px 4px;border-radius:4px;max-width:24%}.card{padding:11px 13px;border-radius:12px;position:relative}.card .number{position:absolute;top:11px;left:12px;width:25px;height:25px;font-size:10px;margin:0}.card .number~h2{padding-left:34px}.card h2{font-size:17px;line-height:1.2;margin-bottom:7px;padding-right:22px}.card .eyebrow{font-size:9px;margin-bottom:5px}.card p{font-size:12px;line-height:1.45;margin-bottom:7px}.card .tabs{margin-bottom:7px}.card .tabs button{padding:6px 3px;font-size:10px}.card-content{overflow:hidden}.card-content ul,.card-content ol{font-size:11px;line-height:1.35;padding-left:15px;margin-bottom:0}.card-content li{margin-bottom:3px}.card .actions{display:none}.card .compact-more{display:block;position:absolute;right:9px;top:8px;border:0;padding:4px 7px;font-size:17px}.step-counter{font-size:9px;margin-bottom:6px}.step-controls{padding-top:6px;gap:5px}.step-controls button{padding:6px;font-size:11px}.card .notice{font-size:10px;padding:5px 7px}.card .related button{font-size:10px;padding:5px}.dialog-head h2{font-size:21px}dialog{padding:18px}#module-list{grid-template-columns:1fr}.dialog-foot{bottom:-18px}.mobile-pos{display:block!important}#detail-body{font-size:14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}
.focus-hidden{visibility:hidden;pointer-events:none!important}.stage{transform-origin:center}.stage.focused .hotspot{width:18px;height:18px;font-size:8px}.stage.focused .zone{font-size:7px;padding:3px 4px;max-width:25%}
.card-content{overflow:hidden}.card .compact-more{display:block;position:absolute;right:10px;top:10px;border:0;padding:4px 7px;font-size:17px}.card{position:relative}.card h2{padding-right:20px}
.zone.inactive{opacity:.45;filter:grayscale(1)}.zone-count{display:none}.card .compact-more{font-size:10px;font-weight:650;top:9px;right:8px;padding:5px;color:var(--green)}.card h2{padding-right:58px}
@media(max-width:900px){.stage:not(.focused) .hotspot{display:none}.zone{font-size:10px;min-height:29px;padding:4px 5px;max-width:25%}.zone-count{display:inline-flex;margin-left:3px;font-size:9px;color:#176b48;background:#e7f2e8;min-width:14px;height:14px;align-items:center;justify-content:center;border-radius:8px}.stage.focused .zone-count{display:none}.card .number~h2{padding-right:58px}.stage.focused .zone{font-size:8px;min-height:16px}}
.role-choice{display:flex;align-items:flex-start;gap:11px;padding:13px;border:1px solid var(--line);border-radius:10px;margin-bottom:14px;background:#edf5ed;font-size:13px;cursor:pointer}.role-choice input{accent-color:var(--green);width:18px;height:18px;flex:none;margin:1px 0 0}.role-choice small{display:block;color:var(--muted);font-size:11px;line-height:1.4;margin-top:5px}
.label-leader{stroke:#6e927e;stroke-width:1.4;fill:none;pointer-events:none}.label-anchor{fill:#4c785e;pointer-events:none}
@media(max-width:900px){.stage:not(.focused) .zone{max-width:68px;min-height:30px;max-height:38px;overflow:hidden;font-size:10px;line-height:1.15;padding:4px 5px}.stage:not(.focused) .zone-count{font-size:8px;min-width:12px;height:12px;margin-left:2px}}


/* On-scene labels and numbers. Positions avoid protected people and label boxes. */
.placement-leader{fill:none;stroke:#466b56;stroke-width:1;opacity:.65;vector-effect:non-scaling-stroke;pointer-events:none}
.zone{width:max-content;max-width:150px;font-size:11px;line-height:1.2;padding:5px 7px}
.hotspot{width:27px;height:27px;font-size:11px;background:#f8fff8;color:#174c34;border:1.5px solid #497a60;box-shadow:0 1px 4px #173f3520}
.hotspot.active{background:#176b48;color:#fff;border-color:#fff}
@media(max-width:900px){.stage:not(.focused) .zone{max-width:80px;font-size:10px;max-height:none}.stage.focused .hotspot{width:24px;height:24px;font-size:8px;min-width:0;min-height:0}.stage.focused .zone{max-width:100px;font-size:8px;line-height:1.2}.stage.focused .focus-hidden{display:none}}
