/* Semantic tokens inherit the chosen world; no card-local palette overrides. */
/* Member journeys reuse the locked world's ink and spacing, without moving panels. */
:root[data-appearance] .party-member-help{margin:10px 0;color:var(--ui-ink);font-size:12px;line-height:1.65;overflow-wrap:anywhere}
:root[data-appearance] #attendanceForm .ops-member-context{color:var(--ui-ink);font-size:13px;line-height:1.65;overflow-wrap:anywhere}
:root[data-appearance] #attendanceForm:focus-visible{outline:2px solid var(--ui-ink);outline-offset:4px}
:root[data-appearance][data-appearance] #mainContent #homeAdventurer .home-adventurer-actions{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
:root[data-appearance][data-appearance] #mainContent #homeAdventurer .home-adventurer-actions button:is(.primary,.ghost){min-height:48px;white-space:normal;overflow-wrap:anywhere}
:root[data-appearance][data-appearance] #mainContent #homeAdventurer div.home-adventurer-id > small{opacity:1;color:var(--ui-ink)}
:root[data-appearance] [data-party-member-task]{min-height:48px;white-space:normal}
:root[data-appearance] .ops-panel{box-sizing:border-box;background:var(--ui-panel)!important;color:var(--ui-ink)!important;border:1px solid var(--ui-line)!important;border-radius:var(--ui-radius)!important;box-shadow:none!important;max-height:none!important;height:auto;overflow:visible!important;padding:22px;margin-block:20px;min-width:0}
:root[data-appearance] .ops-panel :is(h2,h3,h4,b,strong,summary){color:var(--ui-ink)}
:root[data-appearance] .ops-panel :is(p,small,.ops-kicker){color:var(--ui-muted);line-height:1.7}
.ops-panel h2{font-size:24px;margin:5px 0}.ops-panel h3{font-size:16px;margin:0 0 12px}.ops-panel p{font-size:13px;margin:8px 0}.ops-panel small{font-size:12px}
.ops-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.ops-kicker{font-size:11px;letter-spacing:.18em}.ops-actions{display:flex;flex-wrap:wrap;gap:8px}.ops-task-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px}
:root[data-appearance] .ops-task-grid article{min-width:0;background:var(--ui-inset);padding:18px;border:1px solid var(--ui-line);border-radius:var(--ui-radius)}
.ops-task-grid header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.ops-task-grid header strong{font-size:26px}.ops-task-grid h3{margin:0}.ops-task-grid article>button{width:100%;margin-top:12px}
:root[data-appearance] .ops-task{display:grid;grid-template-columns:1fr auto;gap:6px;width:100%;text-align:left;padding:14px 0;min-height:64px;background:none;color:var(--ui-ink);border:0;border-bottom:1px solid var(--ui-line);box-shadow:none}
.ops-task b,.ops-task span{grid-column:1;overflow-wrap:anywhere}.ops-task span{color:var(--ui-muted);font-size:12px}.ops-task i{grid-column:2;grid-row:1/3;align-self:center}.ops-empty{padding-block:12px}
:root[data-appearance] :is(.ops-panel,.ops-search) button:is(.primary,.ghost){min-height:48px;border-radius:var(--ui-radius);padding:10px 16px;font:700 13px/1.5 'Noto Sans TC',sans-serif;box-shadow:none;border:1px solid var(--ui-control-line);background:var(--ui-raised);color:var(--ui-ink)}
:root[data-appearance] :is(.ops-panel,.ops-search) button.primary{background:var(--ui-accent);color:var(--ui-on-accent);border-color:var(--ui-accent)}
:root[data-appearance] :is(.ops-panel,.ops-search) button:is(.primary,.ghost)::before,:root[data-appearance] :is(.ops-panel,.ops-search) button:is(.primary,.ghost)::after{content:none!important}
:root[data-appearance] :is(.ops-panel,.ops-search) button:disabled{background:var(--ui-raised);color:var(--ui-muted);border-color:var(--ui-line);opacity:1}
.ops-search{display:grid;grid-template-columns:minmax(180px,1.5fr) repeat(2,minmax(130px,1fr)) auto;gap:12px;align-items:end;margin-block:18px}.ops-search-state{grid-column:1/-1;margin:0;color:var(--ui-muted);font-size:12px}.ops-search-state:empty{display:none}
:root[data-appearance] :is(.ops-search,.ops-panel) label{display:grid;gap:7px;color:var(--ui-ink);font-size:13px;min-width:0}
:root[data-appearance] :is(.ops-search,.ops-panel) label>span{color:var(--ui-ink);font:600 13px/1.6 'Noto Sans TC',sans-serif;letter-spacing:0}
:root[data-appearance] :is(.ops-search,.ops-panel) :is(input:not([type=checkbox]),select){width:100%;min-width:0;box-sizing:border-box;min-height:48px;background:var(--ui-inset);color:var(--ui-ink);border:1px solid var(--ui-control-line);border-radius:var(--ui-radius);padding:10px;font-size:16px}
:root[data-appearance] :is(.ops-search,.ops-panel) input::placeholder{color:var(--ui-muted);opacity:1}
.ops-template{margin-top:0!important}.ops-template details>label{margin:14px 0}.ops-template summary,.ops-settlement summary,#rosterComposition summary{cursor:pointer;min-height:48px;align-content:center;font-weight:700}.ops-template summary span,.ops-settlement summary span,#rosterComposition summary span{display:block;color:var(--ui-muted);font-size:12px;margin-top:4px}.ops-template label.ops-check{display:flex;align-items:center;min-height:48px}.ops-check input{width:22px;height:22px}
.ops-item-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px 0;border-top:1px solid var(--ui-line);margin-top:14px}.ops-item-name{grid-column:1/-1}.ops-item-row button{align-self:end}.ops-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-block:14px}.ops-metrics>div{display:grid;gap:6px;padding:12px;background:var(--ui-inset);border-radius:var(--ui-radius);overflow-wrap:anywhere}.ops-metrics strong{font-size:20px}
.ops-settlement ul{list-style:none;margin:14px 0 0;padding:0}.ops-settlement li{display:grid;grid-template-columns:1fr auto;gap:6px;border-top:1px solid var(--ui-line);padding:12px 0;overflow-wrap:anywhere}.ops-settlement li small{grid-column:1/-1}.ops-item-detail>div{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-top:1px solid var(--ui-line)}.ops-item-detail>div>span{min-width:0;overflow-wrap:anywhere}.ops-item-detail>div>span:last-child{text-align:right}.ops-item-detail small{display:block}
.ops-role-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-block:12px}.ops-role-grid span{display:grid;gap:5px;padding:9px;background:var(--ui-raised);border-radius:var(--ui-radius);font-size:11px;text-align:center}.ops-role-grid b{font-size:22px}
.ops-attendance-list>div{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px 0;border-top:1px solid var(--ui-line);align-items:center}.ops-attendance-list small{grid-column:1/-1;overflow-wrap:anywhere}.ops-state{font-size:12px;padding:5px 9px;border-radius:var(--ui-radius);background:var(--ui-raised);color:var(--ui-ink)}.ops-state[data-state=unavailable]{background:var(--ui-danger-bg);color:var(--ui-danger)}.ops-state[data-state=on_time]{background:var(--ui-success-bg);color:var(--ui-success)}
#attendanceForm{margin-top:16px;border-top:1px solid var(--ui-line);padding-top:16px}#attendanceForm fieldset{border:0;padding:0;margin:0;display:grid;gap:12px}#attendanceForm legend{padding:0 0 12px;font-weight:700}#attendanceForm button{width:100%;margin-top:12px}
.ops-board-states{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:18px}.ops-board-states button{display:grid;gap:6px}.ops-board-states strong{font-size:26px}.ops-area-list{display:flex;gap:8px;flex-wrap:wrap}.ops-area-list button{flex:1 1 180px;text-align:left}
:root[data-appearance] #candidateModal #releaseSlotPanel{padding:0 16px!important;max-height:calc(var(--dialog-available-height) - 115px);overflow:auto}
#releaseSlotPanel>summary{min-height:48px;align-content:center;font-size:13px;font-weight:700;color:var(--ui-ink);cursor:pointer}
#releaseSlotPanel[open]>label{margin-top:8px}#releaseSlotPanel[open]>.dialog-actions{padding-bottom:12px}
:root[data-appearance] #candidateModal .candidate-action-bar:has(#finalizePartyButton[hidden]){display:none!important}
@container candidate-dialog (max-height:460px){:root[data-appearance] #candidateModal:has(#attendanceForm:focus-within) :is(.candidate-tools,#releaseSlotPanel){display:none!important}}
@media(max-width:800px){.ops-search{grid-template-columns:repeat(2,minmax(0,1fr))}.ops-search>label:first-child{grid-column:1/-1}.ops-search>.ops-actions{grid-column:1/-1}.ops-search button{flex:1}.ops-board-states{grid-template-columns:repeat(3,minmax(0,1fr))}.ops-heading{align-items:start;flex-wrap:wrap}}
@media(max-width:540px){:root[data-appearance] .ops-panel{padding:16px}.ops-task-grid{grid-template-columns:1fr}.ops-heading h2{font-size:22px}.ops-role-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ops-board-states{grid-template-columns:repeat(2,minmax(0,1fr))}.ops-attendance-list>div{grid-template-columns:1fr}.ops-state{justify-self:start}}

/* v196 · attendance at a glance: a tally with a proportion bar, colour-coded states, "you" marked, one-tap choices */
:root[data-appearance] { --att-on: #2FB36B; --att-late: #E3A21A; --att-no: #E0503E; --att-wait: #8C98A0; }
:root[data-appearance] .ops-attendance-summary { display: grid; gap: 8px; margin: 12px 0 16px; padding: 12px 14px; border: 1px solid rgba(140, 152, 160, .28); border-radius: 10px; }
:root[data-appearance] .ops-attendance-summary strong { font-size: 18px; }
:root[data-appearance] .ops-attendance-bar { display: flex; height: 8px; border-radius: 99px; overflow: hidden; background: rgba(140, 152, 160, .2); }
:root[data-appearance] .ops-attendance-bar i[data-state="on_time"] { background: var(--att-on); }
:root[data-appearance] .ops-attendance-bar i[data-state="late"] { background: var(--att-late); }
:root[data-appearance] .ops-attendance-bar i[data-state="unavailable"] { background: var(--att-no); }
:root[data-appearance] .ops-attendance-bar i[data-state="unconfirmed"] { background: repeating-linear-gradient(90deg, rgba(140, 152, 160, .55) 0 6px, rgba(140, 152, 160, .25) 6px 10px); }
:root[data-appearance] .ops-attendance-summary ul { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; padding: 0; list-style: none; font-size: 13px; }
:root[data-appearance] .ops-attendance-summary li { display: inline-flex; align-items: center; gap: 6px; }
:root[data-appearance] .ops-attendance-summary li::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--att-wait); }
:root[data-appearance] .ops-attendance-summary li[data-state="on_time"]::before { background: var(--att-on); }
:root[data-appearance] .ops-attendance-summary li[data-state="late"]::before { background: var(--att-late); }
:root[data-appearance] .ops-attendance-summary li[data-state="unavailable"]::before { background: var(--att-no); }
:root[data-appearance] .ops-attendance-summary li b { font-variant-numeric: tabular-nums; }
:root[data-appearance] .ops-attendance-list .ops-state { border-radius: 99px; padding: 3px 10px; font-weight: 700; font-size: 13px; border: 1px solid transparent; }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="on_time"] { background: color-mix(in srgb, var(--att-on) 18%, transparent); color: var(--att-on-ink, var(--att-on)); border-color: var(--att-on); }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="on_time"]::before { content: "✓ "; }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="late"] { background: color-mix(in srgb, var(--att-late) 18%, transparent); color: var(--att-late-ink, var(--att-late)); border-color: var(--att-late); }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="late"]::before { content: "⏱ "; }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="unavailable"] { background: color-mix(in srgb, var(--att-no) 18%, transparent); color: var(--att-no-ink, var(--att-no)); border-color: var(--att-no); }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="unavailable"]::before { content: "✕ "; }
:root[data-appearance] .ops-attendance-list .ops-state[data-state="unconfirmed"] { background: transparent; color: var(--att-wait-ink, var(--att-wait)); border: 1px dashed var(--att-wait); }
:root[data-appearance] .ops-attendance-list > div[data-me] { box-shadow: inset 3px 0 0 currentColor; padding-left: 10px; }
:root[data-appearance] .ops-me { display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 99px; font-style: normal; font-size: 11px; font-weight: 800; border: 1px solid currentColor; opacity: .85; vertical-align: 2px; }
:root[data-appearance] .ops-attendance-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 8px 0 12px; }
:root[data-appearance] .ops-attendance-choices label { position: relative; cursor: pointer; }
:root[data-appearance] .ops-attendance-choices input { position: absolute; opacity: 0; inset: 0; }
:root[data-appearance] .ops-attendance-choices span { display: grid; place-items: center; min-height: 48px; padding: 8px; border-radius: 10px; border: 1.5px solid rgba(140, 152, 160, .45); font-weight: 800; text-align: center; transition: background .15s, border-color .15s; }
:root[data-appearance] .ops-attendance-choices input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 2px; }
:root[data-appearance] .ops-attendance-choices label[data-state="on_time"] input:checked + span { background: var(--att-on); border-color: var(--att-on); color: #fff; }
:root[data-appearance] .ops-attendance-choices label[data-state="late"] input:checked + span { background: var(--att-late); border-color: var(--att-late); color: #1E1400; }
:root[data-appearance] .ops-attendance-choices label[data-state="unavailable"] input:checked + span { background: var(--att-no); border-color: var(--att-no); color: #fff; }
@media (max-width: 540px) { :root[data-appearance] .ops-attendance-choices span { min-height: 52px; font-size: 13px; } }
/* light worlds: the state words use deeper inks of the same hues (≥ 5:1 on paper); bars and fills keep the bright hues */
:root[data-appearance]:is([data-appearance="classic"], [data-appearance="cloud"]) { --att-on-ink: #1E7A48; --att-late-ink: #8A5A00; --att-no-ink: #B3261E; --att-wait-ink: #5F6B72; }

/* v197 · the unanswered-attendance alert on the overview: impossible to miss, answerable in place */
:root[data-appearance] { --alert-c: #E0503E; }
:root[data-appearance="classic"] { --alert-c: #9A2E1E; }
:root[data-appearance="cloud"] { --alert-c: #D24A2E; }
:root[data-appearance="maple"] { --alert-c: #FF4F6E; }
:root[data-appearance="epic"] { --alert-c: #FF5A3C; }
:root[data-appearance] #attendanceAlert { margin: 0 0 18px; padding: 18px 20px 20px; border: 2px solid var(--alert-c); border-radius: 14px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--alert-c) 16%, transparent), color-mix(in srgb, var(--alert-c) 5%, transparent)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--alert-c) 14%, transparent); grid-column: 1 / -1; }
:root[data-appearance] #attendanceAlert[hidden] { display: none !important; }
:root[data-appearance] #attendanceAlert .ops-alert-head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 12px; }
:root[data-appearance] #attendanceAlert .ops-alert-head h2 { margin: 0 0 4px; font-size: 22px; color: var(--alert-c); -webkit-text-fill-color: var(--alert-c); }
:root[data-appearance] #attendanceAlert .ops-alert-head p { margin: 0; font-size: 14px; line-height: 1.55; }
:root[data-appearance] #attendanceAlert .ops-alert-icon { position: relative; flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--alert-c); color: #fff; -webkit-text-fill-color: #fff; font: 900 24px/1 system-ui, sans-serif; }
:root[data-appearance] #attendanceAlert .ops-alert-icon::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--alert-c); opacity: 0; animation: att-ping 1.8s ease-out infinite; }
@keyframes att-ping { 0% { opacity: .8; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.4); } }
@media (prefers-reduced-motion: reduce) { :root[data-appearance] #attendanceAlert .ops-alert-icon::after { animation: none; } }
:root[data-appearance] #attendanceAlert .ops-alert-form { margin-top: 12px; padding: 14px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--alert-c) 40%, transparent); background: color-mix(in srgb, var(--alert-c) 6%, transparent); }
:root[data-appearance] #attendanceAlert .ops-alert-raid { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
:root[data-appearance] #attendanceAlert .ops-alert-raid b { font-size: 17px; }
:root[data-appearance] #attendanceAlert .ops-alert-raid em { font-style: normal; font-weight: 800; color: var(--alert-c); -webkit-text-fill-color: var(--alert-c); }
:root[data-appearance] #attendanceAlert fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
:root[data-appearance] #attendanceAlert .ops-alert-note { display: grid; gap: 4px; font-size: 13px; }
:root[data-appearance] #attendanceAlert .ops-alert-note input { width: 100%; box-sizing: border-box; }
:root[data-appearance] #attendanceAlert button[type="submit"] { width: 100%; margin-top: 12px; min-height: 46px; font-weight: 800; }
:root[data-appearance] #attendanceAlert button[type="submit"]:disabled { opacity: .55; cursor: not-allowed; }
:root[data-appearance] #attendanceAlert .ops-alert-more { margin: 10px 0 0; font-size: 13px; }
