.ws-dialog { --ws-muted:var(--text-2,var(--muted,#5f7183)); --ws-accent:var(--accent,var(--primary,#0a6f6c)); box-sizing:border-box; width:min(460px,calc(100vw - 24px)); max-height:calc(100dvh - 40px); padding:22px; border:1px solid var(--border); border-radius:var(--r-lg,22px); color:var(--text); background:var(--surface); font:14px/1.45 var(--font); overflow:auto; box-shadow:var(--shadow-2,0 16px 48px #0003); }
.ws-dialog::backdrop { background:rgba(11,17,25,.48); backdrop-filter:blur(3px); }
.ws-dialog [hidden] { display:none !important; }
.ws-heading { display:flex; align-items:center; gap:10px; }
.ws-heading h2 { flex:1; font:700 21px/1.25 var(--font-display,var(--font)); letter-spacing:-.025em; margin:0; }
.ws-close,.ws-back { flex:none; min-height:40px; border:0; border-radius:10px; padding:8px; background:transparent; color:var(--ws-muted); font:inherit; cursor:pointer; }
.ws-back { width:32px; padding:0; font-size:28px; }
.ws-user { color:var(--ws-muted); margin:12px 0 20px; font-size:13px; overflow-wrap:anywhere; }
.ws-driver { padding:10px 12px; border-radius:12px; background:var(--surface-2,var(--bg)); color:var(--ws-accent); }
.ws-list { display:grid; gap:8px; }
.ws-choice { position:relative; box-sizing:border-box; display:flex; flex-direction:column; gap:3px; width:100%; min-height:68px; padding:14px 36px 14px 14px; border:1px solid var(--border); border-radius:var(--r-md,14px); background:var(--surface); color:var(--text); text-align:left; font:inherit; cursor:pointer; }
.ws-dialog > .ws-choice + .ws-choice { margin-top:8px; }
.ws-choice::after { content:'›'; position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--ws-muted); font-size:22px; }
.ws-choice strong { font-size:14px; font-weight:600; }
.ws-choice span { font-size:12px; color:var(--ws-muted); }
.ws-choice:hover { background:var(--surface-2,var(--bg)); }
.ws-choice:focus-visible,.ws-close:focus-visible,.ws-back:focus-visible,.workspace-settings:focus-visible { outline:3px solid var(--ring,var(--primary,#0a6f6c)); outline-offset:2px; }
.ws-choice:disabled { opacity:.6; cursor:wait; }
.ws-current { border-color:var(--ws-accent); background:color-mix(in srgb,var(--ws-accent) 6%,var(--surface)); }
.ws-current::after { content:'✓'; color:var(--ws-accent); font-size:17px; }
.ws-exit { margin-top:20px !important; }
.ws-exit::after { content:none; }
.ws-exit strong,.ws-error { color:var(--bad,var(--danger,#d03b3b)); }
.ws-section { margin:20px 0 8px; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ws-muted); }
.ws-download { text-decoration:none; border-color:var(--ws-accent); }
.ws-search,.ws-input { box-sizing:border-box; width:100%; padding:12px; border:1px solid var(--border); border-radius:12px; font:inherit; color:var(--text); background:var(--surface); }
.ws-form { display:grid; gap:14px; }
.ws-field { display:grid; gap:5px; }
.ws-field > span { font-size:12px; font-weight:600; color:var(--ws-muted); }
.ws-field > small { font-size:11px; color:var(--ws-muted); }
.ws-save { min-height:48px; padding:12px; justify-items:center; border-color:var(--ws-accent); text-align:center; }
.ws-save::after { content:none; }
/* Полоса режима показа. Жёлтая и во всю ширину: её задача — попасться на глаза, а не
   вписаться в оформление страницы, у каждой из которых оно своё. */
.ws-viewas { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:8px 14px; background:#fffbeb; color:#b45309; border-bottom:1px solid #fcd34d; font:600 13px/1.35 var(--font,system-ui); }
.ws-viewas span { flex:1 1 220px; }
.ws-viewas-out { flex:none; min-height:32px; padding:6px 12px; border:1px solid #fcd34d; border-radius:9px; background:#fff; color:inherit; font:inherit; cursor:pointer; }
.ws-viewas-out:disabled { opacity:.6; cursor:wait; }
@media (prefers-color-scheme: dark) { .ws-viewas { background:#2a2010; color:#fbbf24; border-color:#7c5a12; } .ws-viewas-out { background:transparent; border-color:#7c5a12; } }

.workspace-settings { display:grid; place-items:center; flex:none; width:40px; height:40px; padding:0; border:1px solid var(--border); border-radius:13px; color:var(--text-2,var(--muted)); background:var(--surface); cursor:pointer; box-shadow:var(--shadow-1,0 1px 2px #1020340f); }
.workspace-settings svg { width:19px; height:19px; }
.workspace-settings:active { transform:scale(.94); }
@media(max-width:520px) { .ws-dialog { margin:auto auto 12px; padding:18px; } }