/* 工作台统一视觉层：共享外观与状态，布局/尺寸/断点仍由 site.css 管理。 */
.workspace-ui {
  background: radial-gradient(ellipse at 12% 0%, #ffc93d08, transparent 38%), radial-gradient(ellipse at 95% 65%, #ffffff03, transparent 46%), var(--l0);
  background-attachment: fixed;
}
.workspace-ui .topbar { background: linear-gradient(110deg, #ffe19a05, transparent 45%), #08090bf5; border-bottom-color: #ffffff12; }
.workspace-ui .ui-icon { display: inline-block; vertical-align: -3px; margin-right: 8px; color: var(--text-2); flex-shrink: 0; }
.workspace-ui h1 .ui-icon { width: 24px; height: 24px; vertical-align: -2px; color: var(--gold-soft); }
.workspace-ui h2 .ui-icon { width: 20px; height: 20px; }
.workspace-ui .card { background: linear-gradient(145deg, #ffffff06, transparent 55%), var(--l2); border-color: #ffffff12; }
.workspace-ui .ver { background: radial-gradient(ellipse at 100% 0, #ffe19a06, transparent 65%), linear-gradient(140deg, #ffffff04, transparent 40%), var(--l2); }
.workspace-ui .grid > a.card { position: relative; color: var(--text); text-decoration: none; }
.workspace-ui .grid > a.card h3 { padding-right: 12px; }
.workspace-ui .grid > a.card::after { content: ''; position: absolute; right: 22px; top: 28px; width: 6px; height: 6px; border-top: 1.5px solid var(--text-3); border-right: 1.5px solid var(--text-3); transform: rotate(45deg); }
.workspace-ui .search { background: linear-gradient(#ffffff03, #ffffff00), var(--l3); }
.workspace-ui .search:focus { border-color: var(--gold); box-shadow: none; outline: none; }
.workspace-ui .chip.on { background: #ffc93d0c; }
.workspace-ui .topbar nav a.on { background: #ffc93d0f; color: var(--gold-soft); }
.workspace-ui a, .workspace-ui button { -webkit-tap-highlight-color: #ffc93d26; touch-action: manipulation; }
.workspace-ui :is(a, button, summary, [role=button]):focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.workspace-ui :is(a.btn, button.chip, .grid > a.card):active { transform: scale(.985); }
.workspace-ui .topbar nav a:active { background: #ffffff15; }
.workspace-ui .grid > a.card:active { border-color: #ffe19a80; background-color: var(--l3); }
.workspace-ui span.btn { cursor: default; }
.workspace-ui span.btn:hover { border-color: var(--line-ctl); transform: none; }
.workspace-ui :is(.stat, .qa fieldset, .qa-panel) { background: linear-gradient(145deg, #ffffff05, transparent 55%), var(--l2); border-color: #ffffff12; }
.workspace-ui :is(.note, pre) { background: linear-gradient(120deg, #ffffff03, transparent), var(--l1); }
.workspace-ui .qa-panel { background-color: var(--l2); }
.workspace-ui .bubble { overflow-wrap: anywhere; }
.workspace-ui .case > summary { background: linear-gradient(110deg, #ffffff03, transparent 65%); }
.workspace-ui .case[open] > summary { background-color: #ffe19a07; box-shadow: inset 3px 0 var(--gold); }
.workspace-ui .case > summary:focus-visible { outline-offset: -3px; }
.workspace-ui :is(.req, .stat, fieldset):focus-within { border-color: #ffe19a44; }
.workspace-ui input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,
.workspace-ui textarea:focus, .workspace-ui select:focus { border-color: var(--gold); outline: none; box-shadow: none; }
.workspace-ui :is(input[type=checkbox], input[type=radio], input[type=range]) { accent-color: var(--gold); }
.workspace-ui :is(input[type=checkbox], input[type=radio], input[type=range]):focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.workspace-ui :is(button, a.btn, .copy, summary):not(:disabled):active { transform: scale(.985); }
.workspace-ui button:disabled { cursor: not-allowed; }
.workspace-ui :is(.card video, .shot) { outline: 1px solid var(--line); outline-offset: -1px; }
.workspace-ui .card video { border-radius: var(--radius-block); background: #000; }
.workspace-ui .replay-thumbnails button[aria-pressed=true] { outline: none; border-color: var(--gold); background: #ffc93d12; }
.workspace-ui .replay-thumbnails button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.workspace-ui .replay-thumbnails { scrollbar-color: #ffffff30 transparent; scrollbar-width: thin; }
.workspace-ui .replay-thumbnails::-webkit-scrollbar { height: 6px; }
.workspace-ui .replay-thumbnails::-webkit-scrollbar-thumb { border-radius: 999px; background: #ffffff30; }
.workspace-ui [data-copy].copied { border-color: var(--gold); background-color: #ffc93d12; }
.workspace-ui .ui-feedback { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); max-width: calc(100vw - 32px); padding: 10px 16px; border: 1px solid #ffffff1a; border-radius: 12px; color: var(--text); background: var(--l4); z-index: 100; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  .workspace-ui :is(a, button, summary, .copy, .card, .ui-icon) { transition: transform 180ms ease-out, border-color 180ms ease-out, color 180ms ease-out; }
}
@media (hover: hover) {
  .workspace-ui .grid > a.card:hover { transform: translateY(-2px); border-color: #ffe19a44; background-color: #171b24; }
  .workspace-ui .grid > a.card:hover .ui-icon { color: var(--gold-soft); transform: translateY(-1px); }
  .workspace-ui .grid > a.card:hover::after { border-color: var(--gold-soft); }
  .workspace-ui .grid > a.card:active { transform: translateY(0) scale(.985); }
  .workspace-ui .ver:hover { border-color: #ffffff28; }
  .workspace-ui :is(.req, .stat):hover { border-color: #ffffff28; }
  .workspace-ui :is(.case > summary, .copy):hover { background-color: #ffffff06; }
  .workspace-ui button:not(:disabled):hover { border-color: #ffe19a66; }
  .workspace-ui .shot:hover { border-color: #ffe19a66; }
  .workspace-ui tbody tr:hover { background-color: #ffffff03; }
  .workspace-ui .i18n-table tbody tr:hover td:first-child { background: var(--l3); }
  .workspace-ui a.btn:hover { background: #222733; border-color: #ffe19a66; }
  .workspace-ui button.chip:hover { border-color: #ffffff44; background: #ffffff06; color: var(--text); }
  .workspace-ui .topbar nav a:hover { background: #ffffff0b; color: var(--text); }
  .workspace-ui .topbar nav a:active { background: #ffffff15; }
}
@media (max-width: 720px) { .workspace-ui { background-attachment: scroll; } }
@media (prefers-reduced-motion: reduce) {
  .workspace-ui :is(a, button, summary, .copy, .card, .ui-icon) { transition: none; transform: none !important; }
  .workspace-ui .replay-thumbnails { scroll-behavior: auto; }
}
