:root{--ui-bg:#020b18;--ui-panel:#061a2d;--ui-panel-2:#08233a;--ui-line:rgba(74,181,238,.18);--ui-line-strong:rgba(34,211,238,.42);--ui-text:#edfaff;--ui-muted:#8eacc1;--ui-cyan:#22d3ee;--ui-blue:#3b82f6;--ui-green:#34d399;--ui-yellow:#facc15;--ui-red:#fb7185;--ui-r-lg:22px;--ui-r:16px;--ui-r-sm:11px;--ui-shadow:0 18px 50px rgba(0,0,0,.30)}
body{letter-spacing:.01em}.panel,.visual-section,.full-live-preview,.visual-modal-card,.project,.device,.game-card{border-color:var(--ui-line)!important}.panel,.visual-section,.full-live-preview{background:linear-gradient(145deg,rgba(7,27,48,.93),rgba(3,15,30,.88))!important;box-shadow:var(--ui-shadow),inset 0 1px rgba(125,211,252,.06)!important}.main{max-width:1760px!important;padding:28px clamp(18px,2.6vw,44px)!important}.topbar{position:sticky;top:0;z-index:35;padding:13px 0;margin-bottom:20px!important;background:linear-gradient(180deg,rgba(2,11,24,.96),rgba(2,11,24,.72),transparent);backdrop-filter:blur(14px)}.topbar h1{font-size:clamp(22px,2vw,30px)!important}.editor-grid{grid-template-columns:minmax(330px,460px) minmax(520px,1fr)!important;align-items:start;gap:20px!important;position:relative!important;isolation:isolate!important;z-index:auto!important}.editor-grid>div:first-child{position:static!important;min-width:0!important;z-index:1!important}.editor-grid>div:last-child{position:relative!important;z-index:2!important}.fields{gap:13px!important}.field{gap:7px!important}.field label,.edit-label{font-weight:600;color:#abc5d6!important}.field input,.field select,.field textarea{min-height:44px}.toolbar{gap:14px!important}.tabs{padding:5px;border:1px solid var(--ui-line);border-radius:14px;background:rgba(2,13,27,.65)}.tab{flex:1;text-align:center}.tab.active{background:linear-gradient(135deg,#0891b2,#2563eb)!important;color:#fff}.device.visual-device{border-radius:18px!important;margin:13px 0!important;background:linear-gradient(145deg,#071d32,#041426)!important}.device-hero{padding:16px 18px!important}.device-head b{font-size:16px}.device-head .sub{margin-top:4px}.device-metrics{grid-template-columns:repeat(4,minmax(110px,1fr))!important}.device-metric{padding:13px 8px!important}.device-metric strong{font-size:15px}.spark-wrap{gap:14px!important;padding:15px!important}.spark-block{min-width:0;background:linear-gradient(180deg,rgba(4,20,39,.90),rgba(2,12,25,.88))!important}.sparkline{height:112px!important}.device-tools,.version-actions,.actions{row-gap:8px!important}.sticky-save{display:flex;justify-content:flex-end!important;box-shadow:0 14px 38px rgba(0,0,0,.38)!important}.full-live-preview{padding:20px!important;border-radius:var(--ui-r-lg)!important}.full-preview-head{padding-bottom:14px;border-bottom:1px solid var(--ui-line)}.full-preview-frame-wrap{margin-top:16px!important;background:#020814!important}.full-preview-frame-wrap.desktop{max-width:1440px!important}.full-preview-frame-wrap.mobile{max-width:430px!important;border-radius:28px!important;padding:8px;background:linear-gradient(145deg,#14263a,#020814)!important}.full-preview-frame-wrap iframe{height:min(1020px,78vh)!important;border-radius:12px}.visual-modal{align-items:start!important;overflow:auto;padding:clamp(0px,2vw,24px)!important}.visual-modal-card{margin:auto;border-radius:22px!important}.visual-modal-head{padding:16px 20px!important}.visual-modal-body{padding:20px!important}.ocr-modal-card{width:min(1240px,100%)!important}.ocr-canvas-wrap{box-shadow:inset 0 0 0 1px rgba(125,211,252,.08)}.ocr-preview{height:260px!important}.kpis{gap:15px!important}.kpi{position:relative;overflow:hidden;padding:20px!important}.kpi:after{content:"";position:absolute;right:-25px;bottom:-40px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.14),transparent 68%)}.kpi strong{font-size:32px!important}.project-grid{gap:18px!important}.project{min-height:225px!important;padding:19px!important}.stats{gap:9px!important}.stats div{border:1px solid rgba(56,189,248,.10)}.login .panel{border-radius:24px!important}.status{animation:uiToast .24s ease-out}@keyframes uiToast{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
body[data-page="home"] .container{max-width:1280px!important}body[data-page="home"] .hero{margin-top:28px!important}body[data-page="home"] .game-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important}body[data-page="home"] .game-card{min-height:270px!important}body[data-page="home"] .game-info{min-height:270px!important;padding-top:92px!important}
body[data-page="result"] .container{max-width:1420px!important}body[data-page="result"] .header{margin-top:18px!important}body[data-page="result"] .summary-section,body[data-page="result"] .device-card{border-radius:20px!important}body[data-page="result"] .overlay-chart-container{min-height:440px!important}body[data-page="result"] #cpuOverlayChart,body[data-page="result"] #fpsOverlayChart{height:400px!important;min-height:400px!important}
@media(max-width:1100px){.editor-grid{grid-template-columns:1fr!important}.editor-grid>div:first-child{position:static}.main{padding:18px!important}.full-preview-frame-wrap iframe{height:820px!important}.device-metrics{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:800px){.main{padding:12px 10px 92px!important}.topbar{top:46px;padding:9px 0}.topbar .actions{width:100%}.topbar .actions>*{flex:1;text-align:center}.panel{padding:14px!important}.visual-section{padding:13px!important}.device-head{flex-direction:column}.device-head .actions{width:100%}.device-head .actions button{flex:1}.sparkline{height:94px!important}.full-live-preview{padding:10px!important}.full-preview-frame-wrap iframe{height:720px!important}.full-preview-head .actions button{flex:1 1 42%}.visual-modal-head{align-items:flex-start;flex-direction:column}.visual-modal-head .actions{width:100%}.visual-modal-head .actions>*{flex:1;text-align:center}.ocr-preview{height:200px!important}}
@media(max-width:520px){.kpis{display:grid!important;grid-template-columns:1fr 1fr!important}.kpi{min-width:0!important;padding:14px!important}.kpi strong{font-size:25px!important}.device-metrics{grid-template-columns:1fr 1fr!important}.game-meta{align-items:stretch!important;flex-direction:column}.game-tag{max-width:100%!important}.enter-link{justify-content:center}}

/* Three-issue hard fixes */
.editor-grid{position:relative!important;isolation:isolate!important}.editor-grid>div:first-child{position:static!important;top:auto!important;z-index:1!important}.editor-grid>div:first-child .preview{position:relative!important;inset:auto!important;z-index:1!important;margin-top:16px!important;max-height:none!important}.editor-grid>div{min-width:0;z-index:auto}.editor-grid>div:last-child{position:relative;z-index:2}.full-live-preview{position:relative!important;z-index:2!important;overflow:auto!important;max-height:none!important;margin-top:18px!important}.device-head button{position:relative;z-index:5}.sparkline{display:block!important;visibility:visible!important;opacity:1!important}.spark-block{min-height:145px}.spark-block canvas{width:100%!important;height:112px!important}

/* PC management interaction fixes */
@media (min-width:801px){
  .editor-grid{isolation:auto!important;overflow:visible!important}
  .editor-grid>div,.editor-grid>div:first-child,.editor-grid>div:last-child{position:relative!important;z-index:auto!important;pointer-events:auto!important}
  .editor-grid input,.editor-grid select,.editor-grid textarea,.editor-grid button,.editor-grid label,
  .visual-modal input,.visual-modal select,.visual-modal textarea,.visual-modal button,.visual-modal label{
    position:relative;z-index:3;pointer-events:auto!important;user-select:text
  }
  .editor-grid button,.visual-modal button,.editor-grid select,.visual-modal select,.editor-grid label,.visual-modal label{user-select:none}
  .full-live-preview{isolation:isolate!important;contain:layout paint!important;z-index:0!important}
  .full-preview-frame-wrap,.full-preview-frame-wrap iframe{position:relative!important;z-index:0!important}
  .visual-modal{pointer-events:auto!important;z-index:1000!important}
  .visual-modal-card{position:relative!important;z-index:1001!important;pointer-events:auto!important}
  .sticky-save{z-index:20!important}
}

/* Native keyboard editing must remain available on every management form. */
#loginView input,.shell input,.shell textarea,.visual-modal input,.visual-modal textarea{
  pointer-events:auto!important;
  user-select:text!important;
  -webkit-user-select:text!important;
  caret-color:#eaf7ff!important;
  touch-action:manipulation!important;
}
#loginView input:focus,.shell input:focus,.shell textarea:focus,.visual-modal input:focus,.visual-modal textarea:focus{
  outline:2px solid rgba(34,211,238,.7)!important;
  outline-offset:2px!important;
}

/* Unified visual and usability system v4 */
:root{
  --ux-bg:#020a16;--ux-surface:#07192b;--ux-surface-2:#0a2138;--ux-line:rgba(125,211,252,.20);
  --ux-line-strong:rgba(34,211,238,.54);--ux-text:#eaf7ff;--ux-muted:#8fabbe;
  --ux-primary:#22d3ee;--ux-primary-2:#2563eb;--ux-success:#34d399;--ux-warning:#fbbf24;
  --ux-danger:#fb7185;--ux-shadow:0 18px 54px rgba(0,0,0,.38);--ux-radius:16px;
}
html{scroll-behavior:smooth;color-scheme:dark}
body{background:radial-gradient(circle at 80% -10%,rgba(14,116,144,.22),transparent 34%),linear-gradient(145deg,#020814,#051528 55%,#020c19)!important}
button,input,textarea,select,a{-webkit-tap-highlight-color:transparent}
button,input,textarea,select{transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,transform .18s ease}
input,textarea,select{background:#031224!important;border-color:#28506f!important;color:var(--ux-text)!important}
input:hover,textarea:hover,select:hover{border-color:#3b7195!important}
input:focus,textarea:focus,select:focus{outline:0!important;border-color:var(--ux-primary)!important;box-shadow:0 0 0 3px rgba(34,211,238,.15)!important}
input:disabled,input[readonly],textarea:disabled,select:disabled{opacity:.64;cursor:not-allowed;background:#07111e!important}
::placeholder{color:#65869d!important}
.btn{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:650;letter-spacing:.01em;box-shadow:inset 0 1px rgba(255,255,255,.04)}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.24)}
.btn:active{transform:translateY(0)}
.btn.primary,.primary{background:linear-gradient(135deg,#0891b2,#2563eb)!important;border-color:#38bdf8!important}
.btn.danger,.danger{background:rgba(127,29,29,.46)!important;border-color:rgba(251,113,133,.48)!important}
.panel,.visual-section,.full-live-preview{border-radius:var(--ux-radius)!important;border-color:var(--ux-line)!important}
.side{width:230px;box-shadow:12px 0 44px rgba(0,0,0,.22)}
.side .nav button{min-height:44px;font-weight:650}
.topbar{min-height:70px}.topbar .sub{margin-top:2px}
.kpi,.project,.device.visual-device{box-shadow:0 12px 34px rgba(0,0,0,.22)}
.kpi:hover,.project:hover,.device.visual-device:hover{border-color:rgba(34,211,238,.34)!important;transform:translateY(-1px)}
.toolbar{min-height:46px}.search{min-height:44px}
.field label,.edit-label{display:flex;align-items:center;min-height:20px;letter-spacing:.015em}
.visual-form-grid{align-items:start}
.tabs{position:sticky;top:74px;z-index:22;backdrop-filter:blur(14px)}
.sticky-save{gap:10px!important;align-items:center!important;border-color:rgba(34,211,238,.35)!important}
#dirtyState{margin-right:auto}.dirty:before{content:'● ';color:var(--ux-warning)}
.device-head{align-items:flex-start}.handle{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;background:rgba(34,211,238,.08)}
.device-metrics{overflow:hidden}.device-metric strong{font-variant-numeric:tabular-nums}
.visual-modal{background:rgba(0,5,14,.82)!important}.visual-modal-card{box-shadow:0 34px 100px rgba(0,0,0,.70)!important}
.visual-modal-head{gap:14px}.visual-modal-body{scrollbar-gutter:stable}
.ocr-upload:hover{border-color:var(--ux-primary);background:rgba(34,211,238,.05)}
.status{display:flex;align-items:center;min-height:48px;font-weight:650;z-index:2000!important}
.empty{border:1px dashed var(--ux-line);border-radius:14px;background:rgba(2,14,28,.32)}
.ux-help{padding:10px 12px;border:1px solid var(--ux-line);border-radius:11px;background:rgba(34,211,238,.05);color:var(--ux-muted);font-size:12px}
.ux-shortcuts{display:flex;gap:7px;flex-wrap:wrap}.ux-key{padding:2px 7px;border:1px solid #315775;border-bottom-width:2px;border-radius:6px;background:#071729;color:#b9d7e8;font:11px ui-monospace,Consolas,monospace}
.ux-unsaved{color:var(--ux-warning)!important}.ux-saved{color:var(--ux-success)!important}
@media(max-width:1100px) and (min-width:801px){.shell{grid-template-columns:190px 1fr}.editor-grid{grid-template-columns:1fr!important}.full-live-preview{margin-top:14px!important}.visual-form-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:800px){.visual-form-grid{grid-template-columns:1fr!important}.visual-form-grid .wide{grid-column:auto!important}.device-metrics{grid-template-columns:repeat(2,1fr)!important}.spark-wrap{grid-template-columns:1fr!important}.actions .btn{flex:1}.visual-modal{padding:0!important}.visual-modal-card{width:100%!important;min-height:100%;max-height:none!important;border-radius:0!important}.visual-modal-head{top:0}.sticky-save{flex-wrap:wrap}.sticky-save #dirtyState{width:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* CPU core editor v5 */
.cpu-cluster-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px}.cluster-summary{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0 0 12px}.cluster-summary span,.cluster-summary button{border:1px solid rgba(125,211,252,.18);border-radius:999px;background:rgba(34,211,238,.055);color:#9fc7db;padding:5px 10px;font-size:12px}.cluster-summary button{cursor:pointer}.cluster-summary button:hover{border-color:#22d3ee;color:#eaf7ff}.cpu-cluster-list{display:grid;gap:12px}.cpu-cluster-card{border:1px solid rgba(125,211,252,.20);border-radius:15px;background:linear-gradient(145deg,rgba(7,28,48,.92),rgba(3,16,31,.92));overflow:hidden}.cpu-cluster-card[data-role="prime"]{border-left:3px solid #a78bfa}.cpu-cluster-card[data-role="performance"]{border-left:3px solid #22d3ee}.cpu-cluster-card[data-role="efficiency"]{border-left:3px solid #34d399}.cpu-cluster-card[data-role="cluster"]{border-left:3px solid #94a3b8}.cpu-cluster-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;background:rgba(6,27,46,.72)}.cluster-collapse{display:flex;align-items:center;gap:9px;min-width:0;flex:1;border:0;background:transparent;color:#eaf7ff;text-align:left;cursor:pointer}.cluster-collapse small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#87aabd}.cluster-role-dot{width:9px;height:9px;border-radius:50%;background:#94a3b8;box-shadow:0 0 12px currentColor}.cpu-cluster-card[data-role="prime"] .cluster-role-dot{background:#a78bfa}.cpu-cluster-card[data-role="performance"] .cluster-role-dot{background:#22d3ee}.cpu-cluster-card[data-role="efficiency"] .cluster-role-dot{background:#34d399}.cluster-collapse:after{content:'⌄';margin-left:auto;color:#7dd3fc;transition:transform .18s}.cluster-collapse[aria-expanded="true"]:after{transform:rotate(180deg)}.cpu-cluster-body{padding:14px}.cluster-basic-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:11px}.cluster-basic-grid label,.cluster-curves-grid label{justify-content:space-between}.cluster-basic-grid label span,.cluster-curves-grid label span{color:#6f94aa;font-weight:500}.cluster-curves-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.curve-input.compact{min-height:110px!important;max-height:220px}.cluster-field-note{margin-top:5px;color:#64869c;font-size:11px}.cpu-json-advanced{margin-top:14px;border:1px dashed rgba(125,211,252,.18);border-radius:12px;padding:10px 12px}.cpu-json-advanced summary{cursor:pointer;color:#87aabd;font-weight:650}.cpu-json-advanced[open] summary{margin-bottom:10px;color:#bae6fd}@media(max-width:1050px){.cluster-basic-grid{grid-template-columns:1fr 1fr}.cpu-cluster-toolbar{align-items:flex-start;flex-direction:column}}@media(max-width:700px){.cluster-basic-grid,.cluster-curves-grid{grid-template-columns:1fr}.cpu-cluster-head{align-items:flex-start}.cpu-cluster-head .actions{flex-wrap:nowrap}.cluster-collapse{align-items:flex-start;flex-wrap:wrap}.cluster-collapse small{width:100%;padding-left:18px}.cpu-cluster-toolbar .actions{display:grid;grid-template-columns:1fr 1fr;width:100%}}

/* Scene extractor v6 */
.ocr-workflow{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:14px}.ocr-workflow span{position:relative;padding:9px 8px;border:1px solid rgba(125,211,252,.16);border-radius:10px;background:#041428;color:#6f91a7;text-align:center;font-size:12px}.ocr-workflow span.done{border-color:rgba(52,211,153,.48);background:rgba(52,211,153,.08);color:#a7f3d0}.ocr-workflow span.done:before{content:'✓ ';font-weight:800}.ocr-quality{display:flex;align-items:center;gap:10px;position:relative;margin-top:10px;height:30px;padding:0 10px;border:1px solid rgba(125,211,252,.16);border-radius:9px;overflow:hidden}.ocr-quality i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,rgba(251,113,133,.18),rgba(251,191,36,.18),rgba(52,211,153,.20));transition:width .25s}.ocr-quality span{position:relative;z-index:1;color:#b5d3e3;font-size:12px}.ocr-batch-list{display:grid;gap:7px;margin-top:12px}.ocr-batch-item{display:grid;grid-template-columns:12px minmax(180px,1fr) auto auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid rgba(125,211,252,.16);border-radius:10px;background:rgba(3,18,36,.72)}.ocr-batch-item>i{width:11px;height:11px;border-radius:50%}.ocr-batch-item>span{color:#789bad;font-size:12px}.ocr-modal-card output{color:#7dd3fc;font-variant-numeric:tabular-nums}.ocr-modal-card input[type="range"]{padding:0;height:30px}.ocr-canvas-wrap{position:relative}.ocr-canvas-wrap:after{content:'拖动框选图表区域，切换“采样颜色”后点击曲线';position:sticky;display:block;left:12px;bottom:10px;width:max-content;max-width:calc(100% - 24px);padding:5px 9px;border-radius:8px;background:rgba(2,10,22,.82);color:#8fb2c6;font-size:11px;pointer-events:none}@media(max-width:800px){.ocr-workflow{grid-template-columns:1fr 1fr}.ocr-workflow span:last-child{grid-column:1/-1}.ocr-batch-item{grid-template-columns:12px 1fr auto}.ocr-batch-item>span{grid-column:2/4}.ocr-modal-card .sticky-save .btn{flex:1 1 40%}}

/* Scene extractor v7 */
.ocr-presetbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px;padding:9px;border:1px solid rgba(125,211,252,.16);border-radius:12px;background:rgba(3,18,35,.62)}.ocr-presetbar label{font-weight:700}.ocr-presetbar select{width:auto;min-width:150px}.ocr-presetbar output{min-width:48px;text-align:center;color:#7dd3fc;font-variant-numeric:tabular-nums}.ocr-upload.dragging{border-color:#34d399!important;background:rgba(52,211,153,.10)!important;color:#d1fae5}.ocr-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;color:#95b8cb}.ocr-preview-head label{display:flex;align-items:center;gap:6px}.ocr-preview-head input{width:auto!important}.ocr-canvas-wrap canvas{image-rendering:auto}@media(max-width:700px){.ocr-presetbar .btn{flex:1}.ocr-presetbar select{width:100%}.ocr-preview-head{align-items:flex-start;flex-direction:column}}

/* Scene extractor v8 */
.ocr-color-candidates{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:7px;margin:10px 0}.ocr-color-candidate{display:grid;grid-template-columns:18px 1fr;gap:2px 7px;align-items:center;padding:8px;border:1px solid rgba(125,211,252,.16);border-radius:9px;background:#041426;color:#bfd9e7;text-align:left;cursor:pointer}.ocr-color-candidate i{grid-row:1/3;width:18px;height:18px;border-radius:50%;background:var(--candidate);box-shadow:0 0 10px var(--candidate)}.ocr-color-candidate small{color:#63879c}.ocr-color-candidate.active{border-color:#22d3ee;background:rgba(34,211,238,.09)}.ocr-warnings{margin-top:8px;padding:8px 10px;border:1px solid rgba(251,191,36,.36);border-radius:9px;background:rgba(251,191,36,.08);color:#fde68a;font-size:12px}.ocr-modal-card button:disabled{opacity:.5;cursor:wait;transform:none!important}@media(max-width:600px){.ocr-color-candidates{grid-template-columns:1fr 1fr}}