/* GENERATED by make_desk_css.py (04-11) - the support desk, creator desk and creator code page on v2.
   Their scripts paint the old class names; these are the old rules for those classes only, on v2's tokens. */
.desk {
  --bg: var(--ground); --surface: #0E0F11; --card: var(--raise); --hover: var(--raise-2);
  --line: var(--raise-3); --line-soft: var(--raise-2); --line-strong: #3A3F45;
  --fg: var(--ink); --muted: var(--mute); --faint: #74747C;
  --accent: var(--zest); --accent-hi: var(--zest-hi); --accent-lo: #23A83C; --zest-lo: #23A83C;
  --zest-glow: rgba(47, 194, 74, 0.14);
  --gold-lo: #B98A26; --gold-ink: var(--gold-deep); --gold-glow: rgba(212, 175, 55, 0.14); --gold-line: rgba(212, 175, 55, 0.30);
  --body: var(--text); --mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;
  --u: 4px; --pad: var(--gutter); --maxw: 1200px; --radius-sm: 10px; --ease: cubic-bezier(0.22, 1, 0.36, 1);
}
.desk .pad-y { padding-block: clamp(96px, 10vw, 128px) clamp(56px, 7vw, 96px); }
.desk .narrow { max-width: 860px; }
.desk .narrow:has(> .signin-card) { max-width: 520px; }
.desk .muted { color: var(--mute); }
.desk .mono { font-family: var(--mono); }
.desk .zest { color: var(--zest); }
.desk .lede { color: var(--mute); font-size: var(--fs-lead); }
.desk .page-title { font: 800 clamp(36px, 5vw, 56px)/1.05 var(--display); letter-spacing: -0.02em; margin: 0; }
.desk .signin-card { background: var(--raise); border-radius: var(--radius); padding: 32px; }
.desk .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 20px;
  border: 0; border-radius: 999px; font: 700 15px/1 var(--display); cursor: pointer; text-decoration: none;
  background: var(--raise-3); color: var(--ink); transition: transform .15s var(--ease), background .15s; }
.desk .btn:hover { transform: translateY(-1px); background: #30353B; }
.desk .btn:active { transform: translateY(1px); }
.desk .btn:disabled, .desk .btn[aria-disabled="true"] { opacity: .5; cursor: default; transform: none; }
.desk .btn-primary { background: var(--zest); color: var(--zest-ink, #08130A); }
.desk .btn-primary:hover { background: var(--zest-hi); }
.desk .btn-gold { background: var(--gold); color: var(--gold-deep); }
.desk .btn-gold:hover { background: var(--gold-hi); }
.desk .btn-danger { background: #3A1518; color: #FF8A8F; }
.desk .btn-danger:hover { background: #4A1A1E; }
.desk .btn-ghost { background: transparent; box-shadow: inset 0 0 0 1px var(--raise-3); }
.desk .btn-ghost:hover { background: var(--raise-2); }
.desk .btn-sm { min-height: 36px; padding: 0 14px; font-size: 14px; }
.desk .btn-lg { min-height: 52px; padding: 0 26px; font-size: 16px; }
.desk input, .desk select, .desk textarea { font: inherit; color: var(--ink); }
.desk .cr-hero, .desk .cr-card { box-shadow: none !important; }
.desk .cr-card { border: 0; background: var(--raise); }

.player-empty {border: 1px dashed var(--line); border-radius: var(--radius); padding: 44px 24px; text-align: center;
  color: var(--faint); font-family: var(--mono); font-size: 13px; letter-spacing: 0.06em;}
.player-empty b {color: var(--fg); font-family: var(--body); display: block; font-size: 17px; margin-bottom: 6px; letter-spacing: 0;}
.player-empty {border: 1px solid var(--line); background: var(--surface);}
.cr-word {display: none;}
.cr-dawn .cr-word {display: block; height: 1.22em; width: auto; margin-block: -0.15em; transform: translateY(-0.26em);}
.cr-dawn .cr-mark, .cr-dawn .cr-dname {display: none;}
.creel .cr-size {display: grid; visibility: hidden;}
.creel .cr-size > .cr-item {grid-area: 1 / 1;}
.creel .cr-strip {position: absolute; inset: 0; z-index: 1; will-change: transform;}
.creel .cr-strip > .cr-item {height: 100%;}
.cr-item {display: flex; align-items: center; gap: 0.3em;
  white-space: nowrap; line-height: 1;}
.cr-mark {flex: none; display: inline-grid; place-items: center;
  
  width: 0.75em; height: 0.75em;
  
  transform: translateY(-0.0516em);}
.cr-mark img, .cr-mark svg {width: 100%; height: 100%; object-fit: contain; display: block;}
.creel.static .cr-size {display: inline; visibility: visible;}
.creel.static .cr-size > .cr-item {display: inline-flex; vertical-align: baseline;}
.creel.static .cr-size > .cr-item:not(:last-child)::after {content: ","; margin-right: 0.3em;}
.creel.static .cr-strip {display: none;}
.pf-count {font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--faint);}
#acc-bill .player-empty {padding: 28px 20px;}
#acc-bill .player-empty {padding: 28px 20px;}
.tk-form {display: grid; gap: 14px; margin-bottom: 26px;}
.tk-row {display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 14px;}
.tk-field {display: grid; gap: 7px;}
.tk-field > span {font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--faint);}
.tk-field input, .tk-field select, .tk-field textarea {width: 100%; padding: 12px 14px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm);
  color: var(--fg); font: 400 14.5px/1.55 var(--body); resize: vertical;}
.tk-field textarea {min-height: 118px;}
.tk-field input:focus, .tk-field select:focus, .tk-field textarea:focus {outline: none; border-color: var(--zest-lo); box-shadow: 0 0 0 3px var(--zest-glow);}
.tk-field input::placeholder, .tk-field textarea::placeholder {color: var(--faint);}
.tk-actions {display: flex; align-items: center; gap: 14px; flex-wrap: wrap;}
.tk-note {font-size: 11.5px; letter-spacing: 0.06em; color: var(--faint);}
.tk-note.ok {color: var(--zest);}
.tk-note.bad {color: #E5533C;}
.tk-form.is-off input, .tk-form.is-off select, .tk-form.is-off textarea, .tk-form.is-off button {opacity: 0.5; pointer-events: none;}
.tk-list {display: grid; gap: 2px;}
@media (max-width: 900px) {
  .tk-row {grid-template-columns: 1fr;}
  .tk-btn {grid-template-columns: minmax(0, 1fr) auto 20px;}
  .tk-when {display: none;}
}
.acc-foot {font-size: 13.5px; line-height: 1.65;}
.acc-foot a.zest {border-bottom: 1px solid var(--line);}
.tk-routes {display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px;}
@media (max-width: 520px) {
  .tk-routes .btn {width: 100%; justify-content: center;}
}
.tk-desk {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 34px; align-items: start;}
@media (max-width: 900px) {
  .tk-desk {grid-template-columns: 1fr; gap: 26px;}
}
.tk-desk-form {background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px;}
.tk-tips {margin-top: 26px;}
.tk-tips h4 {font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--faint); margin: 0 0 12px;}
.tk-gate {display: grid; gap: 12px; text-align: center;}
.tk-gate h3 {margin: 0;}
.tk-gate p {margin: 0; font-size: 14px;}
.tk-gate-alt {font-size: 13px; color: var(--faint);}
.tk-gate-alt a {border-bottom: 1px solid var(--line);}
.tk-file {display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
  padding: 9px 13px; border: 1px dashed var(--line); border-radius: var(--radius-sm);
  font-size: 13px; color: var(--muted); transition: border-color 150ms var(--ease), color 150ms var(--ease);}
.tk-file:hover {border-color: var(--zest-lo); color: var(--zest);}
.tk-file input {display: none;}
.tk-picked {font-size: 11.5px; color: var(--zest);}
.tk-atts {display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px;}
.tk-att {display: inline-flex; align-items: center; gap: 7px; border-radius: var(--radius-sm);}
.tk-att-file {padding: 7px 11px; background: var(--surface); border: 1px solid var(--line); font-size: 12.5px; color: var(--muted);}
.tk-att-file i {color: var(--faint); font-style: normal; font-size: 11px;}
.tk-reply {display: grid; gap: 10px; margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--line-soft);}
.tk-reply textarea {width: 100%; padding: 12px 14px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  color: var(--fg); font: 400 14px/1.55 var(--body); resize: vertical;}
.tk-reply textarea:focus {outline: none; border-color: var(--zest-lo); box-shadow: 0 0 0 3px var(--zest-glow);}
.tk-reply-bar {display: flex; align-items: center; gap: 12px; flex-wrap: wrap;}
.tk-reply-bar .btn {margin-left: auto;}
.tk-closed {font-size: 11.5px; letter-spacing: 0.04em; color: var(--faint); margin: 10px 0 0;}
.tkc-head {display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 28px;}
.tkc-rows {display: grid; gap: 2px;}
.tkc-row {display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center;
  width: 100%; text-align: left; padding: 16px 14px; border: 0; border-radius: var(--radius-sm);
  background: transparent; color: inherit; font: inherit; cursor: pointer;
  border-bottom: 1px solid var(--line-soft);
  transition: background 150ms var(--ease);}
.tkc-row:hover {background: var(--hover);}
.tkc-row-main {min-width: 0; display: grid; gap: 4px;}
.tkc-row-subject {font-size: 14.5px; font-weight: 700; color: var(--fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tkc-row-snip {font-size: 13px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tkc-row-side {display: grid; justify-items: end; gap: 5px; text-align: right;}
.tkc-row-meta {font-size: 11px; color: var(--faint); letter-spacing: 0.06em;}
.tkc-ball {font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--zest);}
.tkc-ball.waiting {color: var(--faint);}
.tkc-more {display: inline-block; margin-top: 16px; font-size: 13.5px; color: var(--zest); border-bottom: 1px solid var(--line);}
@media (max-width: 620px) {
  .tkc-row {grid-template-columns: 1fr; gap: 8px;}
  .tkc-row-side {justify-items: start; text-align: left;}
}
.tkc-back {display: inline-flex; align-items: center; gap: 6px; margin-bottom: 22px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--faint); background: none; border: 0; padding: 0; cursor: pointer;}
.tkc-back:hover {color: var(--zest);}
.tkc-conv-head {display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  padding-bottom: 20px; border-bottom: 1px solid var(--line);}
.tkc-conv-title {min-width: 0;}
.tkc-conv-head h1 {font-size: clamp(17px, 2.45vw, 24px);}
.tkc-meta {display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint);}
.tkc-meta span:empty {display: none;}
.tk-att.is-gone {opacity: 0.6; padding: 7px 11px; background: var(--surface); border: 1px dashed var(--line);}
.tk-att.is-gone img, .tk-att.is-gone video {display: none;}
.tk-att.is-gone::after {content: "file unavailable"; font-family: var(--mono); font-size: 11px; letter-spacing: 0.06em; color: var(--faint);}
.tk-att-file {cursor: pointer;}
.tk-att-file:hover {border-color: var(--zest-lo); color: var(--zest);}
.tkc-reply {margin-top: 10px;}
.ops-filters {display: grid; gap: 14px; margin-bottom: 20px;}
.ops-chips {display: flex; flex-wrap: wrap; gap: 8px;}
.ops-chip {padding: 7px 13px; border-radius: 999px; border: 1px solid var(--line);
  background: transparent; color: var(--muted); cursor: pointer;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase;
  transition: border-color 150ms var(--ease), color 150ms var(--ease), background 150ms var(--ease);}
.ops-chip:hover {color: var(--fg); border-color: var(--line-strong, var(--line));}
.ops-chip.on {color: var(--bg); background: var(--zest); border-color: var(--zest);}
.ops-filter-row {display: grid; grid-template-columns: repeat(2, minmax(0, 160px)) minmax(0, 1fr); gap: 10px;}
.ops-filter-row select, .ops-filter-row input {padding: 10px 12px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-sm); color: var(--fg); font: 400 13.5px/1.4 var(--body);}
.ops-filter-row select:focus, .ops-filter-row input:focus {outline: none; border-color: var(--zest-lo); box-shadow: 0 0 0 3px var(--zest-glow);}
@media (max-width: 700px) {
  .ops-filter-row {grid-template-columns: 1fr;}
}
.ops-rows {display: grid; gap: 2px;}
.ops-tag {font-family: var(--mono); font-style: normal; font-size: 9.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: #E5533C; border: 1px solid rgba(229, 83, 60, 0.35);
  border-radius: 4px; padding: 1px 5px; margin-left: 6px; vertical-align: middle;}
.ops-open {display: grid;}
.ops-controls {display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 20px;}
.ops-controls select {padding: 9px 12px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-sm); color: var(--fg); font: 400 13px/1.4 var(--body);}
.ops-assigned {font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--faint); margin-left: auto;}
.ops-notes {margin: 4px 0 20px; padding: 16px 18px; border: 1px dashed rgba(229, 174, 58, 0.35); border-radius: var(--radius-sm); background: rgba(229, 174, 58, 0.04);}
.ops-notes:empty {display: none;}
.ops-notes-h {margin: 0 0 12px; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold);}
.ops-note + .ops-note {margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line-soft);}
.ops-note .mono {font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint);}
.ops-note p {margin: 5px 0 0; font-size: 13.5px; line-height: 1.6; color: var(--muted);}
.ops-note-form {display: grid; gap: 10px; margin-top: 14px; justify-items: start;}
.ops-note-form textarea {width: 100%; padding: 11px 13px; background: var(--surface);
  border: 1px dashed rgba(229, 174, 58, 0.35); border-radius: var(--radius-sm);
  color: var(--fg); font: 400 13.5px/1.55 var(--body); resize: vertical;}
.ops-note-form textarea:focus {outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(229, 174, 58, 0.12);}
.tk-status {display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--muted);}
.tk-status::before {content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor;}
.tk-live {color: var(--zest);}
.tk-dead {color: #E5533C;}
.tkc-toolbar {display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 18px;}
.tkc-search {flex: 1; min-width: 220px;}
.tkc-search input {font-size: 14px; padding: 9px 0;}
.tkc-toolbar .btn {flex: none;}
@media (max-width: 560px) {
  .tkc-toolbar .btn {width: 100%; justify-content: center;}
}
.tkc-rows {display: grid; gap: 10px;}
.tkc-row {position: relative;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center;
  width: 100%; text-align: left; padding: 18px 20px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  color: inherit; font: inherit; cursor: pointer;
  transition: border-color 160ms var(--ease), background 160ms var(--ease), transform 160ms var(--ease);}
.tkc-row:hover {border-color: var(--zest-lo); background: var(--hover); transform: translateY(-1px);}
.tkc-row.is-shut {opacity: 0.62;}
.tkc-row.is-shut:hover {opacity: 1;}
.tkc-row-main {min-width: 0; display: grid; gap: 5px;}
.tkc-row-ref {font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--zest);}
.tkc-row.is-shut .tkc-row-ref {color: var(--faint);}
.tkc-row-subject {font-size: 15.5px; font-weight: 700; color: var(--fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tkc-row-snip {font-size: 13px; line-height: 1.5; color: var(--muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.tkc-row-side {display: grid; justify-items: end; gap: 7px; text-align: right;}
.tkc-row-meta {font-size: 10.5px; color: var(--faint); letter-spacing: 0.06em;}
.tkc-ball {font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--zest);}
.tkc-ball.waiting {color: var(--faint);}
.tkc-dot {position: absolute; top: -8px; left: -8px; z-index: 2;
  min-width: 22px; height: 22px; padding: 0 6px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #E5533C; color: #fff; border-radius: 999px;
  font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: 0;
  box-shadow: 0 0 0 3px var(--bg);}
.tkc-row.is-new {border-color: rgba(229, 83, 60, 0.4);}
.tkc-more {display: inline-block; margin-top: 16px; font-size: 13.5px; color: var(--zest); border-bottom: 1px solid var(--line);}
@media (max-width: 620px) {
  .tkc-row {grid-template-columns: 1fr; gap: 10px;}
  .tkc-row-side {justify-items: start; text-align: left;}
}
.tkc-back {display: inline-flex; align-items: center; gap: 7px; margin-bottom: 24px;
  padding: 8px 14px 8px 11px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 999px;
  font-family: var(--body); font-size: 13px; font-weight: 600; letter-spacing: 0;
  text-transform: none; color: var(--muted); cursor: pointer;
  transition: border-color 160ms var(--ease), color 160ms var(--ease), background 160ms var(--ease);}
.tkc-back:hover {color: var(--fg); border-color: var(--zest-lo); background: var(--hover);}
.tkc-sub {margin: 8px 0 0; font-size: 15px; color: var(--muted);}
.tkc-conv-head {align-items: flex-start; padding-bottom: 22px;}
.tkc-meta {margin-top: 10px;}
.tkc-thread {display: grid; gap: 22px;
  margin: 26px 0 0; padding: 26px 24px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  max-height: 62vh; overflow-y: auto;}
.tkc-thread:empty {display: none;}
.tk-bub {display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; max-width: 84%; justify-self: start;}
.tk-bub.mine {grid-template-columns: minmax(0, 1fr) auto; justify-self: end;}
.tk-bub.mine .tk-bub-head {order: 2;}
.tk-bub.mine .tk-bub-col {order: 1;}
.tk-bub-head {width: 34px; height: 34px; border-radius: 9px; flex: none;
  image-rendering: pixelated; border: 1px solid var(--line); background: var(--card);}
.tk-bub-col {min-width: 0;}
.tk-bub-who {font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--faint); margin-bottom: 7px;}
.tk-bub.mine .tk-bub-who {color: var(--zest-lo);}
.tk-bub-at {margin-top: 6px; font-size: 10.5px; letter-spacing: 0.06em; color: var(--faint);}
.tk-bub.mine .tk-bub-at {text-align: right;}
@media (max-width: 620px) {
  .tk-bub {max-width: 100%;}
}
.tk-att-img, .tk-att-vid {position: relative; padding: 0; border: 0; background: none; cursor: pointer; display: block;}
.tk-att-img img, .tk-att-vid video {max-width: 210px; max-height: 150px; display: block;
  border-radius: 10px; border: 1px solid var(--line); background: var(--surface);}
.tk-att-img:hover img, .tk-att-vid:hover video {border-color: var(--zest-lo);}
.tk-att-play {position: absolute; inset: 0; display: grid; place-items: center;
  color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,0.6); pointer-events: none;}
.tk-att-file.is-purged {cursor: default; opacity: 0.6; border-style: dashed;}
.tk-att-file.is-purged:hover {border-color: var(--line); color: var(--muted);}
.tk-lb {position: fixed; inset: 0; z-index: 200; display: none;
  place-items: center; grid-template-rows: 1fr auto;
  background: rgba(6, 6, 7, 0.88); backdrop-filter: blur(6px);
  padding: 56px 24px 24px;}
.tk-lb.in {display: grid;}
.tk-lb-stage {display: grid; place-items: center; min-height: 0; width: 100%;}
.tk-lb-stage img, .tk-lb-stage video {max-width: min(1100px, 92vw); max-height: 76vh; border-radius: 10px; display: block;}
.tk-lb-x {position: absolute; top: 18px; right: 18px; width: 38px; height: 38px;
  display: grid; place-items: center; cursor: pointer;
  background: var(--surface); border: 1px solid var(--line); border-radius: 50%; color: var(--muted);}
.tk-lb-x:hover {color: var(--fg); border-color: var(--zest-lo);}
.tk-lb-foot {display: flex; align-items: center; gap: 16px; margin-top: 18px;}
.tk-lb-name {font-size: 11.5px; color: var(--faint); letter-spacing: 0.06em;}
.tkc-tray {display: flex; flex-wrap: wrap; gap: 10px;}
.tkc-tray:empty {display: none;}
.tkc-tray:not(:empty) {margin-bottom: 12px;}
.tkc-reply {margin-top: 20px; display: block;}
.tkc-bar {display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: end;
  padding: 8px 8px 8px 10px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 14px;
  transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease);}
.tkc-bar:focus-within {border-color: var(--zest-lo); box-shadow: 0 0 0 3px var(--zest-glow);}
.tkc-bar textarea {width: 100%; min-height: 40px; max-height: 190px; resize: none;
  background: none; border: 0; outline: 0; color: var(--fg);
  font: 400 14.5px/1.55 var(--body); padding: 10px 0;}
.tkc-bar textarea::placeholder {color: var(--faint);}
.tkc-clip {width: 38px; height: 38px; display: grid; place-items: center; cursor: pointer;
  border-radius: 9px; color: var(--faint); background: none; border: 0;
  transition: color 150ms var(--ease), background 150ms var(--ease);}
.tkc-clip:hover {color: var(--zest); background: var(--hover);}
.tkc-clip input {display: none;}
.tkc-send {flex: none; gap: 8px;}
.tkc-reply.is-shut .tkc-bar:focus-within {border-color: var(--line); box-shadow: none;}
.tkc-reply.is-shut textarea {cursor: not-allowed; color: var(--muted);}
.tkc-reply.is-shut .tkc-clip, .tkc-reply.is-shut .tkc-send {opacity: 0.42; pointer-events: none;}
.tkc-reply.is-shut .tkc-send {filter: saturate(0.35);}
.tk-closed {margin-top: 12px;}
.tk-actions {justify-content: space-between;}
.tk-actions-end {justify-content: flex-end;}
.tkc-clip-flat {width: auto; height: auto; gap: 8px; padding: 9px 14px;
  display: inline-flex; align-items: center;
  border: 1px dashed var(--line); border-radius: var(--radius-sm); font-size: 13px; color: var(--muted);}
.tkc-clip-flat:hover {border-color: var(--zest-lo); color: var(--zest); background: none;}
.tkc-head-row {display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;}
.tkc-head-text {min-width: 0;}
.tkc-new {flex: none; gap: 8px;}
@media (max-width: 620px) {
  .tkc-head-row {align-items: stretch;}
  .tkc-new {width: 100%; justify-content: center;}
}
.tkc-toolbar[hidden] {display: none;}
.tkc-dot {left: auto; right: -8px;}
.tkc-row-ref {font-family: var(--mono); font-size: 14px; font-weight: 600; letter-spacing: 0.08em;
  color: var(--fg); text-transform: none;}
.tkc-row.is-shut .tkc-row-ref {color: var(--muted);}
.tkc-row-main {gap: 7px;}
.tk-status.is-lg {font-size: 13px; letter-spacing: 0.1em; gap: 8px;}
.tk-status.is-lg::before {width: 8px; height: 8px;}
.tkc-conv-head .tkc-meta {font-size: 13px; letter-spacing: 0.08em; color: var(--muted);}
.tkc-thread {scrollbar-width: thin;
  scrollbar-color: var(--line) transparent;
  overscroll-behavior: contain;}
.tkc-thread::-webkit-scrollbar {width: 10px;}
.tkc-thread::-webkit-scrollbar-track {background: transparent;}
.tkc-thread::-webkit-scrollbar-button {display: none; height: 0; width: 0;}
.tkc-thread::-webkit-scrollbar-thumb {background: var(--line); border-radius: 999px;
  
  border: 3px solid transparent; background-clip: content-box;}
.tkc-thread::-webkit-scrollbar-thumb:hover {background: var(--faint); background-clip: content-box;}
.tkc-bar {padding: 8px;}
.tkc-reply {position: relative;}
.tkc-tray-float {position: absolute; left: 0; right: 0; bottom: calc(100% + 8px); z-index: 30;
  padding: 10px; margin: 0;
  background: var(--card); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, 0.85);
  max-height: 190px; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: var(--line) transparent;}
.tkc-tray-float:not(:empty) {margin-bottom: 0;}
.tkc-tray-float .tkf-chip {background: var(--surface);}
.tkc-limits {margin: 8px 0 0; font-size: 11px; letter-spacing: 0.06em; color: var(--faint);}
.tkc-reply.is-shut .tkc-limits {opacity: 0.5;}
.ops-rows {gap: 10px;}
.ops-subject-line {margin: 14px 0 0; font-size: 17px; font-weight: 650; line-height: 1.35; color: var(--fg);}
.ops-controls {margin-top: 16px;}
#ops-queue .pf-count {align-self: flex-end;}
#ops-one .ops-notes {margin: 20px 0 0;}
#ops-one .ops-note-form {margin-top: 22px;}
#tkc-rows .tkc-row-snip, #ops-rows .tkc-row-snip {white-space: normal; text-overflow: clip;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.ops-filter-row .fsel {min-width: 0;}
.ops-filter-row .fsel-btn {padding: 10px 12px; font-size: 13.5px;}
.ops-controls .fsel {min-width: 190px;}
.ops-controls .fsel-btn {padding: 9px 12px; font-size: 13.5px;}
.ops-controls .fsel-list, .ops-filter-row .fsel-list {z-index: 60;}
.tkc-row-head {display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0;}
#ops-rows .tkc-row-ref {font-size: 14px;}
.ops-tag {color: var(--faint); border-color: var(--line); margin-left: 0;
  font-size: 9.5px; padding: 2px 6px;}
.ops-tag.is-appeal {color: #E5533C; border-color: rgba(229, 83, 60, 0.35);}
.ops-tag.is-gold {color: var(--gold-ink); background: var(--gold); border-color: var(--gold-lo);
  font-weight: 700; letter-spacing: 0.06em;}
#ops-rows .tkc-row-side {gap: 5px;}
.tk-field-head {display: block; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 8px;}
.ap-actions .tk-note {margin: 0; flex: 1 1 260px; min-width: 0;}
@media (max-width: 560px) {
  .ap-actions .tk-note {flex: none;}
  .ap-actions .tk-note:empty {display: none;}
}
.tkc-watching {margin: 18px 0 0; font-size: 13px;}
.tkc-forget {background: none; border: 1px solid var(--line); border-radius: 999px;
  padding: 6px 12px; cursor: pointer; color: var(--muted);
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;}
.tkc-forget:hover {color: #E5533C; border-color: rgba(229, 83, 60, 0.4);}
.tkc-reply.is-appeal .tkc-limits {display: none;}
.tk-count {margin-left: auto; font-size: 10.5px; letter-spacing: 0.06em; color: var(--faint);
  font-variant-numeric: tabular-nums;}
.tk-count[hidden] {display: none;}
.tk-count.is-full {color: #E5533C;}
.tkc-limits {display: flex; align-items: center; gap: 12px;}
.ap-box-bar .tk-count {margin-left: auto;}
.tkc-bar {--tkc-row: 42px;}
.tkc-bar textarea {min-height: var(--tkc-row);}
.tkc-bar .tkc-clip {width: var(--tkc-row); height: var(--tkc-row);}
.tkc-bar .tkc-send {height: var(--tkc-row); padding-top: 0; padding-bottom: 0;}
.ops-controls {display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; margin-top: 18px;}
.ops-control {display: grid; gap: 6px; min-width: 190px;}
.ops-control-k {font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--faint);}
.ops-control-actions {display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto;}
.ops-close.is-shut {color: var(--zest); border-color: var(--zest-lo);}
.ops-destroy {color: #E5533C; border-color: rgba(229, 83, 60, 0.3);}
.ops-destroy:hover {color: #FF6B52; border-color: #E5533C; background: rgba(229, 83, 60, 0.08);}
.ops-destroy[hidden] {display: none;}
.ops-notes-block {margin-top: 34px; padding-top: 26px; border-top: 1px dashed rgba(229, 174, 58, 0.3);}
.ops-notes-title {display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  margin: 0 0 14px; font-size: 17px; color: var(--gold);}
.ops-notes-title i {font-style: normal; font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--faint);}
.ops-note-box {background: rgba(229, 174, 58, 0.04);
  border: 1px solid rgba(229, 174, 58, 0.3); border-radius: var(--radius-sm);
  transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease);}
.ops-note-box:focus-within {border-color: var(--gold); box-shadow: 0 0 0 3px rgba(229, 174, 58, 0.12);}
.ops-note-box textarea {width: 100%; display: block; resize: none; min-height: 56px; max-height: 220px;
  background: none; border: 0; outline: 0; color: var(--fg);
  font: 400 14px/1.6 var(--body); padding: 12px 14px 0;}
.ops-note-box textarea::placeholder {color: var(--faint);}
.ops-note-bar {display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 14px;}
.ops-note-bar .tk-note {margin: 0; flex: 1 1 auto; min-width: 0;}
.ops-note-bar .btn {flex: none; margin-left: auto;}
.ops-notes {margin: 18px 0 0; padding: 0; border: 0; background: none;}
.ops-notes:empty {display: none;}
.ops-notes-none {margin: 0; font-size: 13px; color: var(--faint);}
.ops-note {padding: 14px 16px; border-radius: var(--radius-sm);
  background: rgba(229, 174, 58, 0.04); border: 1px solid rgba(229, 174, 58, 0.18);}
.ops-note + .ops-note {margin-top: 10px; border-top: 1px solid rgba(229, 174, 58, 0.18); padding-top: 14px;}
.ops-note-head {display: flex; align-items: center; gap: 12px;}
.ops-note-head .mono {font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint);}
.ops-note-edited {font-style: normal; color: var(--gold);}
.ops-note-acts {margin-left: auto; display: flex; gap: 6px;}
.ops-note-acts button {background: none; border: 0; cursor: pointer; padding: 3px 6px; border-radius: 5px;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--faint);}
.ops-note-acts button:hover {color: var(--fg); background: var(--hover);}
.ops-note-acts button.is-bad:hover {color: #E5533C; background: rgba(229, 83, 60, 0.1);}
.ops-note p {margin: 6px 0 0; font-size: 13.5px; line-height: 1.6; color: var(--muted);}
.ops-note-edit {margin-top: 10px;}
.ops-note-edit textarea {width: 100%; display: block; resize: none; min-height: 70px; max-height: 260px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm);
  outline: 0; color: var(--fg); font: 400 13.5px/1.6 var(--body); padding: 10px 12px;}
.ops-note-edit textarea:focus {border-color: var(--gold); box-shadow: 0 0 0 3px rgba(229, 174, 58, 0.12);}
.ops-note-edit .ops-note-bar {padding: 10px 0 0; justify-content: flex-end;}
.ops-note-edit .ops-note-bar .btn {margin-left: 0;}
.tkc-dot-mark {min-width: 14px; width: 14px; height: 14px; padding: 0;}
.tk-done {color: var(--muted);}
#player-grid .player-empty {margin-top: 18px;}
.ops-note-form {justify-items: stretch;}
.ops-note-form > .ops-note-box {width: 100%;}
.ops-note-box textarea {min-height: 78px;}
.ops-note-bar {padding: 6px 10px 10px 14px;}
#ops-rows .tkc-row.is-new {border-color: var(--line);}
#ops-rows .tkc-dot {min-width: 20px; height: 20px; padding: 0 6px;
  font-size: 11px; line-height: 1;}
#ops-rows .tkc-row-head {display: grid;
  grid-template-columns: 104px 132px auto;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;}
#ops-rows .tkc-row-head .ops-tag {justify-self: start;}
#ops-rows .tkc-row-ref {white-space: nowrap;}
@media (max-width: 620px) {
  #ops-rows .tkc-row-head {display: flex; flex-wrap: wrap; gap: 8px;}
}
#acc-dash .pf-count, #acc-dash .tk-status {font-family: var(--display); font-weight: 600;}
.cr-app {max-width: 820px; margin-inline: auto;}
.cr-card {background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: clamp(26px, 5vw, 52px); text-align: center;}
.cr-hero {border-color: var(--gold-line); box-shadow: 0 40px 90px -50px rgba(229, 174, 58, 0.35);}
.cr-hero .eyebrow {justify-content: center;}
.cr-h1 {font-size: clamp(34px, 6vw, 62px); margin: 14px 0 0; overflow-wrap: anywhere;}
.cr-h1 .l2 {display: block; margin-top: 4px;
  background: linear-gradient(176deg, #FBD877 8%, #E5AE3A 42%, #A8781C 78%, #E9B84A 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;}
.cr-lede {margin: 18px auto 0;}
.cr-giver {position: relative; width: 76px; height: 76px; margin: 0 auto 22px;}
.cr-giver-head {width: 76px; height: 76px; border-radius: 14px; image-rendering: pixelated; display: block;
  background: var(--surface); border: 1px solid var(--gold-line);}
.cr-giver-head.is-mark {image-rendering: auto; padding: 14px;}
.cr-giver-mark {position: absolute; right: -10px; bottom: -10px; width: 30px; height: 30px; padding: 4px;
  border-radius: 50%; background: var(--card); border: 1px solid var(--gold-line);}
.cr-h1 {margin-top: 0;}
.cr-h1-who {display: block; font-size: 0.56em; letter-spacing: -0.02em; color: var(--muted); font-weight: 600;}
.cr-h1-who b {color: var(--fg); font-weight: 700;}
.cr-ticket {display: flex; align-items: stretch; max-width: 460px; margin: 28px auto 0; text-align: left;
  border: 1px solid var(--gold-line); border-radius: 14px; background: rgba(229, 174, 58, 0.06); overflow: hidden;}
.cr-ticket-main {flex: 1; min-width: 0; display: flex; align-items: center; gap: 14px; padding: 16px 18px;}
.cr-ticket-main img {flex: none; width: 44px; height: 44px;}
.cr-ticket-main div {display: flex; flex-direction: column; gap: 2px; min-width: 0;}
.cr-ticket-main b {font-family: var(--display); font-size: 19px; letter-spacing: -0.015em; color: var(--gold);}
.cr-ticket-main span {color: var(--muted); font-size: 14px; overflow-wrap: anywhere;}
.cr-ticket-main span span {color: var(--fg); font-weight: 600;}
.cr-ticket-code {position: relative; flex: none; display: flex; flex-direction: column; justify-content: center; gap: 2px;
  padding: 14px 20px; border-left: 1px dashed var(--gold-line); text-align: center;}
.cr-ticket-code::before, .cr-ticket-code::after {content: ""; position: absolute; left: -8px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--card); border: 1px solid var(--gold-line);}
.cr-ticket-code::before {top: -8px;}
.cr-ticket-code::after {bottom: -8px;}
.cr-ticket-code span {color: var(--faint); font-size: 12.5px;}
.cr-ticket-code b {font-size: 16px; font-weight: 700; color: var(--fg); letter-spacing: 0.02em;}
.cr-hero.is-claimed .cr-ticket {background: rgba(229, 174, 58, 0.12); border-color: rgba(229, 174, 58, 0.55);}
.cr-hero.is-claimed .cr-ticket-code span {font-size: 0;}
.cr-hero.is-claimed .cr-ticket-code span::after {content: "Yours"; font-size: 12.5px; color: var(--gold); font-weight: 700;}
.cr-done.is-fresh {animation: crPop 0.42s cubic-bezier(0.2, 0.9, 0.3, 1.25) both;}
.cr-done.is-fresh .cr-done-ic {background: var(--gold); color: var(--gold-ink);}
.cr-done.is-fresh {background: rgba(229, 174, 58, 0.08); border-color: var(--gold-line);}
@media (max-width: 480px) {
  .cr-ticket {flex-direction: column;}
  .cr-ticket-code {border-left: 0; border-top: 1px dashed var(--gold-line); flex-direction: row; justify-content: center; gap: 8px; align-items: baseline;}
  .cr-ticket-code::before, .cr-ticket-code::after {display: none;}
}
@media (prefers-reduced-motion: reduce) {
  .cr-done.is-fresh {animation: none;}
}
.cr-action {margin: 30px auto 0; max-width: 460px; display: flex; flex-direction: column; align-items: center; gap: 12px;}
.cr-go {width: 100%; max-width: 360px; justify-content: center; white-space: normal; text-align: center;}
.cr-go:disabled {opacity: 0.6; cursor: progress;}
.cr-help {margin: 0; color: var(--faint); font-size: 13.5px; line-height: 1.55;}
.cr-fine {margin: 28px auto 0; max-width: 520px; color: var(--faint); font-size: 12.5px; line-height: 1.6;}
.cr-wait {margin: 0; font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--faint); display: flex; align-items: center; justify-content: center; gap: 8px;}
.cr-wait i {width: 7px; height: 7px; border-radius: 50%; background: var(--gold); animation: msPulse 1.4s ease-in-out infinite;}
.cr-loading {display: grid; justify-items: center; gap: 16px;}
.cr-msg {margin: 0; width: 100%; padding: 11px 14px; border-radius: var(--radius-sm); font-size: 14px; line-height: 1.55;
  color: var(--fg); background: var(--surface); border: 1px solid var(--line); text-align: left;}
.cr-msg-no {border-color: rgba(229, 174, 58, 0.35); background: rgba(229, 174, 58, 0.06);}
.cr-msg b {color: var(--gold);}
.cr-who {display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; font-size: 14px; color: var(--muted);}
.cr-who img {width: 28px; height: 28px; border-radius: 6px; image-rendering: pixelated;}
.cr-who b {color: var(--fg);}
.cr-link {background: none; border: 0; padding: 0; font: inherit; font-size: 13.5px; color: var(--zest); cursor: pointer;
  border-bottom: 1px solid var(--line);}
.cr-link:hover {color: var(--zest-hi);}
.cr-row {display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;}
.cr-done {width: 100%; display: flex; gap: 14px; align-items: flex-start; text-align: left;
  padding: 16px 18px; border-radius: var(--radius-sm); background: rgba(47, 194, 74, 0.07); border: 1px solid var(--zest-lo);}
.cr-done b {font-family: var(--display); font-size: 19px; letter-spacing: -0.02em;}
.cr-done p {margin: 4px 0 0; color: var(--muted); font-size: 14.5px; line-height: 1.55;}
.cr-done-ic {flex: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: var(--accent); color: var(--zest-ink); margin-top: 1px;}
.cr-sub {font-size: clamp(20px, 2.4vw, 26px); margin: 0 0 16px;}
.cr-perks {padding: 4px 2px 0;}
.cr-perk-list {list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;}
.cr-perk-list li {display: flex; flex-direction: column; gap: 3px; padding: 16px 18px 16px 44px; position: relative;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm);}
.cr-perk-list li::before {content: ""; position: absolute; left: 17px; top: 20px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314100A' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 10px no-repeat;}
.cr-perk-list b {font-size: 15px;}
.cr-perk-list span {color: var(--muted); font-size: 13.5px; line-height: 1.55;}
.cr-more {margin: 14px 0 0; font-size: 14px;}
.cr-cards {display: grid; grid-template-columns: repeat(auto-fill, minmax(176px, 210px)); gap: 16px;}
.cr-cards .sf-row {min-height: 40px; flex-wrap: wrap; gap: 4px 10px;}
.cr-cards .cr-link {white-space: nowrap;}
.cr-invalid h2 {font-size: clamp(28px, 4vw, 40px); margin: 12px 0 0;}
.cr-invalid .eyebrow {justify-content: center;}
.cr-invalid-msg {color: var(--muted); max-width: 46ch; margin: 14px auto 26px; line-height: 1.6;}
.cr-invalid-msg b {color: var(--fg);}
@media (max-width: 640px) {
  .cr-perk-list {grid-template-columns: 1fr;}
  .cr-cards {grid-template-columns: repeat(2, minmax(0, 1fr));}
  .cr-row .btn {flex: 1 1 auto; justify-content: center;}
}
@media (prefers-reduced-motion: reduce) {
  .cr-wait i {animation: none; opacity: 1;}
}
.cr-acc-row {display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px;}
.cr-code {font-family: var(--mono); font-size: 18px; font-weight: 700; letter-spacing: 0.06em; color: var(--gold);}
.cr-chip {font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted);}
.cr-chip.wait {color: var(--gold); border-color: var(--gold-line);}
.cr-chip.on {color: var(--zest); border-color: var(--zest-lo);}
.cr-when {color: var(--faint); font-size: 13px;}
.cr-acc-form {max-width: 460px;}
.cr-acc-form input {width: 0; text-transform: uppercase; font-family: var(--mono); letter-spacing: 0.06em;}
.cr-acc-form input::placeholder {text-transform: none; font-family: var(--body); letter-spacing: 0;}
.cr-acc-form .btn:disabled {opacity: 0.6; cursor: progress;}
.cr-acc-msg {min-height: 20px; margin: 8px 0 0; font-size: 13.5px; line-height: 1.55; color: #C3C3CC;}
.cr-acc-msg b {color: var(--fg);}
.cr-ok {display: flex; align-items: center; gap: 8px; margin: 10px 0 0; color: var(--zest); font-size: 14px;}
.cr-end {display: flex; flex-direction: column; gap: 10px; margin-top: 18px;}
.cr-end h4 {margin: 0; font-family: var(--display); font-size: 22px; letter-spacing: -0.015em; color: var(--fg);}
.cr-end p {margin: 0; color: var(--muted); font-size: 15.5px; line-height: 1.55;}
.cr-end p b {color: var(--fg);}
.cr-end .cr-sl {color: var(--fg); font-size: 14.5px; margin-top: 8px;}
.cr-offer {display: flex; align-items: center; gap: 18px; margin-top: 6px; padding: 16px 20px; border-radius: 12px; background: rgba(229, 174, 58, 0.07); border: 1px solid rgba(229, 174, 58, 0.35);}
.cr-offer .pct {font-family: var(--display); font-size: 32px; font-weight: 650; letter-spacing: -0.03em; color: var(--gold); white-space: nowrap; line-height: 1;}
.cr-offer div {display: flex; flex-direction: column; gap: 3px; font-size: 14.5px; color: var(--muted);}
.cr-offer div > b {color: var(--fg); font-size: 16px;}
.cr-offer span b {color: var(--fg);}
.cr-end-go {display: flex; margin-top: 10px;}
@media (max-width: 640px) {
  .cr-offer {flex-wrap: wrap;}
}
.cd-card {background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 20px;}
.cd-card-head {display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 6px;}
.cd-card-head h2 {font-size: 20px; margin: 0; letter-spacing: -0.02em;}
.cd-card-head .muted {font-size: 13.5px; flex: 1 1 260px;}
.cd-empty {color: var(--muted); margin: 10px 0 4px;}
.cd-app, .cd-mem {display: grid; grid-template-columns: minmax(220px, 1.3fr) minmax(160px, 1fr) minmax(200px, 1.2fr); gap: 10px 18px; align-items: center;
  padding: 16px 0; border-top: 1px solid var(--line-soft);}
.cd-app > :nth-child(n+4), .cd-mem > .cd-app-act {grid-column: 1 / -1;}
.cd-mem.ended {opacity: 0.55;}
.cd-app-who {display: flex; align-items: center; gap: 12px; min-width: 0;}
.cd-app-who .muted {font-size: 13px; margin-top: 2px; overflow-wrap: anywhere;}
.cd-head {width: 32px; height: 32px; border-radius: 6px; image-rendering: pixelated; flex: none; background: var(--surface);}
.cd-app-ch {font-size: 14px; line-height: 1.6;}
.cd-app-stats {font-size: 13.5px;}
.cd-app-note {margin: 0; font-size: 14px; color: var(--muted);}
.cd-app-act {display: flex; align-items: center; gap: 8px; flex-wrap: wrap;}
.cd-code {display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--muted); margin-right: 4px;}
.cd-code input {width: 130px; padding: 7px 10px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--fg); text-transform: uppercase; font: inherit;}
.cd-code input:focus {outline: none; border-color: var(--zest-lo); box-shadow: 0 0 0 3px var(--zest-glow);}
.cd-code-tag {font-size: 13px; color: var(--muted); background: var(--surface); border: 1px solid var(--line-soft); border-radius: 6px; padding: 1px 7px;}
.cd-pill {display: inline-block; font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--surface); color: var(--muted); border: 1px solid var(--line-soft); vertical-align: 1px;}
.cd-pill.gold {color: var(--gold); border-color: rgba(255, 196, 70, 0.35); background: rgba(255, 196, 70, 0.08);}
.cd-pill.red {color: #FF8A80; border-color: rgba(255, 110, 100, 0.35); background: rgba(255, 110, 100, 0.08);}
.cd-months {display: grid; gap: 6px;}
.cd-month {display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13.5px;}
.cd-starts {font-variant-numeric: tabular-nums; min-width: 46px; font-weight: 600;}
.cd-starts.hit {color: var(--gold);}
.cd-seg {display: inline-flex; align-items: center; gap: 6px; color: var(--fg); cursor: pointer;}
.cd-seg input {accent-color: var(--zest); width: 15px; height: 15px;}
.cd-earn {font-size: 14px; display: grid; gap: 3px;}
.cd-warn {color: var(--gold); font-size: 13px;}
.cd-older {margin-top: 10px; border-top: 1px solid var(--line-soft); padding-top: 12px; font-size: 14px; display: grid; gap: 4px;}
.cd-older summary {cursor: pointer; color: var(--muted); margin-bottom: 6px;}
.cd-pay {display: grid; gap: 6px; margin-top: 10px; font-size: 14px;}
.cd-dot {display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--faint); margin-right: 8px; vertical-align: 1px;}
.cd-dot.on {background: var(--zest); box-shadow: 0 0 0 3px var(--zest-glow);}
.cd-modal {position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; padding: 16px; background: rgba(4, 6, 8, 0.66); backdrop-filter: blur(4px);}
.cd-dialog {width: min(460px, 100%); background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; display: grid; gap: 12px;}
.cd-dialog h3 {margin: 0; font-size: 19px;}
.cd-dialog p {margin: 0; font-size: 14px; line-height: 1.55;}
.cd-lab {display: grid; gap: 6px; font-size: 13.5px; color: var(--muted);}
.cd-lab textarea, .cd-lab input {padding: 9px 11px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--fg); font: inherit; resize: vertical;}
.cd-dlg-act {display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px;}
.cd-toast {position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 500; background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--zest);
  border-radius: 10px; padding: 11px 16px; font-size: 14px; max-width: min(520px, calc(100vw - 32px)); box-shadow: 0 18px 40px -20px rgba(0, 0, 0, 0.9); transition: opacity 0.3s;}
.cd-toast.bad {border-left-color: #D9443A;}
.cd-toast.out {opacity: 0;}
@media (max-width: 760px) {
  .cd-app, .cd-mem {grid-template-columns: minmax(0, 1fr);}
  .cd-card {padding: 16px;}
}

.desk [class*="ops-"], .desk [class*="tkc-"], .desk [class*="cd-"], .desk [class*="cr-"], .desk .tk-status, .desk .tk-note,
.desk [class*="ops-"] *, .desk [class*="tkc-"] *, .desk [class*="cd-"] *, .desk .tk-status * {
  text-transform: none !important; letter-spacing: normal !important; font-family: var(--text); }
.desk .mono, .desk .mono * { text-transform: none !important; letter-spacing: normal !important; font-family: var(--text) !important; }
.desk [class*="ops-"] *, .desk [class*="tkc-"] *, .desk [class*="tk-"], .desk [class*="tk-"] *, .desk [class*="cd-"] * { font-family: var(--text) !important; text-transform: none !important; letter-spacing: normal !important; }
.desk a[class], .desk a[class] * { text-decoration: none; }
.desk .cd-pill.indigo { color: #A9A4FF; border-color: rgba(108, 99, 255, 0.45); background: rgba(108, 99, 255, 0.12); }
/* sized for capitals before; in sentence case they read too small */
.desk :is(.ops-chip, .ops-control-k, .ops-tag, .tkc-dot, .tkc-limits, .tkc-row-meta, .tkc-row-meta *, .mono, .cd-pill, .cd-lab, .cd-code-tag, .cr-sl, .tk-bub-who, .tk-att-gone, .ops-note-head, .ops-note-edited) { font-size: 13px !important; }