:root{--ink:#122238;--orange:#f2673a;--paper:#f5f3ee;--line:#d9dde1;--green:#3f8f72;--muted:#5a6676;--orange-text:#b9461a;--orange-fill:#c4471c}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Geist,"Segoe UI",Aptos,sans-serif}.topbar{height:76px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid #e7e9eb}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand>b{display:grid;place-items:center;width:42px;height:42px;background:var(--orange-fill);color:#fff;font-size:15px}.brand span,.identity>span{display:flex;flex-direction:column}.brand strong{font-size:13px;letter-spacing:1.8px}.brand small,.identity small{font-size:13px;letter-spacing:.06em;color:var(--muted);margin-top:3px}.identity{display:flex;align-items:center;text-align:right;gap:13px}.identity strong{font-size:15px;margin-top:3px}.identity>b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--ink);color:#fff}main{width:min(1240px,calc(100% - 48px));margin:0 auto;padding:0 0 60px}.hero{min-height:0;display:flex;align-items:center;justify-content:space-between;gap:35px;padding:26px 0 24px}.eyebrow{display:block;font-size:13px;font-weight:800;letter-spacing:.08em;color:var(--orange-text);margin-bottom:10px}.hero h1{font-family:Georgia,serif;font-size:clamp(34px,3.4vw,50px);line-height:1.08;margin:0;font-weight:500;letter-spacing:-1px}.hero h1 em{color:var(--orange);font-weight:500}.hero p{max-width:640px;color:var(--muted);line-height:1.5;margin:12px 0 0;font-size:16px}.hero-actions{display:flex;flex-direction:column;gap:10px;min-width:210px}.hero-actions button,.filters button{border:1px solid #11213833;border-radius:10px;background:#fff;color:var(--ink);min-height:48px;padding:10px 18px;font-size:15px;font-weight:700;line-height:1.25;text-align:left;cursor:pointer}.hero-actions button:hover,.filters button:hover{border-color:var(--orange)}.demo{display:flex;gap:14px;align-items:center;background:#fff5d9;border-left:4px solid #e4a848;border-radius:10px;padding:8px 16px;font-size:15px;line-height:1.5;margin-bottom:16px}.demo b{text-transform:uppercase;font-size:13px;letter-spacing:.06em;white-space:nowrap}.demo span{color:#6f6040}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:22px}.kpis article{background:#fff;padding:24px;display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-content:start}.kpis i{font-style:normal;grid-row:1/4;display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:#f1f3f4;color:var(--orange);font-size:21px}.kpis span{font-size:13px;font-weight:800;letter-spacing:.06em;color:var(--muted)}.kpis strong{font-family:Geist,"Segoe UI",Aptos,sans-serif;font-size:clamp(26px,2.1vw,32px);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.2;margin:6px 0;white-space:nowrap}.kpis small{font-size:14px;line-height:1.4;color:var(--muted)}.kpis .accent{background:var(--ink);color:#fff}.kpis .accent i{background:#26394f}.kpis .accent span,.kpis .accent small{color:#aeb8c4}.insights{display:grid;grid-template-columns:1.35fr 1fr;gap:22px;margin-bottom:22px}.card,.table-card{background:#fff;border:1px solid var(--line);border-radius:14px}.card{padding:24px}.card>header,.table-title{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:16px}.card>header>div,.table-title>div{display:flex;align-items:baseline;gap:12px}.card h2,.table-title h2{font-family:Georgia,serif;font-size:26px;font-weight:400;line-height:1.2;margin:0}.card header span,.table-title>div>span{color:var(--orange-text);font-size:14px;font-weight:800;letter-spacing:.04em}.card header small{font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--muted);text-align:right}.bars{display:grid;gap:16px;margin-top:22px}.bar{display:grid;grid-template-columns:minmax(120px,170px) minmax(60px,1fr) auto;align-items:center;gap:14px}.bar label{display:flex;flex-direction:column;font-size:15px;font-weight:700;line-height:1.3;min-width:0;overflow-wrap:anywhere}.bar label small{font-size:14px;font-weight:400;color:var(--muted);margin-top:2px}.track{height:10px;border-radius:999px;overflow:hidden;background:#edf0f2}.track i{display:block;height:100%;border-radius:inherit;background:var(--orange)}.bar>b{text-align:right;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;min-width:84px}.donut-layout{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px 32px;padding:26px 0 4px}.donut{flex:0 0 auto;width:170px;height:170px;border-radius:50%;display:grid;place-items:center}.donut>div{width:112px;height:112px;background:#fff;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.donut strong{font-family:Geist,"Segoe UI",Aptos,sans-serif;font-size:32px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}.donut small{font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--muted)}#legend{margin:0;padding:0;list-style:none;display:grid;gap:10px;min-width:230px}#legend li{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:10px;font-size:15px;line-height:1.3}#legend i{width:12px;height:12px;border-radius:3px}#legend li>span:first-child{grid-column:1/3}#legend b{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;min-width:24px;text-align:right}.table-card{overflow:hidden}.table-title{padding:22px 24px}.table-title p{margin:4px 0 0;font-size:14px;line-height:1.4;color:var(--muted)}.table-title>b{font-size:13px;letter-spacing:.06em;color:#2f7a5f;background:#e9f4ef;padding:6px 12px;border-radius:999px;white-space:nowrap}.filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;align-items:end;gap:12px 14px;padding:18px 24px;background:#f8f9fa;border-bottom:1px solid var(--line)}.filters label{display:flex;flex-direction:column;gap:6px;min-width:0}.filters label>span{font-size:14px;font-weight:700;line-height:1.3;color:var(--ink)}.filters input,.filters select{height:44px;border:1px solid #c9d0d7;border-radius:10px;background:#fff;padding:0 12px;color:var(--ink);font-size:16px;min-width:0;width:100%}.filters .search{position:relative}.filters .search>span{position:absolute;left:14px;bottom:10px;font-size:20px;line-height:1;color:var(--ink)}.filters .search{grid-column:1/5}.filters .search input{padding-left:42px}.filters input::placeholder{color:#6b7684}.filters button{grid-column:5;grid-row:1;height:44px;min-height:44px;background:#fff;color:var(--ink);border:1px solid #c9d0d7;padding:0 20px;text-align:center}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:1120px}th{background:#fff;text-align:left;color:var(--muted);font-size:13px;font-weight:800;letter-spacing:.06em;padding:13px 14px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:14px;border-bottom:1px solid #edf0f2;font-size:15px;line-height:1.35;vertical-align:middle}td strong{font-weight:700;font-variant-numeric:tabular-nums}td button.idea{border:0;background:none;text-align:left;padding:0;cursor:pointer;color:var(--ink)}td button.idea b{display:block;font-size:13px;color:var(--orange-text);letter-spacing:.02em;margin-bottom:4px}td button.idea span{font-weight:700}td small{display:block;color:var(--muted);font-size:14px;margin-top:3px}.pill{display:inline-block;background:#eef1f4;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:700;line-height:1.3}.status-pill{display:inline-flex;align-items:center;gap:7px;min-height:26px;border-radius:999px;padding:4px 11px;font-size:13px;font-weight:700;line-height:1.25;background:#e9eef4;color:#2b3d55}.status-pill i{flex:0 0 7px;width:7px;height:7px;border-radius:50%;background:currentColor}.status-pill.approved{background:#e8f3ee;color:#2f6f58}.status-pill.info{background:#fff0e8;color:#b9461a}.status-pill.info i{background:#c4471c}.status-pill.hold{background:#fff5d9;color:#8a5f12}.status-pill.rejected{background:#fde6e4;color:#9b3934}.more{width:40px;height:40px;border:1px solid #c9d0d7;border-radius:10px;background:#fff;color:var(--ink);font-size:18px;cursor:pointer}.table-card>footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 16px;padding:14px 24px;font-size:14px;color:var(--muted)}.table-card>footer div{display:flex;align-items:center;gap:12px}.table-card>footer b{color:var(--ink);font-size:15px}.table-card>footer button{width:44px;height:40px;background:#fff;border:1px solid #c9d0d7;border-radius:10px;color:var(--ink);font-size:18px;cursor:pointer}.table-card>footer button:disabled{opacity:.35}.empty{text-align:center;padding:45px}.empty>b{font-size:30px;color:var(--orange)}.empty h3{font-family:Georgia,serif;margin:8px 0 5px}.empty p{font-size:15px;line-height:1.5;color:var(--muted)}.modal{position:fixed;inset:0;background:#0b1727bb;display:flex;justify-content:flex-end;z-index:10}.modal[hidden]{display:none}.modal>section{width:min(600px,100%);height:100%;overflow:auto;background:#fff;padding:30px;box-shadow:-15px 0 50px #0003}.modal>section>header{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:20px}.modal h2{font-family:Georgia,serif;font-size:30px;font-weight:400;line-height:1.2;margin:6px 0}.modal header small{font-size:13px;color:var(--orange-text);font-weight:800;letter-spacing:.02em}.modal header button{flex:0 0 44px;width:44px;height:44px;border:0;background:none;color:var(--ink);font-size:30px;line-height:1;cursor:pointer}.detail-meta,.detail-numbers{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:20px 0}.detail-meta span,.detail-numbers span{background:#f8f9fa;padding:12px 14px;display:flex;flex-direction:column}.detail-meta small,.detail-numbers small,.modal article small{font-size:13px;font-weight:800;letter-spacing:.06em;color:var(--muted)}.detail-meta b{font-size:15px;line-height:1.35;margin-top:5px}.detail-numbers strong{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:7px}.modal article{padding:15px 0}.modal article p{font-size:16px;line-height:1.55;max-width:70ch}.modal>section>footer{color:var(--muted);font-size:14px;border-top:1px solid var(--line);padding-top:18px}@media(max-width:900px){main{padding:0 0 40px}.hero{align-items:flex-start;flex-direction:column;gap:22px;padding:24px 0}.hero h1{font-size:38px}.hero-actions{width:100%;min-width:0;flex-direction:row;flex-wrap:wrap}.hero-actions button{flex:1 1 150px;justify-content:center;text-align:center}.kpis{grid-template-columns:repeat(2,1fr)}.insights{grid-template-columns:1fr}.filters{grid-template-columns:1fr 1fr}.filters .search{grid-column:1/-1}.filters button{grid-column:auto;grid-row:auto;align-self:end}.identity span{display:none}}@media(max-width:560px){.topbar{padding:0 18px;height:66px}.brand span{display:none}.hero h1{font-size:34px}.hero-actions button{min-height:44px;padding:8px 12px}.demo{align-items:flex-start;flex-direction:column;gap:4px}.kpis{grid-template-columns:1fr}.kpis article{padding:18px}.card{padding:18px}.donut-layout{flex-direction:column}#legend{min-width:0;width:100%}.table-card>footer{padding:12px 16px}.table-card>footer button{width:44px;height:44px}.table-title{padding:18px 16px}.filters{padding:16px}.filters{grid-template-columns:1fr}.filters .search{grid-column:auto}.detail-meta,.detail-numbers{grid-template-columns:repeat(2,1fr)}.bar{grid-template-columns:minmax(0,1fr) auto;row-gap:6px}.bar .track{grid-column:1/-1;grid-row:2}.bar>b{grid-row:1;grid-column:2;min-width:0}.table-title>div>span{display:none}}@media print{.topbar,.hero-actions,.demo,.filters,.table-card>footer,.more{display:none!important}body{background:#fff}main{width:auto;max-width:none;padding:0}.hero{min-height:auto;padding:20px 0}.hero h1{font-size:36px}.card,.table-card,.kpis{break-inside:avoid}.table-wrap{overflow:visible}table{min-width:0}th,td{padding:7px;font-size:10px}}

/* v3.0.0 — API-backed dashboard: workshop selector, page states, form feedback, toast, withdraw drawer */
#admin-content [hidden],.admin-state[hidden]{display:none!important}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Containing block for the hidden "Actions" header: keeps it inside the table's own scroll box (no sideways page scroll on phones). */
.table-wrap{position:relative}
.workshop-switch{display:flex;flex-direction:column;gap:6px;max-width:520px;margin-top:14px}
.workshop-switch>span{font-size:14px;font-weight:700;line-height:1.3;color:var(--ink)}
.workshop-switch select{width:100%;height:44px;min-width:0;padding:0 12px;border:1px solid #c9d0d7;border-radius:10px;background:#fff;color:var(--ink);font-size:16px;font-weight:400}
.admin-state{margin-bottom:22px}
.admin-state .empty>b{display:block}
.admin-state .empty p{max-width:520px;margin-left:auto;margin-right:auto;line-height:1.6}
.admin-state[aria-busy="true"] .empty>b{animation:admin-spin 1.2s linear infinite;display:inline-block}
.admin-state-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}
.admin-state-actions button,.admin-state-actions a,.data-error button,.panel-state button,.picker-note button{min-height:40px;justify-content:center;padding:0 18px;border:0;border-radius:10px;background:var(--ink);color:#fff;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center}
.data-error{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;padding:12px 16px;border-left:4px solid #c2412d;border-radius:10px;background:#fde6e4;color:#7f2a20;font-size:15px;line-height:1.5}
#admin-content[aria-busy="true"] .admin-panel{opacity:.72;transition:opacity .2s}
.admin-panel:focus{outline:none}
.admin-panel:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.admin-tabs button:focus-visible,.hero-actions button:focus-visible,.filters button:focus-visible,.more:focus-visible,.workshop-switch select:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
button[aria-busy="true"]{cursor:progress!important;opacity:.65}
.field-error{display:block;margin-top:2px;color:#a13e34;font-size:14px;font-weight:700;letter-spacing:0;line-height:1.4;text-transform:none}
[aria-invalid="true"]{border-color:#c2412d!important;box-shadow:0 0 0 1px #c2412d}
.form-error{margin:8px 0 0;color:#a13e34;font-size:14px;font-weight:700;line-height:1.5}
.form-error:empty{margin:0}
#workshop-notice.error,#user-create-notice.error,.assignments-notice.error,.workshop-access__notice.error{color:#a13e34;font-weight:700}
#workshop-notice.success,#user-create-notice.success,.assignments-notice.success,.workshop-access__notice.success{color:#2f7a5f;font-weight:700}
.row-actions{display:flex;justify-content:flex-end;gap:8px}
button.more.withdraw{display:grid;width:40px;height:40px;place-items:center;padding:0;color:#a13e34;font-size:22px;line-height:1}button.more.withdraw:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
button.more.withdraw:hover{border-color:#a13e34;background:#fde6e4}
.admin-toast{position:fixed;left:50%;bottom:24px;z-index:30;max-width:calc(100% - 32px);padding:14px 20px;border-radius:10px;background:var(--ink);color:#fff;font-size:15px;font-weight:700;line-height:1.4;box-shadow:0 16px 40px #0003;transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.admin-toast.show{opacity:1;transform:translate(-50%,0)}
.admin-toast.error{background:#a13e34}
.withdraw-modal article p{white-space:pre-line}
.detail-meta b{overflow-wrap:anywhere}
.withdraw-form{display:grid;gap:8px;padding:4px 0 20px}.withdraw-form textarea::placeholder{color:#6b7684}
.withdraw-form>label{color:var(--ink);font-size:14px;font-weight:700}
.withdraw-form textarea{width:100%;min-height:120px;padding:12px 14px;border:1px solid #c9d0d7;border-radius:10px;color:var(--ink);font-family:inherit;font-size:16px;line-height:1.5;resize:vertical;white-space:pre-wrap}
.withdraw-form>div{display:flex;justify-content:flex-end;gap:10px}
.withdraw-form button{min-height:44px;padding:0 18px;border:1px solid var(--ink);border-radius:10px;background:#fff;color:var(--ink);font-size:15px;font-weight:700;cursor:pointer}
.withdraw-form button[type="submit"]{border-color:#a13e34;background:#a13e34;color:#fff}
.withdraw-form button:disabled{opacity:.5;cursor:not-allowed}
@keyframes admin-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.admin-state[aria-busy="true"] .empty>b{animation:none}.admin-toast{transition:none}}
@media(max-width:900px){.workshop-switch{max-width:none;width:100%}}
@media(max-width:560px){.data-error{align-items:flex-start;flex-direction:column}.withdraw-form>div{flex-wrap:wrap}.withdraw-form button{flex:1 1 130px}.modal>section{padding:22px 18px}}
@media print{.admin-tabs,.workshop-switch,.admin-toast,.admin-state,.data-error,.row-actions{display:none!important}#admin-content[aria-busy="true"] .admin-panel{opacity:1}}
/* Readability pass: controls use the page font; the workshop chip and switch share one row when there is room;
   short table values stay on one line so pills and dates do not break mid-phrase. */
button,input,select,textarea{font-family:inherit}
.hero .workshop-switch{display:inline-flex;vertical-align:bottom;width:clamp(360px,calc(100vw - 790px),530px);max-width:100%}
th{white-space:normal}th,td{padding-left:10px;padding-right:10px}th:first-child,td:first-child{padding-left:18px}th:last-child,td:last-child{padding-right:16px}
@media screen{td:first-child{min-width:210px}td:not(:first-child) strong,td:not(:first-child) small,.pill,.status-pill{white-space:nowrap}}
/* Owner e-mails may wrap only at the "@" (admin.js puts a <wbr> there), never mid-address. */
@media screen{td:nth-child(2) small{white-space:normal;overflow-wrap:break-word}}
@media screen and (max-width:1180px){table{min-width:1320px}}
@media print{th{white-space:normal}th,td{padding:7px}td small,td a.idea b,.pill,.status-pill,.payback-indicator{font-size:10px!important}.pill,.status-pill,.payback-indicator{min-height:0;padding:2px 6px}td a.idea b{white-space:nowrap}}
@media(max-width:900px){.hero .workshop-switch{display:flex;width:100%}}
@media(max-width:560px){.card h2,.table-title h2{font-size:24px}.card>header{align-items:flex-start}}
/* Round 2: compact hero. On wide screens the workshop switch and the three actions sit in a right-hand column
   next to the headline (DOM order = visual order: switch, then buttons). The chip that repeats the selected
   workshop is hidden on screen while the switch is there (it still prints). */
@media screen{.hero>div:first-child:has(>.workshop-switch) .active-workshop{display:none}
.hero h1{font-size:clamp(34px,3.4vw,50px);letter-spacing:-.03em}
.hero p{margin-top:8px}
.hero .workshop-switch{display:flex;width:100%;max-width:none;margin-top:14px}
.hero-actions{flex-direction:row;gap:10px;min-width:0}
.hero-actions button{flex:1 1 0;min-width:0;min-height:44px;padding:6px 14px;display:inline-flex;align-items:center;justify-content:center;text-align:center}
.demo b{font-size:13px}}
@media screen and (min-width:901px){.hero{display:grid;grid-template-columns:minmax(0,1fr) min(570px,52%);grid-template-rows:auto auto auto;column-gap:40px;row-gap:0;align-items:end;padding:30px 0 24px}
.hero>div:first-child{display:contents}
.hero .eyebrow{grid-column:1;grid-row:1;margin-bottom:8px}
.hero h1{grid-column:1;grid-row:2}
.hero p{grid-column:1;grid-row:3;align-self:start}
.hero .workshop-switch{grid-column:2;grid-row:1/3;align-self:end;margin:0}
.hero-actions{grid-column:2;grid-row:3;align-self:start;margin-top:12px}}
@media(max-width:900px){.hero{gap:14px;padding:20px 0 16px}.hero h1{font-size:34px}.hero-actions button{flex:1 1 0;min-width:0}}
/* Phones: eyebrow + short headline, the switch and one row of three buttons; the intro sentence stays in the HTML. */
@media(max-width:720px){main{width:calc(100% - 32px)}
.hero{gap:12px;padding:16px 0 12px}.hero .eyebrow{margin-bottom:6px}.hero h1{font-size:32px;letter-spacing:-.02em}.hero p{display:none}.hero .workshop-switch{margin-top:12px}
.hero-actions{gap:8px}.hero-actions button{min-height:44px;padding:4px 6px;font-size:14px;line-height:1.2}
.demo{display:block;padding:8px 12px;font-size:14px;line-height:1.45;margin-bottom:14px}.demo b{margin-right:8px}
.more,a.more,button.more.withdraw{width:44px;height:44px}.row-actions{gap:6px}
.table-card>footer button{width:44px;height:44px}
.admin-state-actions button,.admin-state-actions a,.data-error button,.panel-state button,.picker-note button{min-height:44px}}
@media screen and (max-width:900px){.hero>div:first-child{align-self:stretch}}
/* The state buttons use display:inline-flex, which beat their hidden attribute (Retry showed while loading). */
.admin-state [hidden],.data-error [hidden]{display:none!important}
