/* Made by experiments/landing/scope-css.mjs from console/a/style.css. Don't edit. */
.cx {font-size: 14px; font-feature-settings: "ss01", "cv11"; letter-spacing: -.003em;}
.cx time, .cx .num {font-variant-numeric: tabular-nums;}
.cx .boot {display: grid; place-items: center; height: 100vh; color: var(--ink-3);}
.cx .app {display: flex; height: 100vh; height: 100dvh;}
.cx .main {flex: 1; min-width: 0; display: flex; flex-direction: column; min-height: 0;}
.cx .spacer {flex: 1;}
.cx .small {font-size: 13px;}
.cx code {font: 12px var(--mono); background: var(--sunk); padding: 1px 4px; border-radius: 4px;}
.cx .rail {width: 68px; flex: none; display: flex; flex-direction: column; align-items: center; border-right: 1px solid var(--line); background: var(--panel); padding: 12px 0 10px;}
.cx .logo {display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; margin-bottom: 14px; background: var(--ink); color: var(--panel);}
.cx .mark {display: inline-grid; place-items: center; flex: none; color: #fff; font-weight: 600; letter-spacing: .02em; line-height: 1; user-select: none;}
.cx .rail-navs {display: flex; flex-direction: column; gap: 4px;}
.cx .rail-nav {width: 56px; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 0 5px; border-radius: 10px; color: var(--ink-3); text-decoration: none;}
.cx .rail-nav:hover {color: var(--ink); background: var(--sunk);}
.cx .rail-nav.on {color: var(--accent-ink); background: var(--accent-tint);}
.cx .rail-ico {position: relative; display: grid;}
.cx .rail-label {font-size: 10px; font-weight: 600; letter-spacing: .01em; white-space: nowrap;}
.cx .rail-line {width: 28px; height: 1px; background: var(--line); margin: 12px 0; flex: none;}
.cx .rail-list {flex: 1; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 4px 0 8px;}
.cx .rail-b {position: relative; display: grid; border-radius: 12px; text-decoration: none;}
.cx .rail-b .mark {border-radius: 11px; transition: border-radius .15s, box-shadow .15s, filter .15s, opacity .15s;}
.cx .rail-b:hover .mark {border-radius: 9px;}
.cx .rail-b.on .mark {box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--accent);}
.cx .rail-b.look-sleep .mark {filter: grayscale(1); opacity: .45;}
.cx .rail-b.look-sleep:hover .mark {opacity: .8;}
.cx .rail-b.look-wait .mark {box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--wait-fill);}
@keyframes ring {
50% {box-shadow: 0 0 0 2px var(--panel), 0 0 0 5px var(--wait-line);}
}
.cx .rail-b .badge {top: -6px; right: -7px; box-shadow: 0 0 0 2px var(--panel);}
.cx .pip {position: absolute; right: -2px; bottom: -2px; width: 11px; height: 11px; border-radius: 50%; box-shadow: 0 0 0 2px var(--panel); background: var(--sleep);}
.cx .look-work .pip {background: var(--work); animation: blink 1.6s ease-in-out infinite;}
.cx .look-pause .pip {background: var(--pause);}
.cx .look-danger .pip {background: var(--danger);}
@keyframes blink {
50% {opacity: .35;}
}
@media (prefers-reduced-motion: reduce) {
.cx .rail-b .mark, .cx .pip {animation: none !important;}
}
.cx .rail-tip {position: fixed; z-index: 60; transform: translateY(-50%); padding: 5px 9px; border-radius: 7px; background: var(--ink); color: var(--panel); font-size: 12px; font-weight: 500; white-space: nowrap; pointer-events: none;}
.cx .rail-add {width: 36px; height: 36px; border-radius: 11px; border: 1px dashed var(--line); background: none; color: var(--ink-3); display: grid; place-items: center; margin-top: 8px;}
.cx .rail-add:hover {color: var(--ink); border-color: var(--ink-3);}
.cx .count {min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--sunk); color: var(--ink-3); font-size: 12px; font-weight: 600; display: inline-grid; place-items: center;}
.cx .page {display: flex; flex-direction: column; min-height: 0; flex: 1;}
.cx .page-head {display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 18px 24px 14px;}
.cx .page-head h1 {margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -.01em;}
.cx .seg {display: inline-flex; padding: 3px; gap: 2px; border-radius: 9px; background: var(--sunk);}
.cx .seg button {display: inline-flex; gap: 6px; align-items: center; height: 28px; padding: 0 10px; border: 0; border-radius: 7px; background: none; color: var(--ink-2); font-size: 13px; font-weight: 500;}
.cx .seg button span {color: var(--ink-3); font-size: 12px;}
.cx .seg button.on {background: var(--panel); color: var(--ink); box-shadow: 0 1px 2px rgba(0,0,0,.08);}
.cx .sel {width: auto; height: 32px; padding: 0 8px;}
.cx .check {display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); font-size: 13px;}
.cx .inbox {display: flex; flex: 1; min-height: 0;}
.cx .queue {width: 360px; flex: none; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: var(--panel); min-height: 0;}
.cx .narrow .queue {width: 100%; border: 0; flex: 1;}
.cx .queue .page-head {padding: 16px 16px 10px;}
.cx .queue-list {flex: 1; padding: 0 8px 12px;}
.cx .q {display: flex; gap: 12px; padding: 12px 10px; border-radius: 10px; color: inherit; text-decoration: none; align-items: flex-start;}
.cx .q + .q {margin-top: 2px;}
.cx .q:hover {background: var(--sunk);}
.cx .q.on {background: var(--accent-tint);}
.cx .q-icon {width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; flex: none; background: var(--wait-tint); color: var(--wait);}
.cx .q-icon.t-approval {background: var(--accent-tint); color: var(--accent-ink);}
.cx .q-body {flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px;}
.cx .q-top {display: flex; gap: 8px; align-items: baseline;}
.cx .q-kind {font-size: 12px; color: var(--ink-3);}
.cx .q-reason {color: var(--ink-2); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.cx .q-site {font-size: 12px; color: var(--ink-3);}
.cx .q-wait {font: 500 12px var(--mono); color: var(--ink-3); white-space: nowrap; padding-top: 2px;}
.cx .q-wait.old {color: var(--wait);}
.cx .detail {flex: 1; min-width: 0; display: flex; flex-direction: column; min-height: 0; background: var(--bg);}
.cx .empty-detail {justify-content: center;}
.cx .hand-head {display: flex; align-items: center; gap: 12px; padding: 16px 20px 12px; background: var(--panel); border-bottom: 1px solid var(--line);}
.cx .hand-title {flex: 1; min-width: 0;}
.cx .hand-who {font-size: 13px; color: var(--ink-3);}
.cx .hand-who a {color: var(--ink); font-weight: 600; text-decoration: none;}
.cx .hand-title h2 {margin: 2px 0 0; font-size: 18px; font-weight: 600; line-height: 1.3;}
.cx .hand-wait {font: 500 13px var(--mono); color: var(--wait); background: var(--wait-tint); padding: 4px 8px; border-radius: 6px; white-space: nowrap;}
.cx .hand-details {margin: 0; padding: 12px 20px; background: var(--panel); border-bottom: 1px solid var(--line); white-space: pre-wrap; font: 13px/1.5 var(--mono); color: var(--ink-2); max-height: 22vh; overflow: auto;}
.cx .hand-body {flex: 1; display: flex; min-height: 0; gap: 0;}
.cx .hand-browser {flex: 1; min-width: 0; display: flex; flex-direction: column; margin: 12px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow); background: var(--panel);}
.cx .narrow .hand-browser {margin: 0; border-radius: 0; border: 0;}
.cx .hand-side {width: 280px; flex: none; padding: 12px 16px 12px 4px; overflow: auto;}
.cx .hand-side h3, .cx .b-side h3 {margin: 6px 0 8px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3);}
.cx .hand-side h3 + * {margin-bottom: 18px;}
.cx .steps {list-style: none; margin: 0; padding: 0; counter-reset: s;}
.cx .steps li {display: flex; gap: 8px; justify-content: space-between; padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: 13px; color: var(--ink-2);}
.cx .steps time {font: 11.5px var(--mono); color: var(--ink-3); white-space: nowrap;}
.cx .hand-actions {display: flex; align-items: center; gap: 10px; padding: 12px 20px; background: var(--panel); border-top: 1px solid var(--line);}
.cx .narrow .hand-actions {padding: 10px 12px calc(10px + env(safe-area-inset-bottom));}
.cx .narrow .hand-actions .btn.lg {flex: 1;}
.cx .narrow .hand-actions .spacer {display: none;}
.cx .hand-actions kbd {margin-left: 4px; background: transparent; color: inherit; border-color: currentColor; opacity: .6;}
.cx .grid {display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; padding: 4px 24px 24px; align-content: start; flex: 1;}
.cx .narrow .grid {padding: 4px 12px 16px; grid-template-columns: 1fr 1fr; gap: 10px;}
.cx .card {position: relative; display: flex; flex-direction: column; border-radius: 12px; background: var(--panel); border: 1px solid var(--line); color: inherit; text-decoration: none; overflow: hidden; transition: box-shadow .15s, transform .15s;}
.cx .card:hover {box-shadow: var(--shadow); transform: translateY(-1px);}
.cx .card.waiting {border-color: var(--wait-line); box-shadow: 0 0 0 3px var(--wait-tint);}
.cx .card .thumb {border-radius: 0; border-bottom: 1px solid var(--line);}
.cx .card-hand {position: absolute; left: 8px; right: 8px; top: 8px; display: flex; gap: 6px; align-items: center; padding: 6px 9px; border-radius: 8px; background: var(--wait); color: #fff; font-size: 13px; font-weight: 500; box-shadow: var(--shadow); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cx .card-body {padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 4px;}
.cx .card-top {display: flex; align-items: center; justify-content: space-between; gap: 8px;}
.cx .card-page {font-size: 13px; color: var(--ink-2); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cx .card-last {display: flex; gap: 5px; align-items: center; font-size: 12px; color: var(--ink-3); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cx .narrow .card-last {display: none;}
.cx .foot {padding: 0 24px 16px; font-size: 13px;}
.cx .bpage {display: flex; flex-direction: column; flex: 1; min-height: 0;}
.cx .b-body {flex: 1; display: flex; min-height: 0;}
.cx .b-browser {flex: 1; min-width: 0; display: flex; flex-direction: column;}
.cx .b-side {width: 300px; flex: none; border-left: 1px solid var(--line); background: var(--panel); padding: 14px 16px; overflow: auto;}
.cx .narrow .b-side {position: fixed; inset: 56px 0 0 auto; width: min(320px, 90vw); z-index: 20; box-shadow: var(--shadow-lg);}
.cx .b-side h3 {margin-top: 16px;}
.cx .b-side h3:first-child {margin-top: 0;}
.cx .feed {list-style: none; margin: 0; padding: 0;}
.cx .feed li {display: flex; align-items: baseline; gap: 8px; padding: 6px 0; font-size: 13px;}
.cx .feed-dot {width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; transform: translateY(-1px);}
.cx .feed-text {flex: 1; min-width: 0; color: var(--ink-2); overflow-wrap: anywhere;}
.cx .feed-site {margin-left: 6px; font-size: 12px; color: var(--ink-3);}
.cx .feed time {font: 11.5px var(--mono); color: var(--ink-3); white-space: nowrap;}
.cx .feed.big {padding: 0 24px 24px; flex: 1;}
.cx .feed.big li {padding: 9px 12px; border-radius: 8px; background: var(--panel); margin-bottom: 4px; border: 1px solid var(--line);}
.cx .feed-who {width: 120px; flex: none; font-weight: 600; color: var(--ink); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .feed-day {background: none !important; border: 0 !important; padding: 14px 0 6px !important; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3);}
.cx .tone-text-work .feed-dot {color: var(--work);}
.cx .tone-text-wait .feed-dot {color: var(--wait);}
.cx .tone-text-ok .feed-dot {color: var(--ok);}
.cx .tone-text-danger .feed-dot {color: var(--danger);}
.cx .tone-text-warn .feed-dot {color: var(--wait);}
.cx .tone-text-person .feed-dot {color: var(--pause);}
.cx .tone-text-idle .feed-dot {color: var(--sleep);}
.cx .tone-text-danger .feed-text {color: var(--danger);}
.cx .narrow {flex-direction: column;}
.cx .tabbar {display: flex; border-top: 1px solid var(--line); background: var(--panel); padding-bottom: env(safe-area-inset-bottom);}
.cx .tabbar-item {flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 0 6px; font-size: 11px; font-weight: 500; color: var(--ink-3); text-decoration: none;}
.cx .tabbar-item.on {color: var(--accent-ink);}
.cx .tabbar-icon {position: relative;}
.cx .badge {position: absolute; top: -4px; right: -10px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--wait); color: #fff; font-size: 11px; font-weight: 600; display: grid; place-items: center;}
.cx .modal-back {position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; background: rgba(10, 12, 16, .4); padding: 16px;}
.cx .modal {width: min(420px, 100%); padding: 20px; border-radius: 14px; background: var(--panel); box-shadow: var(--shadow-lg);}
.cx .modal h2 {margin: 0 0 6px; font-size: 18px;}
.cx .lbl {display: flex; flex-direction: column; gap: 6px; margin-top: 14px; font-weight: 500;}
.cx .modal-actions {display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px;}
.cx .err {color: var(--danger); margin: 8px 0 0;}
.cx .hand-task {display: block; margin-top: 4px; font-size: 13px; color: var(--ink-3);}
.cx .card-task {font-size: 13px; font-weight: 500; color: var(--ink); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: 2.9em;}
.cx .card-page {color: var(--ink-3) !important; font-size: 13px !important;}
.cx .steps li span {overflow-wrap: anywhere;}
.cx .narrow .hand-head {flex-wrap: wrap; padding: 10px 12px; gap: 8px 10px; align-items: flex-start;}
.cx .narrow .hand-head .q-icon {display: none;}
.cx .narrow .hand-title {flex: 1 1 calc(100% - 50px);}
.cx .narrow .hand-title h2 {font-size: 16px;}
.cx .narrow .hand-wait {order: 3; margin-left: 42px; font-size: 12px;}
.cx .narrow .hand-details {padding: 8px 12px; font-size: 12px; max-height: 18vh;}
.cx .narrow .hand-actions {flex-wrap: wrap;}
.cx .narrow .hand-actions > .btn:not(.lg) {flex: 1 1 100%;}
.cx .narrow .hand-actions kbd {display: none;}
.cx .card .thumb {flex: none;}
.cx .hand-side .facts {margin-bottom: 16px;}
.cx .grid {grid-auto-rows: max-content;}
.cx .slim-head {display: flex; align-items: center; gap: 4px; height: 44px; padding: 0 6px 0 2px; background: var(--panel); border-bottom: 1px solid var(--line); flex: none;}
.cx .slim-title {flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 6px; border: 0; border-radius: 8px; background: none; color: var(--ink-2); font: inherit; font-size: 14px; text-align: left;}
.cx .slim-title:active {background: var(--sunk);}
.cx .slim-title .q-icon {width: 24px; height: 24px; border-radius: 7px;}
.cx .slim-text {flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cx .slim-text b {color: var(--ink); font-weight: 600;}
.cx .slim-wait {font: 500 12px var(--mono); color: var(--wait); padding: 0 4px;}
.cx .slim-more {padding: 10px 14px 12px; background: var(--panel); border-bottom: 1px solid var(--line); max-height: 40vh; overflow: auto; flex: none;}
.cx .slim-more p {margin: 0 0 8px; color: var(--ink);}
.cx .slim-more pre {margin: 0 0 8px; white-space: pre-wrap; font: 12px/1.5 var(--mono); color: var(--ink-2);}
.cx .slim-more textarea {width: 100%;}
.cx .slim-actions {display: flex; gap: 8px; padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); background: var(--panel); border-top: 1px solid var(--line); flex: none;}
.cx .slim-actions .btn {flex: 1; height: 40px;}
.cx .slim-actions .btn.icon {flex: none; width: 44px; padding: 0; justify-content: center;}
.cx .btn.icon {padding: 0 10px;}
.cx .narrow .page-head {padding: 12px 14px 8px;}
.cx .narrow .page-head h1 {font-size: 18px;}
.cx .tabbar-item {padding: 6px 0 4px;}
.cx .keys {list-style: none; margin: 0 0 10px; padding: 0;}
.cx .keys li {display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px dashed var(--line); color: var(--ink-3);}
.cx .keys-site {flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 13px;}
.cx .keys-site b {color: var(--ink); font-weight: 600; overflow: hidden; text-overflow: ellipsis;}
.cx .keys-site span {font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .keys-add {display: flex; flex-direction: column; gap: 6px; margin-bottom: 6px;}
.cx .keys-add .field {height: 32px;}
.cx .row-end {display: flex; justify-content: flex-end; gap: 6px;}
.cx .hand-head, .cx .hand-actions, .cx .slim-head, .cx .slim-actions {flex: none;}
.cx .keys-add label {display: flex; flex-direction: column; gap: 4px;}
.cx .bar {display: flex; align-items: center; gap: 6px; height: 48px; padding: 0 8px 0 6px; flex: none; background: var(--panel); border-bottom: 1px solid var(--line);}
.cx .omni {position: relative; flex: none; width: clamp(280px, 30%, 420px); display: flex; align-items: center; gap: 2px; height: 34px; padding: 0 4px 0 4px; border-radius: 10px; background: var(--sunk); border: 1px solid transparent;}
.cx .omni.editing {background: var(--panel); border-color: var(--accent);}
.cx .omni input {flex: 1; min-width: 0; height: 100%; padding: 0 8px; border: 0; background: none; color: var(--ink); font-size: 14px; font-weight: 600; outline: none; text-overflow: ellipsis;}
.cx .omni.editing input {font-weight: 400;}
.cx .omni-mode {flex: none; height: 22px; padding: 0 7px; border-radius: 6px; border: 1px solid var(--line-2); background: var(--panel); color: var(--ink-2); font-size: 12px; font-weight: 600; white-space: nowrap;}
.cx .omni-mode:hover {border-color: var(--ink-3);}
.cx .omni-ask {flex: none; display: inline-grid; place-items: center; width: 26px; height: 24px; padding: 0; border-radius: 7px; background: var(--wait-tint); border: 1px solid var(--wait-line); color: var(--wait); font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap;}
.cx .omni-ask:hover {border-color: var(--wait);}
.cx .omni-btn {flex: none; display: grid; place-items: center; width: 26px; height: 26px; border: 0; border-radius: 7px; background: none; color: var(--ink-3);}
.cx .omni-btn:hover {background: var(--panel); color: var(--ink);}
.cx .tabs-wrap {flex: 1; min-width: 0; display: flex; align-items: center; height: 100%;}
.cx .tabs {display: flex; align-items: center; gap: 2px; min-width: 0; height: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; overscroll-behavior: contain;}
.cx .tabs::-webkit-scrollbar {display: none;}
.cx .tab {position: relative; flex: none; box-sizing: border-box; display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 6px 0 10px; border-radius: 10px; color: var(--ink-2); font-size: 13px; cursor: default; user-select: none;}
.cx .tab:hover {background: var(--sunk);}
.cx .tab.on {background: var(--sunk); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line);}
.cx .tab-mark {position: relative; flex: none; display: grid;}
.cx .sitemark {display: grid; place-items: center; width: 16px; height: 16px; border-radius: 4px; background: var(--sunk); color: var(--ink-3); font-size: 10px; font-weight: 700;}
.cx .sitemark.blank {background: var(--line);}
.cx .sitemark.img {display: block; object-fit: contain; background: none; border-radius: 3px;}
:root:not([data-theme="dark"]) .cx .sitemark.img.on-dark {background: #24292f; padding: 2px;}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) .cx .sitemark.img.on-dark {background: none; padding: 0;}
:root:not([data-theme="light"]) .cx .sitemark.img.on-light {background: #e6e8eb; padding: 2px;}
}
:root[data-theme="dark"] .cx .sitemark.img.on-light {background: #e6e8eb; padding: 2px;}
.cx .tab-flag {position: absolute; right: -4px; top: -4px; width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 2px var(--panel);}
.cx .tab:hover .tab-flag, .cx .tab.on .tab-flag {box-shadow: 0 0 0 2px var(--sunk);}
.cx .tab-flag.agent {background: var(--work);}
.cx .tab-flag.ask {background: var(--wait);}
.cx .tab-title {flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cx .tab-x {position: absolute; right: 6px; top: 7px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; border: 0; background: var(--sunk); color: var(--ink-3); opacity: 0; box-shadow: -8px 0 8px var(--sunk);}
.cx .tab:hover .tab-x, .cx .tab.on .tab-x {opacity: 1;}
.cx .tab-x:hover {background: var(--line); color: var(--ink);}
.cx .tab.on .tab-title {padding-right: 22px;}
.cx .tab.tight {justify-content: center; padding: 0; gap: 2px;}
.cx .tab.tight .tab-title, .cx .tab.tight .tab-x {display: none;}
.cx .tab-new {flex: none; display: grid; place-items: center; width: 30px; height: 30px; margin-left: 2px; border: 0; border-radius: 8px; background: none; color: var(--ink-2);}
.cx .tab-new:hover {background: var(--sunk);}
.cx .who {flex: none; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 10px; background: none;}
.cx .who:hover {background: var(--sunk);}
.cx .who.on {background: var(--accent-tint); box-shadow: inset 0 0 0 1px var(--accent);}
.cx .bar.slim {gap: 2px; padding: 0 4px;}
.cx .bar.slim .omni {flex: 1; width: auto;}
.cx .bar.slim .omni-mode {display: none;}
.cx .panel-seg {display: flex; width: 100%; margin-bottom: 14px;}
.cx .panel-seg button {flex: 1; justify-content: center;}
.cx .b-side h3:first-of-type {margin-top: 4px;}
.cx .sheet-back {position: fixed; inset: 0; z-index: 50; display: flex; align-items: flex-end; background: rgba(10, 12, 16, .4);}
.cx .tabsheet {width: 100%; max-height: 75dvh; display: flex; flex-direction: column; border-radius: 16px 16px 0 0; background: var(--panel); padding: 12px 8px calc(8px + env(safe-area-inset-bottom));}
@media (pointer: coarse) {
.cx .tabsheet {padding-bottom: calc(76px + env(safe-area-inset-bottom));}
}
.cx .tabsheet-head {display: flex; align-items: center; justify-content: space-between; padding: 0 8px 10px;}
.cx .tabsheet-list {overflow: auto;}
.cx .tabsheet-row {display: flex; align-items: center; border-radius: 10px;}
.cx .tabsheet-row.on {background: var(--accent-tint);}
.cx .tabsheet-item {flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 10px; border: 0; background: none; text-align: left; color: var(--ink);}
.cx .tabsheet-text {display: flex; flex-direction: column; min-width: 0;}
.cx .tabsheet-text span {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.cx .tabsheet-text small {color: var(--ink-3); font-size: 12px;}
.cx .narrow .b-side {inset: 48px 0 0 auto;}
.cx .feed-times {margin-left: 6px; font: 600 11px var(--mono); color: var(--ink-3);}
.cx .proxy-tag {flex: none; margin-left: 6px; padding: 1px 7px; border-radius: 8px; background: var(--danger-tint); color: var(--danger); font-size: 12px; font-weight: 500;}
.cx .free-tag {flex: none; margin-left: 6px; padding: 1px 7px; border-radius: 8px; border: 1px dashed var(--line); color: var(--ink-3); font-size: 12px; font-weight: 500;}
.cx .card-top strong {min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.cx a.btn {text-decoration: none; color: inherit;}
.cx .tab.asleep .tab-mark, .cx .tab.asleep .tab-title {opacity: .5;}
.cx .tab-flag.sleep {display: grid; place-items: center; background: var(--panel); color: var(--ink-3); width: 12px; height: 12px; right: -5px; top: -5px;}
.cx .card-tabs {margin-top: 2px;}
.cx .sleeplist {list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px;}
.cx .sleeplist li {display: flex; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid var(--line);}
.cx .sleeplist li.asleep > :not(button) {opacity: .55;}
.cx .sleeplist-text {flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 13px;}
.cx .sleeplist-text span, .cx .sleeplist-text small {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .sleeplist-text small {color: var(--ink-3); font-size: 12px;}
.cx .sleeplist .btn.on {background: var(--accent-tint); color: var(--accent-ink);}
.cx .omni {position: relative; overflow: hidden;}
.cx .omni.loading::after {content: ''; position: absolute; left: 0; bottom: 0; height: 2px; width: 30%; background: var(--accent); animation: omni-load 1.1s ease-in-out infinite;}
@keyframes omni-load {
from {transform: translateX(-100%);}
to {transform: translateX(340%);}
}
@media (prefers-reduced-motion: reduce) {
.cx .omni.loading::after {animation: none; width: 100%; opacity: .5;}
}
.cx .rail-me {width: 36px; height: 36px; border-radius: 11px; border: 0; background: none; color: var(--ink-3); display: grid; place-items: center; margin-top: 6px;}
.cx .rail-me:hover {color: var(--ink); background: var(--sunk);}
.cx .modal.account {max-height: calc(100vh - 32px); overflow: auto;}
.cx .modal.account h3 {margin: 18px 0 6px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3);}
.cx .modal.account p {margin: 0 0 8px;}
.cx .cmd {font: 12px/1.5 var(--mono); background: var(--sunk); padding: 8px 10px; border-radius: 8px; white-space: pre-wrap; word-break: break-all; margin: 6px 0 8px; user-select: all;}
.cx .fresh {margin: 8px 0 10px;}
.cx .token-add {display: flex; gap: 6px; margin-top: 8px;}
.cx .token-add .field {flex: 1; height: 32px;}
.cx .backup-status {display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: 13px; color: var(--ink-3);}
.cx .backup-status.bad, .cx .backup-bad {color: var(--danger);}
.cx .page-head h1 {font-size: 22px; font-weight: 600; letter-spacing: -.02em;}
.cx .muted {color: var(--ink-3);}
.cx .small {font-size: 13px;}
.cx .rail {width: 72px; background: var(--panel);}
.cx .rail-nav {width: 60px; border-radius: 10px;}
.cx .rail-nav.on {color: var(--ink); background: var(--sunk);}
.cx .rail-nav.on .rail-ico {color: var(--ink);}
.cx .rail-label {font-size: 11px; font-weight: 500;}
.cx .rail-find {width: 40px; height: 32px; border-radius: 9px; border: 1px solid var(--line); background: var(--panel); color: var(--ink-3); display: grid; place-items: center; margin: -4px 0 10px;}
.cx .rail-find:hover {color: var(--ink); border-color: var(--line-2);}
.cx .rail-me {height: auto; margin-top: 6px; border: 0; background: none; color: var(--ink-3);}
.cx .rail-me:hover {color: var(--ink); background: var(--sunk);}
.cx .rail-list {gap: 8px;}
.cx .rail-b.on .mark {box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--ink);}
.cx .rail-b.look-wait.on .mark {box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--wait-fill);}
.cx .badge {background: var(--wait); font-variant-numeric: tabular-nums;}
.cx .pip {width: 10px; height: 10px;}
.cx .count.wait {background: var(--wait); color: #fff;}
.cx .queue {width: 380px;}
.cx .queue .page-head {padding: 18px 18px 12px; gap: 8px;}
.cx .queue-list {padding: 0 10px 12px;}
.cx .q {gap: 12px; padding: 12px; border-radius: 12px;}
.cx .q + .q {margin-top: 2px;}
.cx .q:hover {background: var(--hover);}
.cx .q.on {background: var(--wait-tint); box-shadow: inset 0 0 0 1px var(--wait-line);}
.cx .q .mark {margin-top: 1px;}
.cx .q-top {display: flex; align-items: center; gap: 8px; min-width: 0;}
.cx .q-top strong {font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .q-kind {display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 500; color: var(--wait);}
.cx .q-wait {margin-left: auto; font: 500 12px var(--font); font-variant-numeric: tabular-nums; color: var(--ink-3); padding: 0;}
.cx .q-wait.old {color: var(--wait);}
.cx .q-reason {color: var(--ink); font-size: 14px; line-height: 1.4; margin-top: 2px;}
.cx .q-site {font-size: 13px; color: var(--ink-3); margin-top: 2px;}
.cx .queue-keys {padding: 10px 18px 14px; font-size: 12px; color: var(--ink-3); border-top: 1px solid var(--line);}
.cx .queue-keys kbd {margin-right: 2px;}
.cx .caught-up {padding: 64px 28px; gap: 10px;}
.cx .caught-up strong {font-size: 18px; font-weight: 600;}
.cx .caught-up span:last-child {max-width: 280px; line-height: 1.5;}
.cx .caught-up-mark {display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--ok-tint); color: var(--ok); margin-bottom: 4px;}
.cx .hand-head {gap: 16px; padding: 18px 24px 16px; align-items: flex-start;}
.cx .hand-who {display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-3);}
.cx .hand-who a {display: inline-flex; align-items: center; gap: 6px; color: var(--ink); font-weight: 600;}
.cx .hand-who a:hover {text-decoration: underline;}
.cx .hand-title h2 {margin: 6px 0 4px; font-size: 22px; font-weight: 600; letter-spacing: -.02em; line-height: 1.25;}
.cx .hand-task {font-size: 13px; color: var(--ink-3); margin-top: 0;}
.cx .hand-task b {color: var(--ink); font-weight: 600;}
.cx .hand-wait {display: inline-flex; align-items: center; gap: 6px; font: 500 13px var(--font); color: var(--wait); background: var(--wait-tint); box-shadow: inset 0 0 0 1px var(--wait-line); padding: 6px 10px; border-radius: 8px;}
.cx .hand-details {padding: 12px 24px; font: 13px/1.55 var(--mono);}
.cx .hand-browser {margin: 14px; border-radius: 12px;}
.cx .hand-side {width: 300px; padding: 14px 18px 14px 4px;}
.cx .hand-side h3, .cx .b-side h3 {font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink); margin: 18px 0 8px;}
.cx .hand-side h3:first-child {margin-top: 4px;}
.cx .steps li {border-bottom: 1px solid var(--line); padding: 7px 0;}
.cx .steps time {font: 12px var(--font); font-variant-numeric: tabular-nums; color: var(--ink-3);}
.cx .hand-actions {padding: 12px 24px; gap: 10px;}
.cx .hand-actions kbd {opacity: .7;}
.cx .facts {border: 1px solid var(--line-2); border-radius: 12px; padding: 12px 14px; box-shadow: var(--shadow);}
.cx .facts-head {font-size: 13px; color: var(--ink); gap: 6px;}
.cx .facts-head .muted {flex-basis: 100%; font-size: 12px;}
.cx .facts dl {gap: 5px 14px;}
.cx .facts dd {font-weight: 600;}
.cx .slim-who {display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-3); margin: 0 0 4px !important;}
.cx .slim-who b {color: var(--ink);}
.cx .slim-reason {font-size: 18px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3;}
.cx .slim-more .facts {margin: 8px 0 10px; box-shadow: none;}
.cx .slim-wait {font: 500 13px var(--font); font-variant-numeric: tabular-nums;}
.cx .bar-ask {flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 9px; background: var(--wait); color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap;}
.cx .bar-ask:hover {filter: brightness(1.08);}
.cx .tab.asking {background: var(--wait-tint); box-shadow: inset 0 0 0 1px var(--wait-line); color: var(--ink);}
.cx .tab.asking .tab-x {background: var(--wait-tint); box-shadow: -8px 0 8px var(--wait-tint);}
.cx .omni-mode {font-weight: 500;}
.cx .who.on {background: var(--sunk); box-shadow: inset 0 0 0 1px var(--line-2);}
.cx .grid {grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 18px; padding: 4px 24px 24px;}
.cx .card {border-radius: 14px; border-color: var(--line); transition: box-shadow .15s, border-color .15s;}
.cx .card:hover {transform: none; border-color: var(--line-2); box-shadow: var(--shadow);}
.cx .card.s-waiting {border-color: var(--wait-line); box-shadow: 0 0 0 1px var(--wait-line);}
.cx .card.s-asleep .card-body {opacity: .78;}
.cx .card-body {padding: 12px 14px 14px; gap: 6px;}
.cx .card-top {justify-content: flex-start; gap: 8px;}
.cx .card-top strong {font-size: 14px; font-weight: 600; flex: 1; min-width: 0;}
.cx .card-task {font-size: 14px; font-weight: 500; color: var(--ink); min-height: 0; -webkit-line-clamp: 1; display: block; white-space: nowrap; text-overflow: ellipsis;}
.cx .card-last {font-size: 13px; color: var(--ink-3); gap: 6px;}
.cx .card-last span {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;}
.cx .card-last time {margin-left: auto; flex: none; font-variant-numeric: tabular-nums;}
.cx .narrow .card-last {display: flex;}
.cx .card-tags {display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px;}
.cx .tag {padding: 2px 8px; border-radius: 6px; background: var(--sunk); color: var(--ink-2); font-size: 12px; font-weight: 500;}
.cx .tag.bad {background: var(--danger-tint); color: var(--danger);}
.cx .card-ask {display: flex; align-items: flex-start; gap: 8px; padding: 10px 14px; background: var(--wait-tint); border-top: 1px solid var(--wait-line); color: var(--wait); font-size: 13px; font-weight: 500; line-height: 1.4;}
.cx .card-ask svg {margin-top: 1px;}
.cx .card-ask span {flex: 1; min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--ink);}
.cx .foot {padding: 4px 24px 18px; font-size: 13px;}
.cx .chip {height: 22px; font-size: 12px;}
.cx .tone-sleep {box-shadow: none; background: var(--sunk); color: var(--ink-3);}
.cx .tasks {list-style: none; margin: 0; padding: 0 24px 32px; flex: 1;}
.cx .day {padding: 18px 0 8px; font-size: 13px; font-weight: 600; color: var(--ink);}
.cx .task {border-bottom: 1px solid var(--line);}
.cx .task-row {width: 100%; display: flex; align-items: flex-start; gap: 12px; padding: 12px 8px; border: 0; background: none; text-align: left; border-radius: 10px; color: var(--ink-3);}
.cx .task-row:hover {background: var(--hover);}
.cx .task-row > .mark {margin-top: 1px;}
.cx .task-row > svg {margin-top: 6px; color: var(--ink-4);}
.cx .task-main {flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px;}
.cx .task-top {display: flex; gap: 8px; align-items: baseline; min-width: 0;}
.cx .task-top b {color: var(--ink); font-weight: 600;}
.cx .task-site {color: var(--ink-3); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .task-title {color: var(--ink); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .task-hand, .cx .task-person {display: flex; align-items: center; gap: 6px; font-size: 13px; margin-top: 2px;}
.cx .task-hand svg, .cx .task-person svg {flex: none;}
.cx .task-hand.tone-wait {color: var(--wait); background: none;}
.cx .task-hand.tone-ok {color: var(--ok); background: none;}
.cx .task-hand.tone-danger {color: var(--danger); background: none;}
.cx .task-person {color: var(--ink-3);}
.cx .task-meta {flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 13px; padding-top: 1px;}
.cx .task-meta time {color: var(--ink-3); font-variant-numeric: tabular-nums;}
.cx .task-err {color: var(--danger); font-weight: 500;}
.cx .task-steps {margin: 0 8px 12px 48px;}
.cx .task-open {border: 0 !important; padding-top: 10px !important;}
.cx .narrow .tasks {padding: 0 12px 24px;}
.cx .narrow .task-meta span:not(.task-err) {display: none;}
.cx .narrow .task-steps {margin-left: 8px;}
.cx .find-back {align-items: start; padding-top: 12vh;}
.cx .finder {width: min(620px, 100%); display: flex; flex-direction: column; max-height: 70vh; border-radius: 14px; background: var(--panel); box-shadow: var(--shadow-lg); border: 1px solid var(--line); overflow: hidden;}
.cx .find-input {display: flex; align-items: center; gap: 10px; padding: 0 16px; height: 54px; border-bottom: 1px solid var(--line); color: var(--ink-3);}
.cx .find-input input {flex: 1; height: 100%; border: 0; background: none; outline: none; font-size: 16px; color: var(--ink);}
.cx .find-list {padding: 6px;}
.cx .find-group {padding: 10px 10px 4px; font-size: 12px; font-weight: 500; color: var(--ink-3);}
.cx .find-item {width: 100%; display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 0; border-radius: 9px; background: none; text-align: left; color: var(--ink);}
.cx .find-item.on {background: var(--sunk);}
.cx .find-lead {width: 24px; display: grid; place-items: center; flex: none; color: var(--ink-3);}
.cx .find-hand {display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: var(--wait-tint); color: var(--wait);}
.cx .find-text {min-width: 0; display: flex; flex-direction: column;}
.cx .find-text span, .cx .find-text small {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .find-text small {font-size: 13px; color: var(--ink-3);}
.cx .find-none {padding: 16px; color: var(--ink-3); margin: 0;}
.cx .find-keys {display: flex; gap: 16px; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-3);}
.cx kbd {font: 500 11px var(--font); min-width: 18px; text-align: center; display: inline-block;}
.cx .b-side {width: 312px; padding: 16px 18px;}
.cx .feed li {padding: 7px 0; border-bottom: 1px solid var(--line);}
.cx .feed time {font: 12px var(--font); font-variant-numeric: tabular-nums;}
.cx .feed-dot {width: 6px; height: 6px;}
.cx .tabbar-item.on {color: var(--ink);}
.cx .tabbar-item {font-size: 11px;}
.cx .slim-actions .btn {height: 44px; font-size: 16px;}
.cx .feed-site {white-space: nowrap;}
.cx .task-when {display: none; margin-left: auto; flex: none; font-size: 13px; color: var(--ink-3); font-weight: 400;}
.cx .task-hand, .cx .task-person {align-items: flex-start;}
.cx .task-hand svg, .cx .task-person svg {margin-top: 3px;}
.cx .narrow .task-meta {display: none;}
.cx .narrow .task-when {display: inline;}
.cx .narrow .task-row {gap: 10px; padding: 12px 4px;}
.cx .narrow .task-row > svg {display: none;}
.cx .narrow .task-title {white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.cx .narrow .card-last {display: none;}
.cx .narrow .card-body {padding: 10px 10px 12px; gap: 4px;}
.cx .narrow .card-top strong {font-size: 14px;}
.cx .narrow .card-task {font-size: 13px; font-weight: 400; color: var(--ink-2);}
.cx .narrow .card-ask {padding: 8px 10px; font-size: 13px;}
.cx .narrow .card-top .chip {padding: 0 6px;}
.cx .narrow .grid {gap: 10px;}
.cx .says {border-left: 3px solid var(--line-2); padding: 2px 0 2px 12px; margin: 4px 0 14px;}
.cx .says-head {display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 4px;}
.cx .says p {margin: 0; white-space: pre-wrap; font-size: 14px; line-height: 1.5; color: var(--ink-2);}
.cx .hand-side .facts {margin-bottom: 4px;}
.cx .slim-more .says {margin: 10px 0 4px;}
.cx .task-hand.open {cursor: pointer; font-weight: 500;}
.cx .task-hand.open:hover {text-decoration: underline;}
.cx .chip:empty, .cx .chip:has(.dot:only-child) {padding: 0 7px;}
.cx .hand-wait svg {flex: none;}
.cx .rail-list {mask-image: linear-gradient(to bottom, #000 calc(100% - 24px), transparent); -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 24px), transparent); padding-bottom: 20px;}
.cx .slim-more {max-height: 56vh;}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) .cx .mark {box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);}
}
.cx :focus-visible {outline: 2px solid var(--accent); outline-offset: 2px;}
.cx .q:focus-visible, .cx .card:focus-visible, .cx .task-row:focus-visible, .cx .find-item:focus-visible {outline-offset: -2px;}
.cx .task-more {border: 0 !important; padding: 4px 0 6px !important;}
.cx .task-more .btn {margin-left: -10px; color: var(--ink-3);}
.cx .tasks.in-browser {padding: 0;}
.cx .in-browser .task-row {padding: 10px 6px; gap: 8px;}
.cx .in-browser .task-top b {font-size: 14px;}
.cx .in-browser .task-title {font-size: 13px; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.cx .in-browser .task-when {display: inline;}
.cx .in-browser .task-steps {margin: 0 6px 10px;}
.cx .task-count {font-size: 13px; color: var(--ink-3);}
.cx .steps li span {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) .cx :is(.badge, .count.wait, .bar-ask) {color: #1d1203;}
}
.cx .task-hand.tone-past {color: var(--ink-3); background: none;}
.cx .bar-ask {border: 0; cursor: pointer; font-family: inherit;}
.cx .bar-ask.on {box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .5);}
.cx .panel-seg .seg-ask {color: var(--wait); font-weight: 600;}
.cx .panel-seg .seg-ask.on {background: var(--wait-tint); color: var(--wait); box-shadow: inset 0 0 0 1px var(--wait-line);}
.cx .askp {display: flex; flex-direction: column; gap: 10px;}
.cx .askp-who {display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--ink-2);}
.cx .askp-who .q-icon {width: 24px; height: 24px; border-radius: 7px;}
.cx .askp-wait {margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-weight: 500; color: var(--wait);}
.cx .askp-reason {margin: 0; font-size: 18px; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; color: var(--ink); text-wrap: pretty;}
.cx .askp-meta {margin: -4px 0 2px; font-size: 13px; color: var(--ink-3);}
.cx .askp-meta b {color: var(--ink); font-weight: 600;}
.cx .askp .says, .cx .askp .facts {margin: 0;}
.cx .askp textarea {width: 100%; resize: vertical;}
.cx .askp-actions {display: grid; grid-template-columns: 1fr 1fr; gap: 8px;}
.cx .askp-actions .btn {justify-content: center; height: 40px;}
.cx .askp-actions kbd {margin-left: 4px; background: transparent; color: inherit; border-color: currentColor; opacity: .6;}
.cx .askp-more {display: flex; flex-wrap: wrap; gap: 6px;}
.cx .askp-away {margin: 0; font-size: 14px; color: var(--ink-2);}
.cx .askp-others {margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--line);}
.cx .askp-others h3 {margin: 0 0 6px;}
.cx .askp-other {width: 100%; display: flex; align-items: center; gap: 8px; padding: 8px; border: 0; border-radius: 8px; background: none; color: var(--ink); font: inherit; font-size: 13px; text-align: left; cursor: pointer;}
.cx .askp-other:hover {background: var(--hover);}
.cx .askp-other span:nth-child(2) {flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .askp-other time {color: var(--wait); font-size: 12px;}
.cx .askp-other .q-icon {width: 20px; height: 20px; border-radius: 6px;}
.cx .asksheet {padding: 16px 16px calc(16px + env(safe-area-inset-bottom)); overflow: auto;}
.cx .asksheet .askp-actions .btn {height: 46px; font-size: 16px;}
.cx .ask-pill {flex: 1; width: auto; min-width: 0; gap: 8px; padding: 0 10px 0 4px; border: 1px solid var(--wait-line); background: var(--wait-tint); color: var(--ink); font: 600 14px var(--font); text-align: left; cursor: pointer;}
.cx .ask-pill .q-icon {width: 24px; height: 24px; border-radius: 7px;}
.cx .ask-pill-text {flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .tabcount.asking span {border-color: var(--wait-fill); background: var(--wait-tint); color: var(--wait);}
.cx .panel-seg button {white-space: nowrap; padding: 0 6px; font-size: 13px;}
.cx .grid > .foot {grid-column: 1 / -1; padding: 8px 0 0; margin: 0;}
.cx .sel {appearance: none; -webkit-appearance: none; height: 34px; padding: 0 30px 0 12px; border: 1px solid var(--line-2); border-radius: 9px; background: var(--panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%238b929c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5 6 7.5 9 4.5'/%3E%3C/svg%3E") no-repeat right 10px center; color: var(--ink); font: 500 13px var(--font); cursor: pointer;}
.cx .sel:hover {border-color: var(--ink-4);}
.cx .ask-pill > svg:last-child {flex: none; color: var(--wait);}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) .cx .btn.ok {color: #04140d;}
}
.cx .find-lead .q-icon {width: 26px; height: 26px; border-radius: 7px;}
.cx .modal-head {display: flex; align-items: center; justify-content: space-between; margin: -4px -6px 8px 0;}
.cx .modal-head h2 {margin: 0; font-size: 18px; font-weight: 600;}
.cx .keys-sheet h3 {margin: 14px 0 6px; font-size: 12px; font-weight: 600; color: var(--ink-3);}
.cx .keys-list {display: grid; grid-template-columns: max-content 1fr; gap: 8px 16px; margin: 0; align-items: center;}
.cx .keys-list dt {display: flex; align-items: center; gap: 4px;}
.cx .keys-list dd {margin: 0; font-size: 14px; color: var(--ink-2);}
.cx .keys-list kbd {min-width: 22px; text-align: center;}
.cx .keys-then {font-size: 12px; color: var(--ink-4);}
.cx .find-keys .spacer {flex: 1;}
.cx .keys-list {grid-template-columns: 96px 1fr;}
.cx .answered {padding: 16px 12px 12px;}
.cx .answered h3 {margin: 0 0 6px 8px; font-size: 12px; font-weight: 600; color: var(--ink-3);}
.cx .ans {display: flex; align-items: flex-start; gap: 10px; padding: 8px; border-radius: 9px; color: var(--ink-2); text-decoration: none;}
.cx .ans:hover {background: var(--hover);}
.cx .ans-icon {flex: none; width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; margin-top: 1px;}
.cx .ans-icon.ok {background: var(--ok-tint); color: var(--ok);}
.cx .ans-icon.no {background: var(--sunk); color: var(--ink-3);}
.cx .ans-body {flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px;}
.cx .ans-text {font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cx .ans small {font-size: 12px; color: var(--ink-4);}
.cx .ans time {flex: none; font-size: 12px; color: var(--ink-4); margin-top: 2px;}
.cx .caught-up + .answered {border-top: 1px solid var(--line); margin: 0 12px; padding: 16px 0 0;}
.cx .hand-side textarea {display: block;}
.cx .q-icon.t-approval {background: var(--wait-tint); color: var(--wait);}
.cx .facts-check {display: flex; align-items: center; gap: 6px; margin: 2px 0 8px; padding: 6px 8px; border-radius: 7px; font-size: 13px; font-weight: 600;}
.cx .facts-check.ok {background: var(--ok-tint); color: var(--ok);}
.cx .facts-check.bad {background: var(--danger-tint); color: var(--danger);}
.cx .asksheet::before {content: ''; display: block; width: 36px; height: 4px; margin: -6px auto 12px; border-radius: 2px; background: var(--line-2);}
@media (min-width: 600px) {
.cx .narrow .grid {grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; padding: 4px 16px 16px;}
.cx .narrow .card-last {display: flex;}
}
.cx .boot-error {display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: 320px; text-align: center; color: var(--ink-3); font-size: 14px;}
.cx .boot-error strong {color: var(--ink); font-size: 16px; font-weight: 600;}
.cx .offline {position: fixed; left: 50%; top: 10px; transform: translateX(-50%); z-index: 80; display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 10px; background: var(--ink); color: var(--panel); font-size: 13px; box-shadow: var(--shadow-lg);}
.cx .spinner.sm {width: 14px; height: 14px; border-width: 2px;}
.cx .task-hand {align-items: flex-start;}
.cx .task-hand svg {margin-top: 2px;}
.cx .tasks.in-browser .clamp, .cx .tasks.in-browser .task-title {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.cx .saved-for {display: flex; gap: 8px; align-items: flex-start; margin: 0 0 14px; padding: 9px 10px; border-radius: 9px; background: var(--sunk); color: var(--ink-2); font-size: 13px; line-height: 1.4;}
.cx .saved-for svg {flex: none; margin-top: 2px; color: var(--ink-3);}
.cx .saved-for.has {background: var(--ok-tint);}
.cx .saved-for.has svg {color: var(--ok);}
.cx .saved-for b {color: var(--ink); font-weight: 600;}
.cx .askp .saved-for {margin: 0;}
.cx .tabsheet-row.asking {background: var(--wait-tint); box-shadow: inset 0 0 0 1px var(--wait-line); margin-bottom: 6px;}
.cx .tabsheet-ask {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--wait); font-size: 13px; font-weight: 600; margin-bottom: 2px;}
.cx .hand-side h3, .cx .b-side h3, .cx .feed-day, .cx .modal.account h3 {text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--ink);}
.cx .modal.account h3 {margin: 20px 0 4px;}
.cx .facts-head .muted {flex-basis: 100%;}
.cx .waiting-page {min-height: 100vh; display: grid; place-items: center; padding: 24px 16px;}
.cx .waiting-card {width: min(480px, 100%); padding: 24px; border-radius: 14px; background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow);}
.cx .waiting-card h1 {font-size: 22px; margin: 10px 0 8px; line-height: 1.25;}
.cx .waiting-card p {color: var(--ink-2); margin: 0 0 10px;}
.cx .waiting-card h3 {font-size: 14px; margin: 18px 0 6px;}
.cx .waiting-tag {display: inline-block; font-size: 12px; font-weight: 600; color: var(--wait); background: var(--wait-tint); border-radius: 999px; padding: 2px 10px;}
.cx .waiting-place {font-size: 17px;}
.cx .waiting-place b {color: var(--ink);}
.cx .waiting-actions {display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 20px;}
.cx .servers .keys-site span {white-space: normal; overflow: visible;}
