:root{--navy:#1f3864;--navy-text:#fff;--role-bg:#dce6f1;--border:#bfc7d1;--correct:#2e7d32;--correct-bg:#e3f1e4;--wrong:#c62828;--wrong-bg:#fdeaea;--callout-bg:#e2efda;--focus:#0b57d0;--text:#1b1f27;--muted:#4a5360;--page-bg:#f4f6f9;--panel-width:420px;--font-body:"Trebuchet MS", "Segoe UI", sans-serif;--font-code:"Courier New", monospace}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-body);color:var(--text);background:var(--page-bg);margin:0;font-size:1rem;line-height:1.5}code,pre{font-family:var(--font-code)}h1,h2,h3{line-height:1.25}a{color:var(--focus)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app{max-width:1200px;margin:0 auto;padding:0 1rem 6rem}main{gap:1.25rem;display:grid}.header{background:var(--navy);color:var(--navy-text);margin:0 -1rem 1.25rem;padding:1rem}.header__top,.header__bottom{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;display:flex}.header h1{margin:0;font-size:1.5rem}.header__lo{font-size:1rem;font-weight:400}.header__buttons{gap:.5rem;display:flex}.header__bottom p{margin:.25rem 0 0}.header__progress{font-weight:700}.header__best{font-weight:400}.btn{min-height:44px;font:inherit;color:var(--navy-text);background:var(--navy);border:2px solid var(--navy);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;padding:.4rem 1.1rem;font-weight:700;text-decoration:none;display:inline-flex}.btn:hover:not(:disabled){background:#2c4c86;border-color:#2c4c86}.btn:disabled{color:#4a5360;cursor:not-allowed;background:#e1e5ea;border-color:#c5ccd5}.btn--light{color:var(--navy);background:#fff;border-color:#fff}.btn--light:hover:not(:disabled){background:var(--role-bg);border-color:var(--role-bg)}.btn--light-border{color:var(--navy);border-color:var(--navy);background:#fff}.btn--light-border:hover:not(:disabled){background:var(--role-bg);border-color:var(--navy)}.btn--small{min-height:36px;padding:.2rem .8rem;font-size:.9rem}.btn--large{padding:.6rem 1.6rem;font-size:1.1rem}.btn--link{color:var(--navy-text)}.btn--place{color:var(--navy);background:#fff;border-style:dashed;flex:100%}.pool{border:1px solid var(--border);background:#fff;border-radius:8px;padding:.75rem 1rem 1rem}.pool--over{outline:2px dashed var(--navy)}.pool__head{flex-wrap:wrap;align-items:center;gap:.25rem 1rem;margin-bottom:.5rem;display:flex}.pool__head h2{margin:0;font-size:1.1rem}.pool__feedback{flex:12rem;min-height:1.5rem;margin:0;font-weight:700}.pool__cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.5rem;display:grid}.pool__empty{color:var(--correct);margin:0;font-weight:700}.card{width:100%;min-height:44px;font:inherit;text-align:left;color:var(--text);border:1px solid var(--border);background:#fff;border-radius:8px;align-items:center;gap:.5rem;padding:.4rem .7rem;font-size:.95rem;display:flex;box-shadow:0 1px 3px #0000001f}.card--pool{cursor:grab;touch-action:manipulation}.card--pool:active{cursor:grabbing}.card--selected{border-color:var(--navy);outline:3px solid var(--navy);outline-offset:1px;background:var(--role-bg)}.card--dragging{opacity:.35}.card--overlay{cursor:grabbing;border-color:var(--navy);box-shadow:0 6px 16px #0000004d}.card--correct{color:#14401a;background:var(--correct-bg);border-color:var(--correct)}.card--wrong{color:#7a1010;background:var(--wrong-bg);border-color:var(--wrong);outline:2px solid var(--wrong);animation:.45s shake}.card__icon{text-align:center;width:1.2rem;color:var(--muted);flex:none;font-weight:700}.card--correct .card__icon{color:var(--correct)}.card--wrong .card__icon{color:var(--wrong)}.card__text{flex:1}.card__note{color:var(--wrong);flex:none;font-size:.8rem;font-weight:700}.role-table{border-collapse:collapse;border:1px solid var(--border);background:#fff;width:100%}.role-table thead th{text-align:left;color:var(--navy-text);background:var(--navy);border:1px solid var(--navy);padding:.6rem .75rem}.role-row>*{border:1px solid var(--border);vertical-align:middle;padding:.6rem .75rem}.role-row__name{text-align:left;background:var(--role-bg);width:22%}.role-row__title{margin-right:.4rem}.role-row__focus{width:16%}.info-btn{width:44px;height:44px;font:inherit;color:var(--navy);cursor:pointer;vertical-align:middle;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;padding:0;display:inline-flex}.info-btn:before{content:"i";border:2px solid var(--navy);background:#fff;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;font-family:Georgia,serif;font-size:1rem;font-style:italic;font-weight:700;display:inline-flex}.info-btn:hover:before,.info-btn[aria-expanded=true]:before{color:var(--navy-text);background:var(--navy)}.badge-complete{color:var(--correct);margin-top:.25rem;font-size:.85rem;font-weight:700;display:block}.zone{border:2px solid #0000;border-radius:8px;flex-wrap:wrap;gap:.4rem;min-height:3rem;padding:.3rem;display:flex}.zone>.card,.zone>.slot{flex:14rem;width:auto}.slot{min-height:44px;color:var(--muted);border:2px dashed var(--border);border-radius:8px;justify-content:center;align-items:center;padding:.4rem;font-size:.85rem;display:flex}.zone--over{background:var(--role-bg);border-color:var(--navy)}.zone--hint{background:#fff6d6;border-style:dashed;border-color:#8a6100}.zone--pulse{animation:.7s pulse}.zone--complete{border-color:var(--correct)}.check{flex-wrap:wrap;align-items:center;gap:.5rem 1rem;display:flex}.check__reason{color:var(--muted);margin:0}.callout{background:var(--callout-bg);border:1px solid #8fbc78;border-left:6px solid var(--correct);border-radius:8px;padding:.75rem 1.25rem}.callout h2{margin:0 0 .25rem;font-size:1.1rem}.callout p{margin:0}dialog.modal::backdrop{background:#0f172a99}.modal{width:100%;max-width:34rem;max-height:90vh;color:var(--text);background:#fff;border:0;border-radius:12px;padding:1.25rem 1.5rem;overflow-y:auto}.modal--wide{max-width:40rem}.modal h2{margin-top:0}.modal__actions{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.score__big{color:var(--navy);margin:0;font-size:2.5rem;font-weight:700}.score__label{color:var(--muted);font-size:1rem;font-weight:400}.score__band{margin:.25rem 0 1rem;font-weight:700}.score__stats{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.5rem;margin:0 0 1rem;display:grid}.score__stats div{background:var(--role-bg);border-radius:8px;padding:.5rem .75rem}.score__stats dt{color:var(--muted);font-size:.85rem}.score__stats dd{margin:0;font-size:1.25rem;font-weight:700}.score__table{border-collapse:collapse;width:100%}.score__table caption{text-align:left;margin-bottom:.25rem;font-weight:700}.score__table th,.score__table td{text-align:left;border-bottom:1px solid var(--border);padding:.4rem .6rem}.panel[open]{display:flex}.panel-backdrop{display:none}.panel{z-index:30;max-width:none;max-height:none;color:var(--text);background:#fff;border:0;flex-direction:column;margin:0;padding:0;position:fixed;box-shadow:0 0 24px #0000004d}.panel__head{color:var(--navy-text);background:var(--navy);justify-content:space-between;align-items:flex-start;gap:1rem;padding:1rem 1.25rem;display:flex}.panel__head h2{margin:0;font-size:1.25rem}.panel__focus{margin:.25rem 0 0}.panel__body{flex:1;padding:.5rem 1.25rem 1rem;overflow-y:auto}.panel__body h3{color:var(--navy);margin:1.25rem 0 .25rem;font-size:1rem}.panel__body ul{margin:.25rem 0;padding-left:1.25rem}.locked{border:1px dashed var(--muted);background:#eef0f3;border-radius:8px;padding:.6rem .8rem}.note{background:var(--callout-bg);border-left:5px solid var(--correct);border-radius:4px;padding:.6rem .8rem}.small{color:var(--muted);font-size:.85rem}.panel__foot{color:var(--muted);border-top:1px solid var(--border);background:#f4f6f9;padding:.75rem 1.25rem;font-size:.8rem}.panel__foot p{margin:0 0 .25rem}@media (width>=900px){.panel{height:auto;width:var(--panel-width);animation:.25s ease-out slide-in;inset:0 0 0 auto}.app--panel-open{margin-right:var(--panel-width);max-width:none;margin-left:0}}@media (width<=899px){.panel-backdrop{z-index:25;background:#0f172a80;display:block;position:fixed;inset:0}.panel{border-radius:16px 16px 0 0;width:100%;height:80vh;animation:.25s ease-out slide-up;inset:auto 0 0;overflow:hidden}}@media (width<=700px){.pool{z-index:10;max-height:38vh;position:sticky;top:0;overflow-y:auto}.pool__cards{grid-template-columns:1fr}.role-table,.role-table tbody,.role-row,.role-row>*{width:100%;display:block}.role-table thead{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.role-row{margin-bottom:.75rem}.role-row__name,.role-row__focus{width:100%}.role-row__focus:before{content:"Focus area: ";font-weight:700}}.float-ad{z-index:20;white-space:nowrap;color:#334155;cursor:pointer;background:#f8fafc;border:1px solid #0000;border-radius:6px;flex-direction:row;justify-content:flex-start;align-items:center;width:max-content;max-width:107px;height:60px;min-height:60px;padding:10px;font-size:x-small;line-height:normal;transition:max-width .8s ease-in-out,height .4s ease-in-out;display:flex;position:fixed;bottom:10px;right:20px;overflow:hidden}.float-ad a{color:inherit;text-decoration:none}.float-ad--open{border-color:#cbd5e1;max-width:75%;box-shadow:0 2px 8px #0000001f}.float-ad--mobile{font-size:xx-small;line-height:1.2}.float-ad--mobile.float-ad--open{white-space:normal;flex-direction:column;align-items:flex-start;max-width:95%;height:auto;min-height:80px}.float-ad__content{flex-direction:row;align-items:center;gap:5px;width:100%;display:flex}.float-ad--mobile.float-ad--open .float-ad__content{flex-direction:column;align-items:flex-start}.float-ad__logo{flex-shrink:0}.float-ad__details{flex-direction:column;gap:2px;display:flex}@media (width>=900px){.app--panel-open .float-ad{right:calc(var(--panel-width) + 20px)}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes pulse{0%,to{box-shadow:0 0 #2e7d3200}50%{box-shadow:0 0 0 6px #2e7d3273}}@keyframes slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}