:root{--purple:#8E44AD;--deep:#6C3483;--pink:#E91E63;--indigo:#3F51B5;--green:#27AE60;--ink:#1C2833;--muted:#425466;--panel:rgba(251,252,253,.96);--soft:#F4F1F8;--line:rgba(52,73,94,.18);--shadow:0 14px 38px rgba(28,40,51,.12)}
*{box-sizing:border-box}html,body{height:auto;min-height:0;overflow:visible;margin:0;padding:0}body{font-family:Montserrat,Aptos,"Segoe UI",Arial,sans-serif;color:var(--ink);line-height:1.55;background:url("https://dcciportal.co.uk/wp-content/uploads/2026/02/Picture1.png") center/cover no-repeat scroll}button,input{font:inherit}button{cursor:pointer}.skip-link{position:absolute;left:1rem;top:-5rem;background:#fff;color:var(--ink);padding:.7rem 1rem;border-radius:999px;z-index:99}.skip-link:focus{top:1rem}.page-wrap{width:min(1160px,calc(100% - 1.4rem));margin:auto;padding:1rem 0 2rem}.dcci-app-header{text-align:center;padding:.5rem 1rem 1rem}.dcci-app-logo{display:block;width:min(185px,45vw);height:auto;margin:0 auto .65rem}.eyebrow,.phase-label{margin:0 0 .35rem;text-transform:uppercase;letter-spacing:.04em;font-size:.8rem;font-weight:800;color:var(--deep)}h1,h2,h3{line-height:1.18;margin:0 0 .7rem}h1{font-size:clamp(2rem,4vw,3.25rem)}h2{font-size:clamp(1.45rem,2.6vw,2.15rem);color:var(--deep)}h3{font-size:1.08rem}.subtitle{max-width:800px;margin:auto;color:var(--muted);font-size:1.05rem}.app-shell{position:relative;background:rgba(236,240,241,.94);border-radius:24px;box-shadow:var(--shadow);padding:clamp(1rem,2.4vw,1.6rem);overflow:hidden}.app-shell:before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:linear-gradient(var(--purple),var(--pink) 34%,var(--indigo) 67%,var(--green))}.intro-panel,.step-panel{background:var(--panel);border-radius:20px;padding:clamp(1rem,2.5vw,2rem);box-shadow:0 7px 22px rgba(28,40,51,.08)}.intro-panel{display:grid;grid-template-columns:1.25fr .75fr;gap:1.5rem;align-items:center}.step-panel{display:none}.step-panel.active{display:block}.intro-panel[hidden]{display:none}.ground-rule,.reflection-strip,.source-note{padding:1rem 1.1rem;border-radius:14px;background:#F2ECF7;border-left:4px solid var(--purple);margin:1rem 0}.case-file{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:1.6rem 1.2rem 1.2rem;box-shadow:0 10px 25px rgba(28,40,51,.08)}.file-tab{position:absolute;top:-.65rem;left:1rem;background:var(--deep);color:#fff;padding:.35rem .8rem;border-radius:999px;font-size:.76rem;font-weight:800}.case-hero{display:block;width:100%;height:auto;max-height:390px;object-fit:contain;object-position:center;border-radius:14px;margin:0 auto 1rem;background:#F7F5FA}.case-file dl{margin:0}.case-file dl div{display:grid;grid-template-columns:minmax(118px,.42fr) minmax(0,1fr);column-gap:1.1rem;align-items:start;padding:.72rem 0;border-top:1px solid var(--line)}.case-file dt{font-weight:800;line-height:1.35}.case-file dd{margin:0;min-width:0;line-height:1.45;overflow-wrap:anywhere}.step-nav{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:1rem 0}.step-tab{border:1px solid rgba(108,52,131,.25);background:rgba(255,255,255,.86);color:var(--deep);border-radius:999px;padding:.55rem .75rem;min-height:45px;min-width:122px;font-weight:800}.step-tab.active{background:linear-gradient(135deg,var(--deep),var(--purple));color:#fff}.progress-wrap{display:flex;gap:.8rem;align-items:center;margin:0 0 1rem}.progress-bar{height:11px;flex:1;background:rgba(52,73,94,.15);border-radius:999px;overflow:hidden}.progress-bar span{display:block;height:100%;width:14.28%;background:linear-gradient(90deg,var(--purple),var(--pink),var(--indigo),var(--green));transition:width .2s ease}.progress-wrap p{margin:0;font-weight:800;color:var(--muted);white-space:nowrap}.step-heading{margin-bottom:1rem}.card-grid{display:grid;gap:1rem}.card-grid.three{grid-template-columns:repeat(3,1fr)}.info-card,.signal-panel,.feedback-panel,.whole-system,.debrief-summary,.submit-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:1rem 1.1rem}.signal-panel{margin-top:1rem}.signal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}.signal-grid span{background:#F4F1F8;border:1px solid rgba(108,52,131,.16);border-radius:12px;padding:.75rem;font-weight:700}.timeline{position:relative;margin:1rem 0}.timeline:before{content:"";position:absolute;left:83px;top:.3rem;bottom:.3rem;width:3px;background:linear-gradient(var(--purple),var(--indigo),var(--green))}.timeline article{display:grid;grid-template-columns:72px 1fr;gap:1.5rem;position:relative;margin:0 0 1rem}.timeline time{font-weight:900;color:var(--deep);text-align:right;padding-top:.25rem}.timeline article div{background:#fff;border:1px solid var(--line);border-radius:15px;padding:.9rem 1rem;position:relative}.timeline article div:before{content:"";position:absolute;left:-1.82rem;top:1rem;width:13px;height:13px;border-radius:50%;background:var(--purple);border:3px solid #fff;box-shadow:0 0 0 1px rgba(108,52,131,.25)}.timeline p{margin:0}.context-reveal{background:#F4F1F8;border-radius:14px;padding:.85rem 1rem;margin:1rem 0}.context-reveal summary{font-weight:800;color:var(--deep);cursor:pointer}.instruction{max-width:820px;color:var(--muted)}.choice-grid{border:0;padding:0;margin:1rem 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.choice-grid label{display:block;position:relative}.choice-grid input{position:absolute;opacity:0;pointer-events:none}.choice-grid span{display:flex;align-items:center;min-height:68px;padding:.8rem 1rem;border:2px solid rgba(52,73,94,.15);border-radius:14px;background:#fff;font-weight:700;transition:.15s ease}.choice-grid input:checked+span{border-color:var(--purple);background:#F1E8F6;box-shadow:inset 5px 0 var(--purple)}.choice-grid input:focus-visible+span{outline:4px solid rgba(142,68,173,.35);outline-offset:2px}.reveal-button,.secondary-action,.ghost-action,.primary-action{border-radius:999px;min-height:48px;padding:.72rem 1.15rem;font-weight:800;border:0}.primary-action{background:linear-gradient(135deg,var(--deep),var(--purple));color:#fff}.ghost-action{background:#fff;color:var(--deep);border:1px solid rgba(108,52,131,.3)}.reveal-button,.secondary-action{background:#EDE6F2;color:var(--deep);border:1px solid rgba(108,52,131,.18)}.feedback-panel{margin-top:1rem;border-left:5px solid var(--green);background:#F4FBF7}.step-actions{display:flex;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin-top:1.3rem}.whole-system{margin-top:1.2rem}.rings{display:flex;flex-direction:column;align-items:center;gap:.35rem;margin:1rem auto;max-width:760px}.rings span,.rings strong{display:block;text-align:center;border-radius:999px;padding:.55rem 1rem}.rings span:nth-child(1){width:100%;background:#DDEAE7}.rings span:nth-child(2){width:88%;background:#D8E1EB}.rings span:nth-child(3){width:76%;background:#E2DCEE}.rings span:nth-child(4){width:64%;background:#EED9E7}.rings span:nth-child(5){width:52%;background:#E7F0DD}.rings strong{width:38%;min-width:130px;background:var(--deep);color:#fff}.debrief-summary{margin-top:1.2rem}.summary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}.summary-card{background:#F7F7F9;border-radius:14px;padding:.9rem 1rem;border:1px solid var(--line)}.summary-card h4{margin:0 0 .4rem;color:var(--deep)}.summary-card ul{margin:.35rem 0 0;padding-left:1.2rem}.summary-card .empty{color:var(--muted);font-style:italic}.submit-panel{margin-top:1.2rem;background:#F2ECF7}.submit-status{font-weight:800;margin:.7rem 0 0}.app-footer{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem .5rem 0;color:var(--muted);font-size:.92rem}.app-footer a{color:var(--deep);font-weight:800}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:4px solid rgba(142,68,173,.4);outline-offset:3px}@media(max-width:800px){.intro-panel{grid-template-columns:1fr}.card-grid.three,.signal-grid,.choice-grid,.summary-grid{grid-template-columns:1fr}.timeline:before{left:9px}.timeline article{grid-template-columns:1fr;padding-left:1.8rem;gap:.25rem}.timeline time{text-align:left}.timeline article div:before{left:-1.72rem}.case-file dl div{grid-template-columns:minmax(105px,.4fr) minmax(0,1fr);column-gap:.9rem}.app-footer{flex-direction:column;align-items:flex-start}}@media(max-width:480px){.case-file dl div{grid-template-columns:1fr;gap:.18rem}.case-file dt{color:var(--deep)}.case-file dd{padding-left:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}