/* Shared brand colors for the two appearance modes. */
:root {
  color-scheme: dark;
  font-family: Inter,"PingFang SC","Microsoft YaHei",sans-serif;
  --bg: #0a1222;
  --sidebar: #0d182b;
  --panel: #101e34;
  --panel2: #192b46;
  --preview: #0b1628;
  --text: #f1f6ff;
  --muted: #acbed8;
  --faint: #8399b8;
  --line: #2c405e;
  --accent: #8dc9ff;
  --accent-soft: #1a3454;
  --danger: #ffacb3;
  --green: #91dfc1;
  --shadow: 0 16px 64px #0005;
  background: var(--bg);
  color: var(--text);
  --accent-border: #507cac;
  --accent-overlay: #8dc9ff26;
  --action-text: #071c3d;
  --action-caption: #183b63;
  --action-start: #e3f3ff;
  --action-end: #81baff;
  --action-hover: #f1f8ff;
  --action-chip: #1852a322;
  --brand-start: #f3fbff;
  --brand-end: #86c7ff;
  --brand-border: #b8ddff;
  --brand-shadow: #89bcfa55;
  --field-bg: #172b47;
  --entry-glow: #3376e333;
  --workspace-glow: #3268b51f;
  --nav-glow: #448fff24;
  --success-border: #3a7d72;
  --danger-border: #925060;
}
.light {
  color-scheme: light;
  --bg: #f2f7ff;
  --sidebar: #eaf3ff;
  --panel: #fcfdff;
  --panel2: #e6f0ff;
  --preview: #edf4ff;
  --text: #122542;
  --muted: #48617f;
  --faint: #566e8d;
  --line: #c8d9ef;
  --accent: #1656ad;
  --accent-soft: #dceaff;
  --danger: #a32742;
  --green: #19664e;
  --shadow: 0 16px 64px #20477524;
  --accent-border: #78a4d8;
  --accent-overlay: #4386d126;
  --field-bg: #edf4ff;
  --entry-glow: #669df322;
  --workspace-glow: #b2d4ff66;
  --nav-glow: #387de01c;
  --success-border: #86bda7;
  --danger-border: #df9aa8;
}
.workspace {
  background: radial-gradient(ellipse at 100% 0%, var(--workspace-glow), transparent 58%), var(--bg);
}

*{box-sizing:border-box}body{margin:0;font-size:14px;line-height:1.55;background:var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button,a{touch-action:manipulation}button{color:var(--text);background:transparent;border:1px solid var(--line);border-radius:10px;padding:10px 16px;transition:background .15s,border-color .15s}button:hover:not(:disabled),.button-link:hover{border-color:var(--accent);background:var(--accent-soft)}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.shell{display:flex;min-height:100vh}.sidebar{width:220px;flex:none;position:fixed;inset:0 auto 0 0;overflow:auto;background:var(--sidebar);border-right:1px solid var(--line);padding:27px 14px;display:flex;flex-direction:column;z-index:20}.sidebar .logo{font-size:22px;font-weight:750;letter-spacing:-1px;display:flex;align-items:center;gap:12px;padding:0 13px 25px;color:var(--text)}.logo-mark{width:31px;height:31px;border:1px solid var(--accent);border-radius:10px;display:grid;place-items:center;color:var(--accent);font-size:21px}.nav-section{margin:12px 12px 7px;color:var(--faint);font-size:11px;letter-spacing:.1em}.nav-link{display:flex;align-items:center;gap:12px;padding:10px 13px;border-radius:9px;color:var(--muted);margin:3px 0;font-size:13px}.nav-link svg{width:18px;height:18px;flex:none}.nav-link:hover{color:var(--text);background:var(--panel);text-decoration:none}.nav-link.active{color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-border);padding:9px 12px}.nav-footer{margin-top:auto;padding:22px 10px 0;border-top:1px solid var(--line);color:var(--faint);font-size:11px}.workspace{margin-left:220px;min-width:0;width:calc(100% - 220px);display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:15px;padding:20px 25px;min-height:83px}.page-identity{display:grid;gap:1px}.page-identity strong{font-size:17px}.page-identity span{font-size:11px;color:var(--muted)}.header-actions{margin-left:auto;display:flex;align-items:center;gap:10px}.header-actions .subtle{font-size:12px;background:var(--panel);color:var(--accent);padding:8px 13px}.account-btn{font-size:12px}.icon-btn{border:0;background:transparent;padding:6px 9px;font-size:20px;line-height:1.2}.icon-btn svg{width:19px;height:19px}.sidebar-hidden .sidebar{display:none}.sidebar-hidden .workspace{margin-left:0;width:100%}main{width:min(1200px,100%);margin:20px auto 0;padding:0 30px 50px;flex:1}.page-intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:29px}.eyebrow{font-size:12px;letter-spacing:.08em;color:var(--accent);margin:0 0 10px}.page-intro h1{font-size:29px;letter-spacing:-.8px;margin:0 0 8px;font-weight:700}.lead{color:var(--muted);font-size:13px;margin:0}.intro-icon{color:var(--muted);width:31px;height:31px;margin-right:4px}.card{background:var(--panel);border:1px solid var(--line);border-radius:19px;padding:24px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.tab{font-size:14px;padding:11px 22px}.tab.active,.segmented button.active{border-color:var(--accent-border);background:var(--accent-soft);color:var(--accent)}.tool-grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:31px}.preview-stage{position:relative;width:100%;aspect-ratio:1.6;background:var(--preview);border-radius:14px;overflow:hidden;display:grid;place-items:center;min-height:280px;border:1px dashed transparent}.preview-stage.dragging{border-color:var(--accent);background:var(--accent-soft)}.preview-stage video{width:100%;height:100%;object-fit:contain;max-height:430px;display:block}.empty-video{display:grid;justify-items:center;gap:13px;color:var(--muted);text-align:center;padding:30px}.empty-video svg{height:40px;width:40px;margin-bottom:4px}.empty-video strong{color:var(--text);font-size:15px}.empty-video span{font-size:12px}.video-meta{display:flex;flex-wrap:wrap;gap:5px 15px;font-size:12px;color:var(--muted);padding:14px 0 15px}.upload-actions{display:flex;gap:10px;flex-wrap:wrap}.upload-actions button{padding:12px 17px;font-size:13px}.upload-actions svg{height:16px;width:16px;vertical-align:-3px;margin-right:5px}.options h2{font-size:21px;margin:0 0 4px}.options>p{margin:0 0 23px;color:var(--muted);font-size:12px}.field-label{display:block;margin-bottom:10px;font-size:12px;color:var(--text)}.quality-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.quality-grid button{padding:15px 4px;font-size:15px}.quality-grid button.selected{border-color:var(--accent-border);background:var(--accent-soft);color:var(--accent)}.advanced{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:18px;padding:13px 0}.advanced summary{cursor:pointer;font-size:13px}.advanced-content{margin-top:15px}.segmented{display:flex;gap:8px;flex-wrap:wrap}.segmented button{font-size:12px;padding:8px 12px}.info-box{background:var(--panel2);border-radius:9px;padding:13px 14px;font-size:12px;color:var(--muted);line-height:1.8;margin:18px 0}.muted{color:var(--muted)}.small{font-size:12px}.faint{color:var(--faint)}.primary{background:linear-gradient(110deg,var(--action-start),var(--action-end));color:var(--action-text);border-color:var(--accent);font-weight:700}.primary:hover:not(:disabled){color:var(--action-text);background:var(--action-hover)}.wide{width:100%}.danger{color:var(--danger)}.ghost{border:0;color:var(--muted)}.quote-info{font-size:12px;color:var(--muted);margin:17px 0}.quote-price{color:var(--accent);font-size:20px;font-weight:700}.inline-error{color:var(--danger);font-size:12px;padding:9px 0;white-space:pre-wrap}.inline-success{color:var(--green);font-size:12px;padding:9px 0}.status-box{color:var(--muted);font-size:12px;padding-top:10px}.upload-progress{margin:12px 0}.upload-progress progress{accent-color:var(--accent);width:100%;height:8px}.progress-meta{display:flex;justify-content:space-between;align-items:center;font-size:11px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:31px 0 15px}.section-head h2{font-size:18px;margin:0}.section-head h3{font-size:16px;margin:0}.section-head button{font-size:12px}.empty-state{padding:35px 20px;text-align:center;color:var(--muted);font-size:13px;border:1px dashed var(--line);border-radius:12px}.empty-state strong{display:block;color:var(--text);font-size:16px;margin-bottom:8px}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 20px;align-items:center}.toolbar .search{flex:1;min-width:180px;max-width:380px}input,select,textarea{background:var(--preview);border:1px solid var(--line);border-radius:9px;color:var(--text);padding:11px 12px;min-width:0}input::placeholder,textarea::placeholder{color:var(--faint)}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical;min-height:100px}.field{display:grid;gap:7px;font-size:12px}.field+.field{margin-top:17px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.form-grid .field+.field{margin-top:0}.form-actions{display:flex;gap:9px;justify-content:flex-end;align-items:center;margin-top:22px;flex-wrap:wrap}.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px}.asset-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;overflow:hidden}.asset-thumb{height:132px;background:var(--preview);display:grid;place-items:center;position:relative;cursor:pointer;color:var(--muted)}.asset-thumb svg{width:34px;height:34px}.asset-thumb img,.asset-thumb video{max-width:100%;width:100%;height:100%;object-fit:contain}.asset-details{padding:12px}.asset-name{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);margin:0 0 5px}.asset-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.asset-actions button,.asset-actions a{font-size:11px;padding:5px 8px;border-radius:6px}.button-link{display:inline-block;border:1px solid var(--line);color:var(--text);padding:9px 14px;border-radius:9px;font-size:12px}.button-link:hover{text-decoration:none}.list{display:grid;gap:11px}.job-card{border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--panel)}.job-main{display:flex;align-items:center;justify-content:space-between;gap:15px}.job-main h3{font-size:14px;margin:0 0 5px}.job-info{font-size:12px;color:var(--muted)}.job-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.job-actions button,.job-actions a{padding:6px 11px;font-size:11px}.badge{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:6px;padding:3px 8px;font-size:11px;white-space:nowrap;color:var(--muted)}.badge.waiting{color:var(--accent);border-color:var(--accent-border)}.badge.success{color:var(--green);border-color:var(--success-border)}.badge.failed{color:var(--danger);border-color:var(--danger-border)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.metric{padding:21px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.metric .label{font-size:12px;color:var(--muted)}.metric .value{font-size:29px;margin-top:8px;font-weight:650}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:19px}.card h2{font-size:17px;margin:0 0 14px}.feature-link{display:block;padding:17px 0;border-bottom:1px solid var(--line);color:var(--text)}.feature-link:last-child{border-bottom:0}.feature-link strong{display:block;font-size:14px}.feature-link span{font-size:12px;color:var(--muted)}.feature-link:hover{text-decoration:none;color:var(--accent)}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:11px}table{border-collapse:collapse;width:100%;font-size:12px;white-space:nowrap}th,td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line)}th{color:var(--muted);font-weight:500;background:var(--panel)}tbody tr:last-child td{border-bottom:0}td button{padding:5px 8px;font-size:11px;margin-right:5px}.balance{font-size:44px;font-weight:650;letter-spacing:-2px;margin:10px 0}.balance small{font-size:15px;font-weight:400;color:var(--muted);letter-spacing:0}.code{font-family:ui-monospace,Consolas,monospace;color:var(--accent);background:var(--preview);border:1px solid var(--line);padding:14px;border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}.chat-layout{display:grid;grid-template-columns:210px 1fr;border:1px solid var(--line);border-radius:15px;min-height:540px;overflow:hidden}.chat-side{background:var(--panel);padding:14px;border-right:1px solid var(--line)}.conversation{display:block;width:100%;text-align:left;border:0;border-radius:8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-top:6px;font-size:12px}.conversation.active{background:var(--accent-soft);color:var(--accent)}.chat-main{min-width:0;display:flex;flex-direction:column;padding:20px}.chat-messages{flex:1;min-height:290px;max-height:480px;overflow:auto}.chat-bubble{max-width:90%;padding:12px 15px;border-radius:11px;background:var(--panel);white-space:pre-wrap;margin:10px 0;font-size:13px}.chat-bubble.user{margin-left:auto;background:var(--accent-soft)}.chat-compose{display:flex;align-items:flex-end;gap:10px;padding-top:16px}.chat-compose textarea{min-height:70px;width:100%}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:15px}.project-card{padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.project-card h3{margin:0 0 6px;font-size:15px}.canvas-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:13px}.canvas-surface{height:520px;position:relative;overflow:auto;background-color:var(--preview);background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:20px 20px;border:1px solid var(--line);border-radius:13px}.canvas-world{position:relative;width:1600px;height:1000px}.canvas-lines{position:absolute;inset:0;pointer-events:none;width:1600px;height:1000px}.canvas-node{position:absolute;width:220px;border:1px solid var(--accent-border);border-radius:11px;background:var(--panel);padding:12px;box-shadow:0 8px 20px #0003}.node-head{display:flex;align-items:center;gap:6px;cursor:move;margin-bottom:10px;touch-action:none}.node-head input{width:155px;padding:4px 5px;border-color:transparent;background:transparent}.node-head button{padding:0 5px;border:0}.canvas-node textarea{width:100%;min-height:78px;font-size:12px}.canvas-node select{width:100%;font-size:11px;padding:6px;margin-bottom:7px}.node-footer{display:flex;justify-content:space-between;align-items:center;margin-top:7px;font-size:10px;color:var(--muted)}.node-port{padding:3px 6px;border-radius:4px;font-size:10px}.node-port.active{color:var(--accent);border-color:var(--accent)}.subtitle-overlay{position:absolute;inset:0;cursor:crosshair;touch-action:none;pointer-events:auto}.region-box{position:absolute;border:2px solid var(--accent);background:var(--accent-overlay);pointer-events:none}.region-label{position:absolute;left:3px;top:3px;color:#fff;font-size:10px;background:#08172bd9;padding:1px 4px}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.compare-grid video{width:100%;max-height:400px;background:var(--preview);border-radius:9px}.compare-grid h3{font-size:13px}.compare-controls{display:flex;gap:9px;justify-content:center;margin-top:17px}dialog{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:16px;box-shadow:var(--shadow);padding:25px;width:min(560px,calc(100vw - 30px));max-height:88vh;overflow:auto}dialog.wide-dialog{width:min(950px,calc(100vw - 30px))}dialog::backdrop{background:#050c1ad0;backdrop-filter:blur(5px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.dialog-header h2{margin:0;font-size:19px}#dialogBody video,#dialogBody audio,#dialogBody img{max-width:100%}#dialogBody>video{display:block;width:100%;background:#000;border-radius:9px}.modal-switch{display:flex;gap:9px;margin-bottom:19px}.modal-switch button{flex:1}.modal-switch .active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}#toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,15px);padding:11px 18px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.2s;z-index:100;max-width:min(540px,90vw);font-size:13px}#toast.show{opacity:1;transform:translate(-50%,0)}.hidden{display:none!important}.skip{position:fixed;top:-60px;left:15px;background:var(--action-start);color:var(--action-text);z-index:100;padding:10px}.skip:focus{top:10px}footer{padding:12px 30px 24px;font-size:11px;color:var(--faint);text-align:center}footer span{display:block}.loading{padding:50px;text-align:center;color:var(--muted)}.spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;vertical-align:-3px;margin-right:7px}@keyframes spin{to{transform:rotate(360deg)}}.notice{padding:16px 18px;margin:0 0 20px;border:1px solid var(--accent-border);border-radius:12px;background:var(--accent-soft);color:var(--accent);font-size:12px}.checkbox-field{display:flex;gap:8px;align-items:center;font-size:12px}.checkbox-field input{accent-color:var(--accent)}.auth-gate{text-align:center;padding:70px 20px}.auth-gate h2{font-size:23px}.auth-gate p{color:var(--muted);margin-bottom:25px}@media(min-width:1450px){main{margin-top:30px}.preview-stage{aspect-ratio:1.6}}@media(max-width:1100px){.sidebar{width:190px}.workspace{margin-left:190px;width:calc(100% - 190px)}main{padding:0 24px 40px}.tool-grid{gap:22px}.quality-grid{gap:5px}.preview-stage{min-height:260px}.topbar{padding:18px 22px}.header-actions .subtle{display:none}}@media(max-width:850px){.sidebar{width:220px;box-shadow:var(--shadow)}.workspace{margin-left:0;width:100%}.shell:not(.mobile-menu) .sidebar{display:none}.sidebar-hidden .sidebar{display:none}.tool-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.preview-stage{aspect-ratio:1.8}.header-actions{gap:4px}.page-intro h1{font-size:25px}.chat-layout{grid-template-columns:150px 1fr}.grid-2{grid-template-columns:1fr}.tool-card{padding:20px}}@media(max-width:540px){main{padding:0 16px 35px;margin-top:18px}.topbar{padding:15px 12px;gap:8px}.page-identity strong{font-size:15px}.page-identity span{font-size:10px}.header-actions .account-btn{font-size:11px;padding:7px 10px}.header-actions #themeBtn{font-size:19px}.card{padding:17px;border-radius:14px}.tool-grid{gap:25px}.quality-grid button{padding:13px 0}.preview-stage{min-height:230px;aspect-ratio:auto;height:260px}.preview-stage video{height:260px}.empty-video span{font-size:11px}.upload-actions button{padding:10px 13px}.form-grid{grid-template-columns:1fr}.toolbar{gap:7px}.toolbar>*{max-width:100%}.asset-grid{grid-template-columns:1fr 1fr;gap:10px}.asset-thumb{height:100px}.asset-details{padding:10px}.metrics{gap:9px}.metric{padding:16px}.metric .value{font-size:25px}.job-main{align-items:flex-start}.compare-grid{grid-template-columns:1fr}.chat-layout{display:block}.chat-side{border-right:0;border-bottom:1px solid var(--line);max-height:130px;overflow:auto}.chat-main{padding:13px}.chat-messages{max-height:350px}.lead{font-size:12px}.intro-icon{display:none}.tabs{gap:7px}.tab{padding:10px 17px}.canvas-surface{height:430px}dialog{padding:19px}}

.shell .sidebar { display: none; }
.shell.nav-open .sidebar { display: flex; top: 76px; box-shadow: var(--shadow); }
.shell .workspace { width: 100%; margin-left: 0; }
.sidebar a { padding: 9px 13px; border-radius: 8px; color: var(--muted); }
.sidebar a[aria-current="page"] { background: var(--accent-soft); color: var(--accent); }
.vt-heading { margin-bottom: 30px; }
.vt-heading h1 { margin: 0 0 8px; font-size: clamp(22px, 4vw, 29px); }
.vt-heading p, #metadata { color: var(--muted); }
.tool-card { background: var(--panel); border: 1px solid var(--line); border-radius: 20px; padding: clamp(14px, 3vw, 24px); }
.tabs button[aria-pressed="true"], .quality button[aria-pressed="true"] { color: var(--accent); background: var(--accent-soft); border-color: var(--accent); }
.preview-area { position: relative; width: 100%; aspect-ratio: 1.6; background: var(--preview); border-radius: 14px; overflow: hidden; }
.preview-area video { display: block; width: 100%; height: 100%; object-fit: contain; }
.preview-play, .preview-download {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: #0a1222e8;
  border: 1px solid #ffffff4d;
}
.preview-play { top: 50%; left: 50%; translate: -50% -50%; width: 48px; height: 48px; padding: 0; }
.preview-play svg { width: 24px; height: 24px; }
.preview-play:hover:not(:disabled), .preview-download:hover { color: #fff; background: #20334e; }
.preview-download { top: 8px; right: 8px; gap: 5px; padding: 5px 8px; border-radius: 7px; font-size: 12px; }
.preview-download svg { width: 15px; height: 15px; }
.preview-download:focus-visible { outline: 2px solid var(--accent); }
.source-info { margin: 16px 0 14px; }
.source-name { display: block; font-size: 16px; overflow-wrap: anywhere; }
.source-info #metadata { margin: 4px 0 0; font-size: 13px; }
.upscale-options { min-width: 0; }
.upscale-options h2 { margin: 0 0 6px; }
.upscale-options h2 + p { margin: 0 0 18px; color: var(--muted); }
.upscale-options legend { margin-bottom: 10px; }
.upscale-hint { margin: 0 0 20px; padding: 13px 14px; border-radius: 10px; color: var(--muted); background: var(--panel2); font-size: 12px; }
.quote-summary { margin-bottom: 16px; }
.quote-amount { color: var(--accent); font-size: clamp(16px, 2vw, 23px); }
.quote-detail { margin: 7px 0 0; color: var(--muted); font-size: 12px; }
.quote-detail:empty { display: none; }
.empty-preview { display: flex; height: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; color: var(--muted); }
.empty-preview svg { width: 38px; height: 38px; margin-bottom: 6px; stroke-width: 2.2; }
.empty-preview p { margin: 0; padding: 0 10px; }
fieldset { border: 0; padding: 0; margin: 0 0 15px; }
.quality { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.quality button { min-height: 50px; padding-inline: 4px; }
details { padding: 13px 0; margin-bottom: 14px; border-block: 1px solid var(--line); }
summary { cursor: pointer; }
details label { display: grid; gap: 8px; margin-top: 10px; }
.stack { display: grid; gap: 10px; }
.stack label { display: grid; gap: 5px; }
.stack label:has(input[type=checkbox]) { display: flex; }
.stack p:empty { display: none; }
[role=alert] { color: var(--danger); }
.row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.asset-upload-feedback { margin-top: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); font-size: 13px; }
.asset-upload-feedback p { margin: 0 0 6px; }
.asset-upload-feedback progress { display: block; width: min(100%, 360px); height: 8px; accent-color: var(--accent); }
.asset-upload-feedback ul { margin: 10px 0 0; padding-inline-start: 20px; color: var(--danger); overflow-wrap: anywhere; }
.spread { justify-content: space-between; }
.recent { margin-top: 30px; }
.record { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 9px; padding: 12px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.record p { margin: 4px 0; color: var(--muted); white-space: pre-wrap; }

[hidden] { display: none !important; }
.entry {
  min-height: 100svh;
  background: radial-gradient(ellipse at 12% 6%, #193a6c 0%, transparent 61%),
              radial-gradient(ellipse at 100% 100%, #103c57 0%, transparent 32%), var(--bg);
}
.entry-theme { position: absolute; top: 16px; right: 22px; background: var(--panel); }
.entry-layout {
  width: min(80%, 1530px);
  min-height: 100svh;
  margin: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 450px);
  align-items: center;
  gap: clamp(28px, 8vw, 144px);
  padding: 84px 0 76px;
}
.entry-brand { display: flex; align-items: center; gap: 5px; font-weight: 850; font-size: 21px; }
.entry-brand span, .entry-mark { display: grid; place-items: center; border-radius: 13px; }
.entry-brand span { width: 36px; height: 36px; background: var(--accent); color: var(--action-text); margin-right: 6px; }
.entry-brand b, .entry-intro em { color: var(--accent); }
.entry-badge {
  display: inline-block; margin-top: clamp(38px, 7vw, 86px); padding: 7px 12px;
  border: 1px solid var(--accent-border); border-radius: 50px; color: var(--accent); background: var(--accent-soft);
  font-size: 12px; font-weight: 700; letter-spacing: .08em;
}
.entry-intro h1 { font-size: clamp(38px, 4.3vw, 82px); margin: 23px 0 15px; line-height: 1.06; letter-spacing: -.05em; }
.entry-intro em { font-style: normal; }
.entry-intro p { color: var(--muted); font-size: 16px; line-height: 1.65; }
.entry-card {
  padding: clamp(24px, 3vw, 38px); border: 1px solid var(--line); border-radius: 24px;
  background: var(--panel); box-shadow: 0 0 70px var(--entry-glow), 0 18px 50px #0004;
}
.entry-mark { width: 48px; height: 48px; background: var(--panel2); color: var(--accent); font-size: 26px; }
.entry-card h2 { font-size: 27px; margin: 23px 0 3px; }
.entry-subtitle { margin: 0 0 28px; color: var(--muted); }
.entry-card form { display: grid; }
.entry-card label { color: var(--muted); font-size: 12px; font-weight: 650; margin-bottom: 7px; }
.entry-card input { width: 100%; height: 48px; border-radius: 10px; background: var(--field-bg); border-color: var(--line); }
#entry-user { margin-bottom: 17px; }
.entry-password { position: relative; }
.entry-password input { padding-right: 47px; }
.entry-password button { position: absolute; right: 4px; top: 4px; width: 40px; height: 40px; padding: 0; display: grid; place-items: center; border: 0; color: var(--muted); }
.entry-error { margin: 9px 0 0; font-size: 13px; }
.entry-error:empty { display: none; }
.entry-card .entry-submit {
  margin-top: 23px; min-height: 49px; display: flex; align-items: center; justify-content: space-between;
  border: 0; border-radius: 12px; font-weight: 750; color: var(--action-text); background: linear-gradient(100deg, var(--action-start), var(--action-end));
}
.entry-card .entry-submit:hover:not(:disabled) { background: var(--action-hover); }
.entry-link { display: block; margin: 11px auto 0; padding: 5px 8px; color: var(--muted); border: 0; font-size: 12px; }
.entry-contact { margin-top: 14px; padding: 7px 12px; background: var(--panel2); color: var(--accent); font-size: 12px; }
.light .entry { background: radial-gradient(ellipse at 12% 6%, #d7eaff, transparent 65%), var(--bg); }
.light .entry-intro em, .light .entry-brand b { color: var(--accent); }
.entry-card input:focus { border-color: var(--accent); outline: 2px solid var(--accent-overlay); }
@media (max-width: 800px) {
  .entry-layout { width: min(calc(100% - 36px), 480px); grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 86px 0 28px; }
  .entry-badge { margin-top: 18px; }
  .entry-intro h1 { margin: 13px 0 8px; }
  .entry-intro p { font-size: 13px; margin-bottom: 0; }
}

/* Brand and workspace navigation */
.entry-brand .brand-mark, .sidebar-brand .brand-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  margin: 0;
  border: 1px solid var(--brand-border);
  border-radius: 12px;
  background: linear-gradient(135deg, var(--brand-start), var(--brand-end));
  color: var(--action-text);
  box-shadow: -2px -2px 0 var(--brand-shadow);
}
.brand-mark svg, .entry-mark svg { width: 23px; height: 23px; }

.shell.nav-open .sidebar {
  top: 0;
  display: flex;
  padding: 22px 17px 25px;
  background: linear-gradient(150deg, var(--workspace-glow), transparent 44%), var(--sidebar);
  box-shadow: none;
}
.sidebar .sidebar-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 1px 3px;
  margin-bottom: 28px;
  color: var(--text);
  font-size: 21px;
  letter-spacing: -.04em;
}
.sidebar .sidebar-brand:hover { text-decoration: none; color: var(--accent); }
.sidebar .nav-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 4px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 650;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .14s ease, box-shadow .18s ease;
}
.sidebar .nav-link svg { width: 17px; height: 17px; }
.sidebar .nav-link:hover {
  background: var(--panel2);
  color: var(--text);
  text-decoration: none;
}
.sidebar .nav-link[aria-current="page"] {
  background: linear-gradient(100deg, var(--accent-soft), var(--panel));
  color: var(--accent);
  border-color: var(--accent-overlay);
  border-top-color: var(--accent-border);
  box-shadow: 0 5px 15px var(--nav-glow);
}
.sidebar .nav-link:active { transform: translateY(1px) scale(.982); }
.sidebar-create { margin-top: 24px; padding: 20px 0; border-block: 1px solid var(--line); }
#startCreation {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 11px;
  text-align: left;
  padding: 11px;
  border: 1px solid var(--brand-border);
  border-radius: 12px;
  color: var(--action-text);
  background: linear-gradient(115deg, var(--action-start), var(--action-end));
  box-shadow: 0 5px 20px var(--nav-glow);
}
#startCreation:hover { background: linear-gradient(115deg, var(--action-hover), var(--action-start)); }
#startCreation strong, #startCreation small { display: block; }
#startCreation small { margin-top: 2px; color: var(--action-caption); }
.sidebar-plus { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--action-chip); }
.sidebar-notices { padding: 18px 0 14px; font-size: 12px; }
.sidebar-notice-head, .sidebar-notice-head strong { display: flex; align-items: center; gap: 6px; }
.sidebar-notice-head { justify-content: space-between; }
.sidebar-notice-head svg { width: 15px; height: 15px; }
.sidebar-notice-head a { padding: 3px 5px; }
.sidebar-notice-head a[aria-current="page"] { color: var(--accent); }
#sidebarAnnouncements { margin-top: 12px; color: var(--muted); }
.sidebar a.sidebar-announcement { display: block; padding: 4px 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-secondary { border-top: 1px solid var(--line); padding-top: 10px; }
.sidebar-secondary .nav-link { min-height: 35px; padding-block: 6px; }
.admin-nav { margin-bottom: 24px; }
.admin-nav [aria-current="page"] { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-border); }
.admin-title { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.admin-title .vt-heading, .admin-title .vt-heading p { margin-bottom: 0; }
.admin-card { padding: clamp(12px, 2vw, 22px); }
.admin-card h2 { margin: 0; }
.admin-filters { display: flex; flex-wrap: wrap; gap: 12px; margin: 16px 0; }
.admin-filters .field { flex: 1 1 180px; }
.admin-card table { font-variant-numeric: tabular-nums; }
.admin-card tbody tr:hover { background: var(--preview); }
.admin-card td:last-child { white-space: nowrap; }
.admin-card td button { margin-block: 2px; }
.admin-task-detail { min-width: 130px; max-width: 320px; white-space: pre-wrap; overflow-wrap: anywhere; }
.admin-pagination { justify-content: flex-end; margin-top: 16px; }
.admin-overview { align-items: start; }
#adminGeneratedCodes, #adminCopyValue { min-height: 150px; font-family: ui-monospace, Consolas, monospace; }
button:not(:disabled), .sidebar a { -webkit-tap-highlight-color: transparent; }
button:not(:disabled):active { transform: translateY(1px); }
.sidebar a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); }
@media (min-width: 851px) {
  .shell.nav-open .sidebar { position: sticky; inset: auto; top: 0; height: 100svh; }
  .shell.nav-open .workspace { flex: 1; width: auto; }
}
@media (max-width: 850px) {
  .shell.nav-open .sidebar { top: 0; left: 0; bottom: 0; padding-top: 74px; box-shadow: var(--shadow); }
  .shell.nav-open #menuBtn { position: relative; z-index: 21; background: var(--panel); }
}
@media (prefers-reduced-motion: reduce) {
  button, .sidebar .nav-link { transition: none; }
  button:not(:disabled):active, .sidebar .nav-link:active { transform: none; }
}