/* Shared utility interaction layer. Game cells retain their own geometry. */
:root{scroll-padding-top:16px}
body{line-height:1.55}
main,form,fieldset,.card,.fields>*{min-width:0}
button{white-space:normal;overflow-wrap:anywhere;max-width:100%}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:max(16px,1em);max-width:100%;box-sizing:border-box}
form button,.actions button,header a,footer button,.language-switch summary,.language-panel a,.ux-helper button{min-height:44px}
form details>summary{min-height:44px;padding:10px;box-sizing:border-box;cursor:pointer}
button:disabled{cursor:default}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid #1565c0;outline-offset:3px}
.ux-skip{position:fixed;inset-inline-start:12px;top:-100px;z-index:1000;background:#fff;color:#163d66;padding:12px 18px;border:2px solid #163d66;border-radius:8px}
.ux-skip:focus{top:12px}
.ux-helper{margin:12px 0;padding:12px;border:1px solid #a8b9b1;border-radius:10px;background:#f4f8f6;color:#18382f}
.ux-helper label{display:block}.ux-helper input{margin:6px 0}.ux-helper button{margin:4px 8px 4px 0}
.ux-reset-check{border:2px solid #93621b;background:#fff8e9;color:#4a3418}
.ux-count{font-size:14px;color:#40534b}.ux-result-heading:focus{outline:3px solid #1565c0;outline-offset:3px}
.portfolio-network details{background:#f6f9f7;border:1px solid #b9c7ba;border-radius:10px;padding:4px}
.portfolio-search{display:block;margin:12px}.portfolio-search input{display:block;width:100%;margin:6px 0;padding:10px;border:1px solid #748c80;border-radius:6px}
[data-tool-id][hidden]{display:none!important}
@media(max-width:600px){.intro{padding-block:20px!important}.intro h1{font-size:clamp(28px,8vw,40px)!important;line-height:1.16}.intro>p{margin-block:10px}.actions{gap:10px;flex-wrap:wrap}.actions button{flex:1 1 auto}.portfolio-network h2{font-size:22px}.fields{grid-template-columns:1fr!important}.card{max-width:100%;box-sizing:border-box}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media print{.ux-skip,.ux-helper,.portfolio-search{display:none!important}}

/* Modern network cards are activated only on individually reviewed pages. */
.design-refresh .portfolio-network{margin-top:48px;padding-top:32px;border-color:#dce7e4}
.design-refresh .portfolio-network h2{letter-spacing:-.035em;font-size:clamp(24px,4vw,32px);line-height:1.2}
.design-refresh .portfolio-network details{padding:16px;border:1px solid #dce7e4;border-radius:20px;background:#f5faf8}
.design-refresh .portfolio-grid{gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
.design-refresh .portfolio-card{position:relative;background:#fff;border:1px solid #dce7e4;border-radius:18px;padding:20px;box-shadow:0 4px 14px #173f3806;text-align:start}
.design-refresh .portfolio-card h3{font-size:18px;line-height:1.3;letter-spacing:-.025em;margin:14px 0 8px}
.design-refresh .portfolio-card p{line-height:1.65;color:#49625c;margin:8px 0}
.design-refresh .portfolio-symbol{display:block;width:48px;height:48px;aspect-ratio:1;padding:12px;background:#eaf5f0;border-radius:14px;fill:none;stroke:#237560;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.design-refresh .portfolio-soon{font-size:12px;color:#52665e}
.design-refresh .portfolio-search{margin:12px 0}.design-refresh .portfolio-search input{background:white;border-color:#afc6bb;border-radius:12px;min-height:48px}
.design-refresh .portfolio-network summary{padding:8px 0;min-height:44px}
@media(max-width:760px){.design-refresh .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.design-refresh .portfolio-grid{grid-template-columns:1fr}.design-refresh .portfolio-network details{padding:12px}}

/* Reviewed task pages: centered workspace and an explicit primary activity. */
body.task-flow{color:#173f38;background:radial-gradient(ellipse at 80% 0,#e6f2ec 0,transparent 45%),#f6faf8}
.task-flow main{max-width:1120px;margin-inline:auto;padding:20px 24px 40px}
.task-flow .intro{max-width:660px;margin-inline:auto;text-align:center;padding-block:12px!important}
.task-flow .intro h1{font-size:clamp(30px,4.5vw,44px)!important;line-height:1.12;letter-spacing:-.045em;margin:8px 0}
.task-flow .intro>p{margin:8px auto;max-width:56ch;font-size:1rem!important;color:#49625c}
.task-flow .play,.task-flow main>.card{max-width:840px;margin-inline:auto;background:white;border:1px solid #d4e4dd;border-radius:24px;padding:20px;box-shadow:0 12px 40px #173f3808}
.task-flow [data-primary]{background:#176958;color:white;border-color:#176958;font-weight:750;min-height:48px;border-radius:12px;padding:10px 22px}
.task-flow [data-primary]:hover:not(:disabled){background:#125343}
.task-flow [data-primary]:disabled{opacity:.55;cursor:default}
.task-flow .task-advanced{margin:12px 0;border:1px solid #d4e4dd;border-radius:12px;padding:10px 14px;background:#f5faf8}
.task-flow .task-advanced>summary{cursor:pointer;font-weight:650;min-height:44px;display:flex;align-items:center}
.task-flow .task-advanced>summary::before{content:'+';margin-inline-end:10px}.task-flow .task-advanced[open]>summary::before{content:'−'}
.task-flow .task-confirm{padding:14px;border:1px solid #e3c38e;border-radius:12px;background:#fff8e9;margin:12px 0}
.task-flow .task-confirm[hidden]{display:none}
.task-flow .task-confirm button{min-height:44px;margin:4px}
@media(max-width:600px){.task-flow main{padding:12px 14px 32px}.task-flow .play,.task-flow main>.card{padding:12px;border-radius:18px}.task-flow .intro h1{font-size:28px!important}.task-flow [data-primary]{min-height:44px;padding:8px 18px}}

/* Portfolio-wide first pass; individual task-flow layouts keep their own rules. */
body.utility-refresh{color:#173f38;background:radial-gradient(ellipse at 80% 0,#e6f2ec 0,transparent 45%),#f6faf8}
.utility-refresh main{max-width:1120px;margin-inline:auto;padding:20px 24px 40px}
.utility-refresh .intro,.utility-refresh .hero{max-width:700px;margin-inline:auto;text-align:center;padding-block:16px!important}
.utility-refresh .intro h1,.utility-refresh .hero h1{font-size:clamp(30px,4.5vw,44px)!important;line-height:1.15;letter-spacing:-.04em;overflow-wrap:anywhere}
.utility-refresh .intro>p{max-width:60ch;margin:10px auto;line-height:1.65}
.utility-refresh .workspace{grid-template-columns:minmax(0,1fr);max-width:860px;margin-inline:auto;gap:20px}
.utility-refresh .workspace>.inputs,.utility-refresh .workspace>.controls{width:100%;max-width:700px;justify-self:center}
.utility-refresh .workspace>.panel,.utility-refresh main>.card,.utility-refresh .play{background:#fff;border:1px solid #d4e4dd;border-radius:20px;box-shadow:0 12px 40px #173f3808}
.utility-refresh .actions{justify-content:center;gap:10px}
.utility-refresh [data-primary]{background:#176958;color:#fff;border:1px solid #176958;min-height:48px;border-radius:12px;padding:10px 22px;font-weight:700;font-size:1rem}
.utility-refresh [data-primary]:hover:not(:disabled){background:#125343}
.utility-refresh [data-primary]:disabled{opacity:.55}
.utility-refresh a[data-primary]{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.task-entry-action{display:flex;justify-content:center;margin:14px auto}
.task-entry-button{background:#176958;color:white;border:1px solid #176958;border-radius:12px;padding:10px 18px;min-height:48px;max-width:100%;font-size:1rem;font-weight:700;white-space:normal}
.task-entry-button:hover:not(:disabled){background:#125343}
.task-entry-button:disabled{opacity:.55}
.utility-refresh main>h1,.utility-refresh main>header h1{text-align:center;font-size:clamp(28px,4.5vw,44px);line-height:1.15}
.task-flow .hero{max-width:660px;margin-inline:auto;text-align:center;padding-block:12px!important}
.task-flow .hero h1{font-size:clamp(28px,4.5vw,44px)!important;line-height:1.12;margin:8px 0}
.utility-refresh label{text-align:start}
.utility-refresh details{border-radius:12px}
@media(max-width:600px){.utility-refresh main{padding:12px 14px 32px}.utility-refresh .intro{padding-block:10px!important}.utility-refresh .intro h1{font-size:28px!important;margin-block:8px}.utility-refresh .intro>p{font-size:1rem!important;margin-block:8px}.utility-refresh .workspace{gap:14px}.utility-refresh [data-primary]{min-height:44px;padding:8px 16px}.utility-refresh .workspace>.panel{padding:14px}}
@media print{body.utility-refresh{background:white;color:black}.utility-refresh main{max-width:none;padding:0}.utility-refresh .workspace{max-width:none}.utility-refresh .workspace>.panel,.utility-refresh main>.card,.utility-refresh .play{box-shadow:none}}