/* 方案二：赛博机甲风。仅重构视觉与布局，不改变任何 ID、事件和接口。 */
:root{--primary:#16e0d0;--primary-hover:#50fff1;--primary-bg:rgba(22,224,208,.10);--primary-border:rgba(22,224,208,.38);--bg:#02090d;--bg-card:rgba(4,19,24,.86);--bg-input:rgba(0,8,12,.82);--border:rgba(100,255,238,.13);--radius:12px;--text-1:#eefeff;--text-2:#8fb8bd;--text-3:#55757a;--warning:#ff9f43}
html,body{overflow:hidden;background:#02070a}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;background:linear-gradient(rgba(0,255,230,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,230,.025) 1px,transparent 1px),radial-gradient(circle at 72% 22%,rgba(0,229,255,.12),transparent 26%),radial-gradient(circle at 15% 80%,rgba(255,120,30,.07),transparent 24%);background-size:38px 38px,38px 38px,auto,auto}
.bg{background:linear-gradient(130deg,rgba(0,10,15,.96),rgba(2,20,26,.9)),radial-gradient(ellipse at center,rgba(0,255,230,.08),transparent 60%)}
.announcement-bar{height:34px!important;background:linear-gradient(90deg,#081518,#10282b,#081518)!important;border-bottom:1px solid rgba(22,224,208,.35);box-shadow:0 0 24px rgba(22,224,208,.16)!important;color:#9ffff5!important;animation:none!important;letter-spacing:.5px}
.navbar{top:34px!important;height:64px;background:rgba(1,10,14,.88);border-bottom:1px solid rgba(22,224,208,.22);box-shadow:0 12px 40px rgba(0,0,0,.35)}
.nav-inner{padding:0 28px;gap:34px}.logo{position:relative}.logo:before{content:"";position:absolute;inset:-10px -16px;border:1px solid rgba(22,224,208,.18);clip-path:polygon(8% 0,100% 0,100% 70%,92% 100%,0 100%,0 30%)}.logo svg{filter:drop-shadow(0 0 8px #16e0d0)}.logo span{display:flex;flex-direction:column;font-size:15px;line-height:1.15}.logo small{font-size:8px;color:#16e0d0;letter-spacing:1.8px;font-weight:500;margin-top:3px}.nav-link{border-radius:2px;padding:9px 16px;position:relative}.nav-link.active{background:linear-gradient(180deg,rgba(22,224,208,.15),rgba(22,224,208,.03));box-shadow:inset 0 -2px #16e0d0}.nav-promo{border-radius:2px;background:rgba(255,159,67,.06);border-color:rgba(255,159,67,.25)}
.main{padding:112px 20px 52px!important;height:calc(100vh - 34px)!important;max-width:1900px;margin:auto;display:grid;grid-template-columns:minmax(460px,.95fr) minmax(700px,1.55fr);grid-template-rows:154px 1fr;gap:14px}
.intro{grid-column:1/3;margin:0;padding:24px 30px;text-align:left;border:1px solid rgba(22,224,208,.22);border-radius:14px;background:linear-gradient(105deg,rgba(4,21,27,.94),rgba(5,26,31,.68));position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.intro:before{content:"SYSTEM / GLOBAL NODE NETWORK";position:absolute;right:28px;top:22px;color:rgba(22,224,208,.26);font:700 11px monospace;letter-spacing:3px}.intro:after{content:"";position:absolute;right:42px;bottom:-80px;width:310px;height:210px;border:1px solid rgba(22,224,208,.22);border-radius:50%;box-shadow:0 0 0 18px rgba(22,224,208,.025),0 0 0 38px rgba(22,224,208,.018),inset 0 0 45px rgba(22,224,208,.08)}.intro h1{font-size:32px;letter-spacing:2px;text-shadow:0 0 18px rgba(22,224,208,.28)}.intro p{margin-top:8px}.intro-tags{justify-content:flex-start;margin-top:18px}.tag{background:rgba(0,0,0,.22);border-color:rgba(22,224,208,.2);border-radius:4px}
.workspace{display:contents}.panel{background:linear-gradient(145deg,rgba(4,20,25,.95),rgba(2,12,16,.92));border:1px solid rgba(22,224,208,.22);border-radius:12px;box-shadow:inset 0 0 30px rgba(0,255,230,.025),0 18px 50px rgba(0,0,0,.28);overflow:hidden;position:relative}.panel:before,.panel:after{content:"";position:absolute;width:34px;height:34px;pointer-events:none;z-index:2}.panel:before{left:-1px;top:-1px;border-left:2px solid #16e0d0;border-top:2px solid #16e0d0}.panel:after{right:-1px;bottom:-1px;border-right:2px solid #ff8b32;border-bottom:2px solid #ff8b32}.panel-detect{grid-column:1;grid-row:2}.panel-task{grid-column:2;grid-row:2}.panel-header{height:58px;padding:0 18px;background:linear-gradient(90deg,rgba(22,224,208,.08),transparent 65%);border-bottom-color:rgba(22,224,208,.15)}.panel-header h2{font-size:15px;letter-spacing:.5px}.panel-body{padding:16px}.input-box textarea{border:1px solid rgba(22,224,208,.18);background:linear-gradient(180deg,rgba(0,6,9,.9),rgba(1,15,18,.85));border-radius:6px;box-shadow:inset 0 0 35px rgba(0,0,0,.35);font-family:Consolas,monospace}.panel-footer{background:rgba(0,0,0,.2);border-top-color:rgba(22,224,208,.12)}.btn-start{border-radius:4px!important;background:linear-gradient(100deg,#0a615d,#13d6c7)!important;color:#eaffff!important;box-shadow:0 0 24px rgba(22,224,208,.25);clip-path:polygon(8% 0,100% 0,100% 72%,92% 100%,0 100%,0 28%)}
.task-tabs{background:rgba(0,0,0,.22);border-radius:4px}.tab-btn.active{color:#16e0d0;background:rgba(22,224,208,.12)}.current-task-card{min-height:100%;display:grid;grid-template-columns:1.15fr .9fr;grid-template-rows:1fr auto;align-items:center;gap:18px;padding:26px!important;background:radial-gradient(circle at 28% 45%,rgba(22,224,208,.08),transparent 26%)}.task-circle{width:230px!important;height:230px!important;justify-self:center;filter:drop-shadow(0 0 12px rgba(22,224,208,.28))}.task-circle:before{content:"";position:absolute;inset:-18px;border:1px dashed rgba(22,224,208,.26);border-radius:50%;animation:mechspin 18s linear infinite}.task-circle:after{content:"NODE CORE";position:absolute;bottom:-34px;font:10px monospace;letter-spacing:2px;color:#16e0d0}.task-info{grid-column:2;grid-row:1;text-align:left!important;padding:24px;border:1px solid rgba(22,224,208,.12);background:rgba(0,0,0,.18)}.task-name{font-size:20px!important}.task-data{grid-column:1/3;grid-row:2;display:grid!important;grid-template-columns:repeat(3,1fr);gap:12px}.data-item{padding:16px!important;border:1px solid rgba(22,224,208,.12);background:rgba(0,0,0,.22);justify-content:center}.task-bar{grid-column:1/3}.bar-fill{background:linear-gradient(90deg,#16e0d0,#ff8b32)!important}@keyframes mechspin{to{transform:rotate(360deg)}}
.footer{left:20px;right:20px;bottom:0;height:42px;background:transparent;border:0;color:#54787b}.modal-box{background:#041318;border-color:rgba(22,224,208,.3)}
@media(max-width:1100px){html,body{overflow:auto}.main{display:block;height:auto!important;padding-top:112px!important}.intro{margin-bottom:14px}.workspace{display:grid}.panel{margin-bottom:14px}.current-task-card{display:flex}.footer{position:relative;left:0;right:0}.navbar{overflow-x:auto}}


/* ===== 2026 动态视觉升级：只增加视觉动效，不改变业务逻辑 ===== */
.fx-aurora{position:fixed;inset:-20%;z-index:-3;pointer-events:none;background:conic-gradient(from 90deg at 50% 50%,transparent,rgba(22,224,208,.11),transparent 28%,rgba(255,139,50,.06),transparent 62%);filter:blur(55px);animation:fxAurora 22s linear infinite}
.fx-scan{position:fixed;left:0;right:0;top:-12vh;height:12vh;z-index:9998;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(22,224,208,.035),rgba(22,224,208,.12),transparent);mix-blend-mode:screen;animation:fxScan 8s linear infinite}
.fx-particles{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.fx-particles i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:#66fff1;box-shadow:0 0 10px #16e0d0;opacity:.35;animation:fxFloat var(--d) ease-in-out var(--delay) infinite alternate}
.fx-reveal{opacity:0;transform:translateY(18px) scale(.985);filter:blur(7px);transition:opacity .75s ease var(--fx-delay),transform .75s cubic-bezier(.2,.8,.2,1) var(--fx-delay),filter .75s ease var(--fx-delay)}.fx-show .fx-reveal{opacity:1;transform:none;filter:none}
.intro{transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .25s ease,border-color .35s ease,box-shadow .35s ease}.intro:hover{border-color:rgba(80,255,241,.5);box-shadow:0 0 0 1px rgba(22,224,208,.08),0 28px 70px rgba(0,0,0,.34),inset 0 0 50px rgba(22,224,208,.05)}
.intro h1{background:linear-gradient(90deg,#fff,#72fff4,#fff);background-size:220% auto;color:transparent;background-clip:text;-webkit-background-clip:text;animation:fxTitle 5s linear infinite}
.panel{transition:transform .32s cubic-bezier(.2,.8,.2,1),border-color .32s ease,box-shadow .32s ease}.panel:hover{transform:translateY(-4px);border-color:rgba(22,224,208,.48);box-shadow:inset 0 0 45px rgba(0,255,230,.045),0 24px 70px rgba(0,0,0,.42),0 0 28px rgba(22,224,208,.08)}
.panel-header:after{content:"";position:absolute;left:0;bottom:-1px;width:28%;height:1px;background:linear-gradient(90deg,transparent,#16e0d0,transparent);animation:fxLine 4s ease-in-out infinite}
.btn-start,button,.nav-link{transform:translate(var(--mx,0),var(--my,0));will-change:transform;overflow:hidden}.btn-start:after{content:"";position:absolute;inset:-40% auto -40% -30%;width:20%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:fxShine 3.6s ease-in-out infinite}
.task-circle{animation:fxCore 3.2s ease-in-out infinite}.task-circle svg,.task-circle .progress-ring{filter:drop-shadow(0 0 7px rgba(22,224,208,.65))}
.fx-clock{margin-left:auto;padding:6px 10px;border:1px solid rgba(22,224,208,.2);background:rgba(0,0,0,.22);font:11px/1 Consolas,monospace;letter-spacing:1px;color:#6ffff4;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.fx-ripple{position:absolute;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.35);transform:scale(0);animation:fxRipple .65s ease-out}
.input-box textarea:focus,input:focus,select:focus{box-shadow:0 0 0 1px rgba(22,224,208,.35),0 0 25px rgba(22,224,208,.12)!important}
@keyframes fxAurora{to{transform:rotate(360deg)}}@keyframes fxScan{to{transform:translateY(124vh)}}@keyframes fxFloat{to{transform:translate3d(28px,-45px,0);opacity:.75}}@keyframes fxTitle{to{background-position:220% center}}@keyframes fxLine{0%,100%{transform:translateX(-20%);opacity:.35}50%{transform:translateX(290%);opacity:1}}@keyframes fxShine{0%,55%{left:-35%;opacity:0}70%{opacity:1}100%{left:125%;opacity:0}}@keyframes fxCore{50%{filter:drop-shadow(0 0 22px rgba(22,224,208,.38));transform:scale(1.018)}}@keyframes fxRipple{to{transform:scale(2.5);opacity:0}}
@media(prefers-reduced-motion:reduce){.fx-aurora,.fx-scan,.fx-particles,.intro h1,.task-circle,.btn-start:after,.panel-header:after{animation:none!important}.fx-reveal{opacity:1!important;transform:none!important;filter:none!important}}


/* ===== 2026-07 desktop viewport adaptation: centered hero + no inner scroll ===== */
@media (min-width:1101px){
  .intro{ text-align:center!important; align-items:center!important; }
  .intro h1,.intro>p{ width:100%; text-align:center!important; }
  .intro-tags{ justify-content:center!important; }
  .panel-task>.panel-body{ overflow:hidden!important; padding:12px 14px!important; }
  .panel-task .tip{ margin-top:0!important; margin-bottom:10px!important; padding:6px 10px!important; min-height:30px; }
  #tab-current{ height:calc(100% - 40px)!important; overflow:hidden!important; }
  .current-task-card{ min-height:0!important; height:auto!important; }
  .current-history-wrap{ margin-top:10px!important; }
  .current-history-head{ padding:8px 12px!important; }
  .history-table-inline{ max-height:none!important; overflow:visible!important; }
  .history-table-inline .table th,.history-table-inline .table td{ padding:7px 10px!important; }
}
@media (min-width:1101px) and (max-height:950px){
  .current-task-card{ padding:14px 16px!important; gap:10px!important; }
  .task-circle{ width:150px!important; height:150px!important; }
  .task-circle:before{ inset:-10px!important; }
  .task-circle:after{ bottom:-20px!important; }
  .task-info{ margin:0!important; padding:14px!important; }
  .task-name{ font-size:16px!important; }
  .task-data{ margin:0!important; gap:8px!important; }
  .data-item{ padding:9px 10px!important; }
  .task-bar{ margin-top:0!important; }
}
@media (min-width:1101px) and (max-height:820px){
  .intro{ padding-top:14px!important; padding-bottom:14px!important; }
  .intro h1{ font-size:26px!important; margin-bottom:5px!important; }
  .intro>p{ margin-bottom:9px!important; }
  .intro-tags{ margin-top:8px!important; }
  .tag{ padding:7px 14px!important; }
  .panel-header{ height:50px!important; padding-top:9px!important; padding-bottom:9px!important; }
  .current-task-card{ padding:10px 12px!important; }
  .task-circle{ width:124px!important; height:124px!important; }
  .task-info{ padding:10px!important; }
  .data-item{ padding:7px 8px!important; }
  .current-history-head{ padding:6px 10px!important; }
  .history-table-inline .table th,.history-table-inline .table td{ padding:5px 8px!important; }
}
@media (min-width:1101px) and (max-height:950px){
  .current-task-card{grid-template-columns:.82fr 1.18fr!important;grid-template-rows:auto auto auto!important;align-content:center!important;}
  .task-circle{grid-column:1;grid-row:1/3;}
  .task-info{grid-column:2;grid-row:1;align-self:end;}
  .task-data{grid-column:2;grid-row:2;}
  .task-bar{grid-column:1/3;grid-row:3;}
}

/* ===== 模板精准重构 V2：按用户确认的机甲控制台参考图 ===== */
@media (min-width:1101px){
html,body{overflow:hidden!important;background:#020b0f!important}
body:after{content:"";position:fixed;inset:0;z-index:-4;background:linear-gradient(rgba(0,8,12,.84),rgba(0,8,12,.93)),url('../images/template-reference.jpg') center/cover no-repeat;filter:saturate(.9)}
.announcement-bar{display:none!important}.navbar{top:0!important;height:54px!important;background:rgba(1,10,14,.96)!important}.main{padding:62px 10px 10px!important;height:calc(100vh - 54px)!important;grid-template-columns:1fr!important;grid-template-rows:104px minmax(0,1fr)!important;gap:8px!important;max-width:none!important}
.intro{grid-column:1!important;padding:12px 22px!important;min-height:0!important;text-align:center!important;background:linear-gradient(100deg,rgba(4,18,24,.92),rgba(3,15,20,.75))!important;border-radius:10px!important}
.intro:before{display:none!important}.intro h1{font-size:28px!important;margin:0 0 5px!important}.intro>p{font-size:12px!important;margin:0 0 8px!important}.intro-tags{margin-top:0!important;gap:10px!important}.tag{padding:6px 12px!important;font-size:11px!important}
.workspace{display:grid!important;grid-template-columns:minmax(390px,1.05fr) minmax(400px,1.08fr) minmax(270px,.72fr)!important;grid-template-rows:minmax(0,1fr) 66px!important;gap:8px!important;min-height:0!important}
.panel-detect{grid-column:1!important;grid-row:1!important}.panel-task{grid-column:2!important;grid-row:1!important}.mecha-analytics{grid-column:3;grid-row:1;display:grid;grid-template-rows:1fr .85fr;gap:8px;min-height:0}.mecha-metrics{grid-column:1/4;grid-row:2;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.panel,.analytics-card,.mecha-metrics>div{border:1px solid rgba(26,215,204,.28)!important;background:linear-gradient(150deg,rgba(3,19,24,.96),rgba(2,12,16,.97))!important;box-shadow:inset 0 0 28px rgba(13,232,220,.025),0 8px 30px rgba(0,0,0,.3)!important;border-radius:7px!important}
.panel-header{height:48px!important;padding:8px 12px!important}.panel-body{padding:10px!important}.panel-footer{padding:10px!important}.panel-detect .panel-body{min-height:0!important}.textarea{height:100%!important;min-height:0!important;padding:14px!important}.panel-actions{gap:5px!important}.gate-select{max-width:150px!important}.btn-icon{font-size:11px!important;padding:7px 9px!important}
.panel-task>.panel-body{padding:8px!important}.panel-task .tip{display:none!important}.current-task-card{display:grid!important;grid-template-columns:1fr 1.15fr!important;grid-template-rows:1fr auto auto!important;align-items:center!important;padding:12px!important;gap:8px 12px!important;background:radial-gradient(circle at 32% 42%,rgba(20,230,219,.12),transparent 28%)!important}
.task-circle{grid-column:1;grid-row:1;width:170px!important;height:170px!important;margin:auto!important}.task-info{grid-column:2;grid-row:1;margin:0!important;padding:16px!important;border:1px solid rgba(26,215,204,.18);min-height:102px;display:flex;flex-direction:column;justify-content:center}.task-data{grid-column:1/3;grid-row:2;margin:0!important;gap:8px!important}.task-bar{grid-column:1/3;grid-row:3;margin:0!important}.current-history-wrap{display:none!important}
.analytics-card{padding:12px;overflow:hidden}.analytics-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#e7ffff}.analytics-head span{color:#7aa1a6}.chart-legend{display:flex;justify-content:flex-end;gap:10px;font-size:9px;color:#72969a;margin:7px 0}.chart-legend span:nth-child(2){color:#39dbba}.chart-legend span:nth-child(3){color:#ff6171}.mini-chart{width:100%;height:calc(100% - 58px);min-height:90px}.chart-axis{display:flex;justify-content:space-between;color:#54777c;font-size:8px}.realtime-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0}.realtime-grid div{padding:9px 4px;text-align:center;background:rgba(8,39,43,.5);border:1px solid rgba(25,220,205,.12)}.realtime-grid span{display:block;color:#678b90;font-size:9px}.realtime-grid b{font-size:20px;color:#19ddcf}.realtime-grid div:nth-child(2) b{color:#38eab1}.realtime-grid div:nth-child(3) b{color:#ff586c}.holo-platform{height:95px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse at center,rgba(0,229,218,.14),transparent 58%)}.holo-platform i{position:absolute;width:72%;height:32px;border:1px solid rgba(34,226,217,.35);border-radius:50%;box-shadow:0 0 22px rgba(17,225,213,.12)}.holo-platform i:nth-child(2){width:50%;height:20px}.holo-platform i:nth-child(3){width:30%;height:10px}.holo-platform span{font-size:28px;color:#17e1d2;text-shadow:0 0 12px #17e1d2}
.mecha-metrics>div{padding:9px 14px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center}.mecha-metrics span{grid-row:1/3;color:#5f898e;font-size:10px}.mecha-metrics b{font-size:15px;color:#efffff}.mecha-metrics em{font-style:normal;color:#8eb5b9;font-size:10px}.footer{display:none!important}
}
@media (min-width:1101px) and (max-height:780px){.main{grid-template-rows:92px minmax(0,1fr)!important}.intro h1{font-size:24px!important}.task-circle{width:138px!important;height:138px!important}.holo-platform{height:66px}.panel-header{height:44px!important}.mecha-metrics{grid-row:2;height:58px}}

/* 2026-07-04 最近历史记录区域修复：利用任务面板下方空白区域显示最近记录 */
@media (min-width:1101px){
  .panel-task>.panel-body{display:flex!important;flex-direction:column!important;min-height:0!important;overflow:hidden!important;}
  #tab-current.tab-content.active{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;}
  .current-task-card{flex:0 0 auto!important;min-height:270px!important;height:auto!important;}
  .current-history-wrap{display:block!important;flex:1 1 auto!important;min-height:170px!important;margin-top:10px!important;border:1px solid rgba(22,224,208,.20)!important;border-radius:8px!important;background:rgba(0,8,12,.58)!important;overflow:hidden!important;}
  .current-history-head{height:42px!important;padding:0 14px!important;display:flex!important;align-items:center!important;border-bottom:1px solid rgba(22,224,208,.16)!important;background:linear-gradient(90deg,rgba(22,224,208,.08),transparent)!important;color:#bdfdf7!important;font-weight:700!important;}
  .history-table-inline{display:block!important;height:calc(100% - 42px)!important;max-height:none!important;overflow:auto!important;}
  .history-table-inline .table{width:100%!important;table-layout:fixed!important;}
  .history-table-inline th,.history-table-inline td{padding:10px 8px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:12px!important;}
  .history-table-inline th:nth-child(1){width:16%!important}.history-table-inline th:nth-child(2){width:25%!important}.history-table-inline th:nth-child(3),.history-table-inline th:nth-child(4),.history-table-inline th:nth-child(5){width:11%!important}.history-table-inline th:nth-child(6){width:26%!important}
}
@media (max-width:1100px){
  .current-history-wrap{display:block!important;margin-top:12px!important;}
  .history-table-inline{overflow-x:auto!important;}
}

/* 实时检测状态信息 */
.task-status-line{margin-top:14px;display:flex;align-items:center;gap:9px;min-height:24px;padding:8px 11px;border-left:2px solid var(--primary,#16e0d0);background:linear-gradient(90deg,rgba(22,224,208,.10),transparent);font-size:12px;letter-spacing:.6px;color:var(--primary,#16e0d0);overflow:hidden}
.task-status-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:taskStatusPulse 1.25s ease-out infinite}
.task-status-line.is-finished{color:#39e7a5;border-left-color:#39e7a5;background:linear-gradient(90deg,rgba(57,231,165,.10),transparent)}
#taskStatusText.status-flip{animation:taskStatusFlip .34s ease}
@keyframes taskStatusPulse{0%{box-shadow:0 0 0 0 currentColor;opacity:1}70%{box-shadow:0 0 0 8px transparent;opacity:.72}100%{box-shadow:0 0 0 0 transparent;opacity:1}}
@keyframes taskStatusFlip{0%{opacity:0;transform:translateY(6px);filter:blur(3px)}100%{opacity:1;transform:translateY(0);filter:blur(0)}}