/* Q-Edu Styles */
:root {
  --navy:#1B3A6B; --navy-mid:#2D5AA0; --navy-lt:#EBF0F8; --navy-sub:#F4F6FB;
  --purple:#5A3FA0; --purple-lt:#F0EBF8;
  --teal:#0D7377; --teal-lt:#E5F4F4;
  --green:#276749; --green-lt:#EBF5EE;
  --amber:#92580A; --amber-lt:#FEF5E7;
  --red:#A31515; --red-lt:#FEF0F0;
  --bg:#EFF1F5; --white:#FFFFFF; --surf:#F7F8FB; --surface:#F7F8FB; --surf3:#DDE1E8;
  --navy-xs:#EBF0F8;
  --b1:#DDE1E8; --b2:#C5CAD4;
  --t9:#0F172A; --t7:#2D3748; --t5:#64748B; --t3:#94A3B8;
  --serif:'Crimson Pro',Georgia,serif;
  --sans:'Inter',system-ui,sans-serif;
  --mono:'JetBrains Mono','Courier New',monospace;
  --fs-base:15px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--t9);font-family:var(--sans);font-size:var(--fs-base);}
body{transform-origin:top left;will-change:transform;}
body.page-scaled{position:relative;}

/* ── HEADER ── */
header{height:48px;background:var(--navy);display:flex;align-items:center;padding:0 16px;gap:0;border-bottom:1px solid rgba(0,0,0,.18);}
.logo{font-family:var(--serif);font-size:21px;font-weight:600;color:#fff;letter-spacing:.5px;margin-right:24px;display:flex;align-items:center;gap:9px;}
.logo-ring{width:26px;height:26px;border:1.5px solid rgba(255,255,255,.45);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.9);}
.ntab{padding:5px 13px;border-radius:4px;cursor:pointer;font-size:0.93em;color:rgba(255,255,255,.6);transition:all .15s;}
.ntab:hover{color:#fff;background:rgba(255,255,255,.1);}
.ntab.on{color:#fff;background:rgba(255,255,255,.18);}
.ntabs{display:flex;gap:2px;flex:1;}
.hright{display:flex;align-items:center;gap:8px;}
.hdot{width:5px;height:5px;border-radius:50%;background:#4ADE80;}
.hbadge{display:flex;align-items:center;gap:4px;font-size:11px;color:rgba(255,255,255,.55);font-family:var(--mono);padding:3px 9px;border:1px solid rgba(255,255,255,.18);border-radius:3px;cursor:pointer;user-select:none;}
.hbadge:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.32);}
.hbtn{padding:5px 13px;border-radius:4px;font-size:0.93em;cursor:pointer;font-weight:600;transition:all .15s;border:1px solid rgba(255,255,255,.3);color:#fff;background:transparent;font-family:var(--sans);}
.hbtn:hover{background:rgba(255,255,255,.15);}
.hbtn.hi{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.4);}

/* ── MAIN LAYOUT ── */
:root{--c1:256px;--c3:340px;--r2:220px;--vv-c1:300px;--vv-c3:300px;--qv-c1:290px;--qv-c3:420px;}
#cv{display:grid;grid-template-columns:var(--c1) minmax(0,1fr) var(--c3);grid-template-rows:minmax(0,1fr) var(--r2);height:calc(100vh - 48px - 26px);position:relative;}
#vv{display:none;grid-template-columns:var(--vv-c1) minmax(0,1fr) var(--vv-c3);height:calc(100vh - 48px - 26px);position:relative;}
.panel{background:var(--white);border:1px solid var(--b1);overflow:hidden;}

/* ── DRAG HANDLES ── */
.rz{position:absolute;z-index:400;display:flex;align-items:center;justify-content:center;}
.rz-col{top:0;bottom:0;width:8px;cursor:col-resize;background:transparent;}
.rz-row{left:0;right:0;height:8px;cursor:row-resize;background:transparent;}
.rz-pip{background:var(--b2);border-radius:3px;transition:all .15s;}
.rz-col .rz-pip{width:3px;height:40px;}
.rz-row .rz-pip{height:3px;width:40px;}
.rz-col:hover .rz-pip,.rz-col.dragging .rz-pip{background:var(--navy);height:60px;width:4px;}
.rz-row:hover .rz-pip,.rz-row.dragging .rz-pip{background:var(--navy);width:60px;height:4px;}

/* ── BEGINNER GUIDE ── */
#guide-overlay{position:fixed;inset:0;background:rgba(226,232,240,.72);z-index:2000;display:none;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
#guide-overlay.on{display:flex;}
#guide-box{width:580px;max-height:84vh;background:#FFFFFF;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 32px rgba(27,58,107,.18),0 2px 8px rgba(27,58,107,.1),0 0 0 1px rgba(27,58,107,.08);}
.guide-hd{padding:0;display:flex;flex-direction:column;}
.guide-prog{display:flex;background:#F1F5FB;border-bottom:1px solid #DDE4F0;}
.guide-step-tab{flex:1;padding:10px 4px;text-align:center;font-size:11px;font-family:var(--mono);color:#94A3B8;cursor:pointer;transition:all .2s;border-bottom:2.5px solid transparent;letter-spacing:.6px;font-weight:500;}
.guide-step-tab:hover{color:var(--navy);background:#E6ECF7;}
.guide-step-tab.on{color:var(--navy);border-bottom-color:var(--navy);background:#E6ECF7;font-weight:600;}
.guide-body{flex:1;overflow-y:auto;padding:0;scrollbar-width:thin;background:#FFFFFF;}
.guide-slide{display:none;padding:28px 32px 20px;}
.guide-slide.on{display:block;}
.guide-icon{width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,#E6ECF7,#D0DDEF);border:1px solid #C5D4EE;display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:16px;box-shadow:0 2px 6px rgba(27,58,107,.1);}
.guide-title{font-family:var(--serif);font-size:24px;font-weight:600;color:#0F2347;margin-bottom:8px;letter-spacing:-.2px;}
.guide-desc{font-size:14px;color:#334155;line-height:1.75;margin-bottom:16px;}
.guide-tip{padding:11px 15px;background:#F0F6FF;border-left:3.5px solid #2563EB;border-radius:0 8px 8px 0;font-size:13px;color:#1E3A6B;margin-bottom:14px;line-height:1.65;}
.guide-tag{display:inline-block;background:#EBF0F8;border:1px solid #C5D4EE;border-radius:4px;padding:1px 7px;font-family:var(--mono);font-size:11px;color:var(--navy);margin:0 2px;}
.guide-steps{list-style:none;counter-reset:gs;margin-top:2px;}
.guide-steps li{counter-increment:gs;display:flex;gap:12px;align-items:flex-start;padding:9px 0;border-bottom:1px solid #EEF1F6;font-size:13.5px;color:#334155;line-height:1.55;}
.guide-steps li:last-child{border-bottom:none;}
.guide-steps li::before{content:counter(gs);min-width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-family:var(--mono);font-weight:600;flex-shrink:0;margin-top:1px;}
.guide-ft{padding:14px 22px;border-top:1px solid #EEF1F6;display:flex;align-items:center;justify-content:space-between;background:#F8FAFC;}
.guide-ft-note{font-size:11px;font-family:var(--mono);color:#94A3B8;}
.guide-no-show-lbl{display:flex;align-items:center;gap:5px;font-size:11px;font-family:var(--mono);color:#94A3B8;cursor:pointer;user-select:none;}
.guide-no-show-lbl input[type="checkbox"]{cursor:pointer;accent-color:var(--navy);width:13px;height:13px;}
.guide-no-show-lbl:hover{color:#64748B;}
/* ── CIRCUIT VALIDATION ── */
.ds.v-error{box-shadow:inset 0 0 0 1.5px #EF4444;background:rgba(239,68,68,.07);}
.ds.v-warning{box-shadow:inset 0 0 0 1.5px #F59E0B;background:rgba(245,158,11,.07);}
.v-badge{position:absolute;top:2px;right:2px;width:7px;height:7px;border-radius:50%;pointer-events:none;z-index:1;}
.v-badge.error{background:#EF4444;}
.v-badge.warning{background:#F59E0B;}
.cval-panel{margin:4px 8px 6px;border-radius:6px;overflow:hidden;font-size:11px;}
.cval-panel.hidden{display:none;}
.cval-panel.has-error{border:1px solid #FECACA;background:#FEF2F2;}
.cval-panel.has-warning{border:1px solid #FDE68A;background:#FFFBEB;}
.cval-panel.has-info{border:1px solid #BFDBFE;background:#EFF6FF;}
.cval-hdr{display:flex;align-items:center;gap:6px;padding:5px 10px;font-weight:600;font-family:var(--mono);}
.cval-panel.has-error .cval-hdr{color:#991B1B;}
.cval-panel.has-warning .cval-hdr{color:#92400E;}
.cval-panel.has-info .cval-hdr{color:#1E40AF;}
.cval-body{padding:0 10px 6px;display:flex;flex-direction:column;gap:2px;max-height:80px;overflow-y:auto;}
.cval-item{font-size:10.5px;font-family:var(--mono);padding:1px 0;line-height:1.5;}
.cval-item.error{color:#991B1B;}
.cval-item.warning{color:#92400E;}
.cval-item.info{color:#1E40AF;}
.guide-prev,.guide-next{padding:8px 20px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;border:1.5px solid;font-family:var(--sans);}
.guide-prev{border-color:#CBD5E1;color:#64748B;background:#FFFFFF;}
.guide-prev:hover{border-color:var(--navy);color:var(--navy);background:#F0F4FC;}
.guide-next{border-color:var(--navy);color:#fff;background:linear-gradient(135deg,var(--navy),var(--navy-mid));box-shadow:0 2px 6px rgba(27,58,107,.25);}
.guide-next:hover{box-shadow:0 4px 12px rgba(27,58,107,.35);transform:translateY(-1px);}
.guide-dots{display:flex;gap:7px;align-items:center;}
.guide-dot{width:8px;height:8px;border-radius:50%;background:#CBD5E1;cursor:pointer;transition:all .18s;border:1.5px solid transparent;}
.guide-dot:hover{background:#94A3B8;}
.guide-dot.on{background:var(--navy);border-color:rgba(27,58,107,.3);transform:scale(1.25);}
.ph{padding:7px 11px;border-bottom:1px solid var(--b1);font-size:11px;font-family:var(--mono);color:var(--t5);letter-spacing:1.2px;text-transform:uppercase;display:flex;align-items:center;justify-content:space-between;}

/* ── TOOLBAR ── */
#tb{grid-column:1;grid-row:1/3;overflow-y:auto;scrollbar-width:thin;}
.gcat{padding:10px 9px 4px;font-size:12px;font-family:var(--mono);font-weight:500;color:var(--t5);letter-spacing:1.5px;text-transform:uppercase;}
.ggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:0 8px 10px;}
.gi{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:7px 2px;border-radius:5px;cursor:grab;user-select:none;border:1px solid var(--b1);background:var(--surf);transition:all .15s;font-family:var(--mono);}
.gi:hover{border-color:var(--navy);background:var(--navy-lt);}
.gi:active{cursor:grabbing;transform:scale(.95);}
.gsym{font-size:1.1em;font-weight:500;line-height:1;margin-bottom:2px;}
.glbl{font-size:0.72em;color:var(--t5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
.gs .gsym{color:var(--navy);}
.gr .gsym{color:var(--purple);}
.gt .gsym{color:var(--teal);}
.gm .gsym{color:var(--amber);}
.plist{padding:0 7px 7px;}
.pbtn{display:block;width:100%;padding:7px 9px;margin-bottom:4px;border-radius:5px;border:1px solid var(--b1);background:var(--surf);color:var(--t7);font-size:0.79em;font-family:var(--mono);cursor:pointer;text-align:left;transition:all .15s;}
.pbtn:hover{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}

/* ── CIRCUIT ── */
#ca{grid-column:2;grid-row:1;display:flex;flex-direction:column;}
#cc{flex:1;overflow:auto;background:var(--white);scrollbar-width:thin;}
.ci{padding:14px 10px;min-height:100%;position:relative;
  background-image:linear-gradient(var(--surf) 1px,transparent 1px),linear-gradient(90deg,var(--surf) 1px,transparent 1px);
  background-size:54px 54px;}
.circ-connector{position:absolute;width:2px;pointer-events:none;z-index:0;background:var(--teal);border-radius:1px;}
.qrow{display:flex;align-items:center;margin-bottom:7px;height:64px;}
.qlbl{width:52px;flex-shrink:0;text-align:right;padding-right:9px;font-family:var(--mono);font-size:15px;color:var(--t7);}
.qwire{flex:1;position:relative;height:52px;display:flex;align-items:center;}
.wl{position:absolute;left:0;right:0;top:50%;height:1px;background:var(--b2);transform:translateY(-50%);pointer-events:none;}
.ds{width:58px;height:52px;flex-shrink:0;margin:0 3px;border-radius:4px;border:1px dashed var(--b1);position:relative;z-index:1;display:flex;align-items:center;justify-content:center;transition:all .12s;cursor:pointer;background:var(--white);}
.ds.occ{border-style:solid;border-color:var(--b2);}
.ds.dov{border-color:var(--navy);background:var(--navy-lt);}
.gb{width:46px;height:46px;border-radius:5px;border:1.5px solid;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:15px;font-weight:500;position:relative;flex-direction:column;}
.gb.H{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}
.gb.X{border-color:#DC2626;color:#DC2626;background:#FEF2F2;}
.gb.Y{border-color:#D97706;color:#D97706;background:#FFFBEB;}
.gb.Z{border-color:#16A34A;color:#16A34A;background:#F0FDF4;}
.gb.S,.gb.T{border-color:var(--purple);color:var(--purple);background:var(--purple-lt);}
.gb.CNOT,.gb.CZ,.gb.SWAP{border-color:var(--teal);color:var(--teal);background:var(--teal-lt);}
.gb.Rx,.gb.Ry,.gb.Rz{border-color:var(--purple);color:var(--purple);background:var(--purple-lt);}
.gb.M{border-color:var(--amber);color:var(--amber);background:var(--amber-lt);}
.ptag{font-size:9px;color:var(--t5);margin-top:1px;}
.delg{position:absolute;top:-5px;right:-5px;width:13px;height:13px;border-radius:50%;background:var(--red);color:#fff;display:none;align-items:center;justify-content:center;font-size:9px;cursor:pointer;z-index:2;border:1.5px solid #fff;}
.ds.occ:hover .delg{display:flex;}
.editp{position:absolute;top:-5px;left:-5px;width:13px;height:13px;border-radius:50%;background:var(--navy);color:#fff;display:none;align-items:center;justify-content:center;font-size:9px;cursor:pointer;z-index:2;border:1.5px solid #fff;}
.ds.occ:hover .editp.has{display:flex;}

/* param popup */
.ppop{background:var(--white);border:1px solid var(--b2);border-radius:8px;padding:10px 12px;width:192px;z-index:9999;box-shadow:0 6px 20px rgba(0,0,0,.15);}
.ppop-label{font-size:10px;font-family:var(--mono);color:var(--t5);margin-bottom:6px;letter-spacing:.6px;}
.ppop-drag-area{background:var(--surf);border:1.5px solid var(--b1);border-radius:6px;padding:7px 10px;text-align:center;cursor:ew-resize;user-select:none;margin-bottom:8px;transition:border-color .12s;}
.ppop-drag-area:hover{border-color:var(--navy-mid);}
.ppop-dragging{border-color:var(--navy)!important;background:var(--navy-lt)!important;}
.ppop-drag-hint{font-size:10px;color:var(--t3);font-family:var(--mono);margin-bottom:2px;}
.ppop-val-big{font-family:var(--mono);font-size:24px;font-weight:600;color:var(--navy);line-height:1.1;}
.ppop-btn-row{display:flex;align-items:center;gap:5px;}
.ppop-arrow{width:28px;height:28px;border-radius:5px;border:1px solid var(--b2);background:var(--white);color:var(--navy);cursor:pointer;font-size:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s;font-family:var(--mono);}
.ppop-arrow:hover{background:var(--navy);color:#fff;border-color:var(--navy);}
.ppop-steps-grp{display:flex;gap:3px;flex:1;justify-content:center;}
.ppop-sz{padding:3px 6px;border-radius:4px;border:1px solid var(--b1);background:var(--white);color:var(--t5);font-size:10px;font-family:var(--mono);cursor:pointer;transition:all .12s;}
.ppop-sz:hover:not(.ppop-sz-on){background:var(--navy-lt);border-color:var(--navy);color:var(--navy);}
.ppop-sz-on{background:var(--navy)!important;border-color:var(--navy)!important;color:#fff!important;}
.ppop-confirm{width:100%;margin-top:8px;padding:5px;border-radius:5px;border:none;background:var(--navy);color:#fff;font-family:var(--sans);font-weight:600;font-size:12px;cursor:pointer;transition:background .12s;}
.ppop-confirm:hover{background:#122d5a;}

/* circuit footer */
#cf{border-top:1px solid var(--b1);padding:6px 11px;display:flex;align-items:center;gap:7px;background:var(--surf);flex-shrink:0;}
.cfb{padding:4px 11px;border-radius:4px;font-size:0.857em;cursor:pointer;font-weight:600;transition:all .15s;border:1px solid;font-family:var(--sans);}
.crun{border-color:var(--green);color:var(--green);background:var(--green-lt);}
.crun:hover{background:#D1FAE5;}
.cclr{border-color:var(--b2);color:var(--t5);background:var(--white);}
.cclr:hover{border-color:var(--t5);}
.ccod{border-color:var(--purple);color:var(--purple);background:var(--purple-lt);}
.ccod:hover{background:#E4D9F5;}
.cund{border-color:var(--b2);color:var(--t5);background:var(--white);}
.cund:hover{border-color:var(--navy);color:var(--navy);}
.cfstats{margin-left:auto;display:flex;gap:10px;font-size:12px;font-family:var(--mono);color:var(--t5);align-items:center;}
.qctrl{display:flex;align-items:center;gap:5px;}
.qb{width:19px;height:19px;border-radius:3px;border:1px solid var(--b2);background:var(--white);color:var(--t7);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;transition:all .12s;}
.qb:hover{border-color:var(--navy);color:var(--navy);}

/* ── STATE PANEL ── */
#sp{grid-column:3;grid-row:1/3;display:flex;flex-direction:column;overflow:hidden;}
#bloch-wrap{padding:0;flex-shrink:0;}
/* ── 多球网格布局 ── */
.bloch-multi-row{display:grid;gap:4px;padding:6px 8px 2px;}
.bloch-multi-row.pr-1{grid-template-columns:1fr;}
.bloch-multi-row.pr-2{grid-template-columns:1fr 1fr;}
.bloch-multi-row.pr-3{grid-template-columns:repeat(3,1fr);}
.bloch-multi-row.pr-4{grid-template-columns:repeat(4,1fr);}
.bloch-multi-row.pr-5{grid-template-columns:repeat(5,1fr);}
.bloch-sphere-slot{display:flex;flex-direction:column;align-items:center;cursor:pointer;border-radius:6px;padding:2px;transition:background .15s;position:relative;}
.bloch-sphere-slot:hover{background:var(--navy-xs);}
.bloch-sphere-slot.focused{background:var(--navy-lt);outline:1.5px solid var(--navy);outline-offset:-1px;}
.bloch-sphere-qlbl{font-size:10px;font-family:var(--mono);color:var(--t5);padding:0 0 2px;letter-spacing:.5px;font-weight:500;}
.bloch-sphere-slot.focused .bloch-sphere-qlbl{color:var(--navy);font-weight:700;}
.bloch-sphere-cv{display:block;cursor:grab;}
.bloch-sphere-cv:active{cursor:grabbing;}
/* 悬停放大按钮 */
.bloch-zoom-btn{position:absolute;top:4px;right:4px;width:18px;height:18px;border-radius:4px;background:var(--navy-lt);border:1px solid var(--b1);color:var(--navy);font-size:11px;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:2;transition:all .15s;}
.bloch-sphere-slot:hover .bloch-zoom-btn{display:flex;}
.bloch-zoom-btn:hover{background:var(--navy);color:#fff;}
/* ── Master-Detail Bloch layout (small / pr-2 mode) ── */
.bloch-multi-row.pr-2{display:block;padding:0;}
.bloch-md-hd{display:flex;align-items:center;justify-content:space-between;padding:5px 10px 3px;gap:6px;}
.bloch-md-active-tag{font-size:10px;font-family:var(--mono);color:var(--t3);letter-spacing:.3px;}
.bloch-md-active-tag strong{color:var(--navy);font-size:12px;font-weight:700;margin-left:3px;}
.bloch-md-zoom-btn{width:20px;height:20px;border-radius:4px;border:1px solid var(--b1);background:var(--navy-lt);color:var(--navy);font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;}
.bloch-md-zoom-btn:hover{background:var(--navy);color:#fff;}
.bloch-md-main-area{display:flex;justify-content:center;align-items:center;padding:2px 0 4px;}
.bloch-main-cv{display:block;cursor:grab;border-radius:8px;transition:opacity 0.09s ease;}
.bloch-main-cv:active{cursor:grabbing;}
.bloch-main-fading{opacity:0.15 !important;}
.bloch-md-thumbbar{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;padding:5px 8px 6px;border-top:1px solid var(--b1);background:var(--surf);}
.bloch-md-thumb{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;border-radius:6px;padding:3px 4px 4px;border:1.5px solid transparent;transition:all .12s;}
.bloch-md-thumb:hover{background:var(--navy-xs);border-color:var(--b1);}
.bloch-md-thumb.active{border-color:var(--navy);background:var(--navy-lt);}
.bloch-thumb-cv{display:block;border-radius:4px;}
.bloch-md-thumb-info{display:flex;flex-direction:column;align-items:center;gap:0px;}
.bloch-md-thumb-qlbl{font-size:9px;font-family:var(--mono);color:var(--t5);font-weight:600;line-height:1.3;}
.bloch-md-thumb.active .bloch-md-thumb-qlbl{color:var(--navy);}
.bloch-md-thumb-slbl{font-size:8px;font-family:var(--mono);color:var(--t3);line-height:1.2;}
/* ── Bloch 放大模态框 ── */
#bloch-zoom-overlay{position:fixed;inset:0;background:rgba(15,23,42,.72);z-index:2200;display:none;align-items:center;justify-content:center;backdrop-filter:blur(8px);}
#bloch-zoom-overlay.on{display:flex;}
.bloch-zoom-box{background:var(--white);border-radius:16px;padding:20px;box-shadow:0 8px 40px rgba(27,58,107,.22),0 2px 8px rgba(27,58,107,.12);display:flex;flex-direction:column;align-items:center;gap:12px;width:min(460px,90vw);}
.bloch-zoom-hd{display:flex;justify-content:space-between;align-items:center;width:100%;}
.bloch-zoom-nav{display:flex;align-items:center;gap:8px;}
.bloch-zoom-nav-btn{width:30px;height:30px;border-radius:7px;border:1px solid var(--b1);background:var(--surf);cursor:pointer;font-size:18px;color:var(--t5);transition:all .15s;display:flex;align-items:center;justify-content:center;font-family:serif;}
.bloch-zoom-nav-btn:hover{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}
.bloch-zoom-qlbl{font-size:17px;font-family:var(--mono);font-weight:700;color:var(--navy);min-width:36px;text-align:center;}
.bloch-zoom-hint{font-size:10px;font-family:var(--mono);color:var(--t3);flex:1;text-align:center;}
.bloch-zoom-close{width:28px;height:28px;border-radius:7px;border:1px solid var(--b1);background:var(--surf);cursor:pointer;font-size:13px;color:var(--t5);transition:all .15s;display:flex;align-items:center;justify-content:center;}
.bloch-zoom-close:hover{border-color:var(--red);color:var(--red);background:var(--red-lt);}
#bloch-zoom-cv{cursor:grab;display:block;border-radius:8px;}
#bloch-zoom-cv:active{cursor:grabbing;}
.bloch-zoom-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;width:100%;}
.bloch-zoom-stat{background:var(--surf);border:1px solid var(--b1);border-radius:7px;padding:7px 4px;text-align:center;}
.bloch-zoom-stat-lbl{font-size:10px;font-family:var(--mono);color:var(--t5);margin-bottom:2px;}
.bloch-zoom-stat-val{font-size:12px;font-family:var(--mono);color:var(--navy);font-weight:600;}
/* ── Bloch gallery (all-spheres expanded view) ── */
#bloch-gallery-overlay{position:fixed;inset:0;background:rgba(15,23,42,.76);z-index:2200;display:none;align-items:center;justify-content:center;backdrop-filter:blur(8px);}
#bloch-gallery-overlay.on{display:flex;}
.bloch-gallery-box{background:var(--white);border-radius:16px;padding:20px 24px;box-shadow:0 8px 40px rgba(27,58,107,.22),0 2px 8px rgba(27,58,107,.12);display:flex;flex-direction:column;align-items:stretch;gap:14px;width:min(92vw,860px);max-height:90vh;overflow:auto;}
.bloch-gallery-hd{display:flex;align-items:center;gap:10px;}
.bloch-gallery-title{font-size:13px;font-family:var(--mono);color:var(--navy);font-weight:700;letter-spacing:.4px;}
.bloch-gallery-hint{font-size:10px;color:var(--t3);font-family:var(--mono);flex:1;text-align:center;}
.bloch-gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;justify-items:center;}
.bloch-gallery-slot{display:flex;flex-direction:column;align-items:center;gap:4px;}
.bloch-gallery-qlbl{font-size:11px;font-family:var(--mono);color:var(--navy);font-weight:600;letter-spacing:.3px;}
.bloch-gallery-cv{display:block;cursor:grab;border-radius:8px;}
.bloch-gallery-cv:active{cursor:grabbing;}
.bloch-gallery-btn{padding:1px 6px;border-radius:3px;border:1px solid var(--b1);background:var(--white);color:var(--t5);font-size:13px;line-height:1.4;cursor:pointer;transition:all .12s;}
.bloch-gallery-btn:hover{border-color:var(--navy);color:var(--navy);}
.qsel-bar{display:flex;gap:4px;padding:5px 9px;border-top:1px solid var(--b1);}
.qsb{padding:2px 9px;border-radius:3px;font-size:10px;font-family:var(--mono);cursor:pointer;border:1px solid var(--b1);background:var(--surf);color:var(--t5);transition:all .12px;}
.qsb.on{background:var(--navy-lt);border-color:var(--navy);color:var(--navy);font-weight:500;}
.bstats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;padding:6px 9px;border-top:1px solid var(--b1);}
.bstats-2{grid-template-columns:repeat(4,1fr);padding-top:0;border-top:none;}
.bsc{padding:4px 5px;background:var(--surf);border-radius:4px;text-align:center;border:1px solid var(--b1);}
.bslbl{font-size:10px;font-family:var(--mono);color:var(--t5);}
.bsval{font-size:13px;font-family:var(--mono);color:var(--navy);font-weight:500;}
.bsval-sm{font-size:11px;}
.bloch-interp{display:flex;align-items:center;gap:7px;padding:5px 9px;border-top:1px solid var(--b1);background:var(--white);}
.bi-chip{padding:2px 9px;border-radius:10px;font-size:10px;font-family:var(--mono);font-weight:700;letter-spacing:.3px;white-space:nowrap;}
.bi-chip-0{background:#dcfce7;color:#166534;}
.bi-chip-1{background:#fee2e2;color:#991b1b;}
.bi-chip-sup{background:#dbeafe;color:#1e40af;}
.bi-chip-gen{background:var(--surf);color:var(--t5);border:1px solid var(--b1);}
.bi-desc{font-size:10px;color:var(--t3);font-family:var(--mono);line-height:1.4;}
.bloch-formula{padding:6px 9px 7px;font-family:var(--mono);font-size:11px;text-align:center;border-top:1px solid var(--b1);background:var(--surf);}
.bf-tmpl{color:var(--t4);font-size:11px;margin-bottom:3px;}
.bf-vals{font-size:11px;}
.bf-eq{color:var(--t5);}
.bf-coef{color:var(--navy);font-weight:600;}
.bf-ket{color:var(--purple);font-weight:500;}
.bf-phase{color:#7c3aed;font-weight:500;}
.bf-plus{color:var(--t5);}
.bf-hint{font-size:10px;color:var(--t3);margin-top:3px;letter-spacing:.3px;border-top:1px dashed var(--b1);padding-top:3px;}
.bloch-sz-ctrl{display:flex;align-items:center;justify-content:flex-end;gap:3px;padding:2px 6px 4px;background:var(--surf);border-top:1px solid var(--b1);}
.bloch-sz-lbl{font-size:10px;color:var(--t3);font-family:var(--mono);margin-right:3px;}
.bloch-sz-btn{padding:1px 7px;border-radius:3px;border:1px solid var(--b1);background:var(--white);color:var(--t5);font-size:10px;font-family:var(--mono);cursor:pointer;transition:all .12s;}
.bloch-sz-btn:hover{border-color:var(--navy);color:var(--navy);}
.bloch-sz-btn.on{background:var(--navy);border-color:var(--navy);color:#fff;}
#prob-sec{flex:1;overflow:hidden;border-top:1px solid var(--b1);display:flex;flex-direction:column;}
.prob-hdr{padding:5px 9px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;}
.prob-lbl{font-size:11px;font-family:var(--mono);color:var(--t5);letter-spacing:1px;text-transform:uppercase;}
#prob-cv{flex:1;display:block;width:100%;}
#sv-sec{border-top:1px solid var(--b1);padding:7px 9px;font-family:var(--mono);font-size:11px;background:var(--surf);flex-shrink:0;}
.sv-ttl{font-size:11px;color:var(--t5);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:4px;}
.svr{display:flex;align-items:center;gap:5px;padding:2px 0;border-bottom:1px solid var(--b1);}
.svb{color:var(--navy);font-weight:500;width:30px;}
.sva{color:var(--t7);flex:1;}
.svp{color:var(--t5);width:32px;text-align:right;}

/* ── AI TUTOR ── */
#at{grid-column:2;grid-row:2;display:flex;flex-direction:column;overflow:hidden;}
#aim{flex:1;overflow-y:auto;padding:7px 11px;display:flex;flex-direction:column;gap:5px;scrollbar-width:thin;}
.msg{display:flex;gap:7px;align-items:flex-start;animation:msgin .2s ease;}
@keyframes msgin{from{opacity:0;transform:translateY(3px)}to{opacity:1}}
.mav{width:22px;height:22px;border-radius:4px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-family:var(--mono);font-weight:500;border:1px solid;}
.mai .mav{background:var(--navy-lt);border-color:var(--navy);color:var(--navy);}
.mur .mav{background:var(--purple-lt);border-color:var(--purple);color:var(--purple);}
.mbody{flex:1;font-size:0.857em;line-height:1.55;padding:5px 9px;border-radius:5px;border:1px solid var(--b1);background:var(--surf);}
.mur{flex-direction:row-reverse;}
.mur .mbody{background:var(--purple-lt);border-color:rgba(90,63,160,.18);}
.fm{font-family:var(--mono);background:var(--navy-lt);border:1px solid var(--b1);padding:1px 5px;border-radius:3px;color:var(--navy);font-size:10px;}
.aityp{display:flex;gap:3px;align-items:center;padding:6px 9px;}
.aityp span{width:5px;height:5px;border-radius:50%;background:var(--t3);animation:bnc 1s ease infinite;}
.aityp span:nth-child(2){animation-delay:.15s;}
.aityp span:nth-child(3){animation-delay:.3s;}
@keyframes bnc{0%,60%,100%{transform:none}30%{transform:translateY(-4px)}}
#airw{border-top:1px solid var(--b1);padding:6px 9px;display:flex;gap:5px;align-items:center;background:var(--surf);flex-shrink:0;}
.chips{display:flex;gap:3px;flex-wrap:wrap;}
.chip{padding:2px 8px;border-radius:10px;border:1px solid var(--b1);background:var(--white);font-size:12px;cursor:pointer;color:var(--t7);transition:all .12s;white-space:nowrap;}
.chip:hover{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}
#aiinp{flex:1;background:var(--white);border:1px solid var(--b1);border-radius:4px;padding:5px 9px;font-size:12px;font-family:var(--sans);color:var(--t9);outline:none;transition:border-color .15s;}
#aiinp:focus{border-color:var(--navy);}
#aiinp::placeholder{color:var(--t3);}
#aisnd{width:28px;height:28px;border-radius:4px;border:none;background:var(--navy);color:#fff;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;}
#aisnd:hover{background:var(--navy-mid);}

/* ── VQE ── */
.vqecol{overflow-y:auto;padding:14px;background:var(--white);border:1px solid var(--b1);scrollbar-width:thin;}
.vqecol+.vqecol{border-left:none;}
.vh{font-family:var(--serif);font-size:20px;font-weight:600;color:var(--navy);margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--b1);}
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:12px;}
.mb{padding:7px;border-radius:4px;border:1px solid var(--b1);background:var(--surf);text-align:center;cursor:pointer;transition:all .15s;}
.mb:hover,.mb.on{border-color:var(--navy);background:var(--navy-lt);}
.mf{font-family:var(--mono);font-size:17px;font-weight:500;color:var(--navy);}
.ms{font-size:11px;color:var(--t5);margin-top:2px;font-family:var(--mono);}
.frow{display:flex;align-items:center;gap:7px;margin-bottom:7px;font-size:0.857em;color:var(--t7);}
.frow label{width:68px;font-family:var(--mono);font-size:12px;color:var(--t5);}
.frow input[type=range]{flex:1;}
.fval{font-family:var(--mono);font-size:11px;color:var(--navy);width:34px;text-align:right;}
.ecard{padding:11px;border-radius:5px;border:1px solid var(--b1);background:var(--navy-lt);text-align:center;margin:10px 0;}
.emain{font-family:var(--mono);font-size:24px;font-weight:600;color:var(--navy);}
.eunit{font-size:12px;color:var(--t5);margin-top:1px;font-family:var(--mono);}
.erow{display:flex;gap:10px;justify-content:center;margin-top:5px;font-size:10px;font-family:var(--mono);}
.eexact{color:var(--green);}
.eerr{color:var(--amber);}
.vrun{width:100%;padding:8px;border-radius:4px;border:none;background:var(--navy);color:#fff;font-family:var(--sans);font-weight:600;font-size:0.93em;cursor:pointer;transition:all .15s;margin-top:9px;}
.vrun:hover{background:var(--navy-mid);}
.vrun:disabled{opacity:.5;cursor:not-allowed;}
.ilog{margin-top:9px;max-height:110px;overflow-y:auto;font-family:var(--mono);font-size:11px;color:var(--t5);background:var(--surf);border-radius:4px;border:1px solid var(--b1);padding:7px;scrollbar-width:thin;}
.il{padding:1px 0;}
.ilc{color:var(--green);}
.vstg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin-bottom:10px;}
.vsc{padding:7px;background:var(--surf);border:1px solid var(--b1);border-radius:4px;text-align:center;}
.vsc .sv{font-family:var(--mono);font-size:20px;font-weight:600;color:var(--navy);}
.vsc .sl{font-size:11px;font-family:var(--mono);color:var(--t5);}
#vqecv{display:block;width:100%;}

/* ── VQE 3D Energy Landscape ── */
#vqe3d-wrap{
  position:relative;width:100%;height:260px;
  border-radius:6px;overflow:hidden;
  margin-bottom:10px;
  background:var(--surf);border:1px solid var(--b1);
  cursor:grab;
}
#vqe3d-wrap:active{cursor:grabbing;}
#vqe3dcv{display:block;width:100%;height:100%;}
#vqe3d-status{
  position:absolute;top:7px;left:8px;
  font:11px var(--mono);color:var(--t5);
  background:rgba(247,248,251,0.82);
  padding:2px 7px;border-radius:3px;
  pointer-events:none;
  max-width:calc(100% - 16px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#vqe3d-hint{
  position:absolute;bottom:6px;right:8px;
  font:10px var(--mono);color:var(--t4);
  pointer-events:none;opacity:0.55;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:calc(100% - 16px);
}
[data-theme="dark"] #vqe3d-status,[data-theme="aurora"] #vqe3d-status{background:rgba(15,25,45,0.80);color:#94A3B8;}
[data-theme="amber"] #vqe3d-status{background:rgba(10,12,16,0.82);color:#B49B7B;}
[data-theme="dark"] #vqe3d-wrap{background:#172135;border-color:rgba(148,163,184,0.12);}
[data-theme="aurora"] #vqe3d-wrap{background:#1C1248;border-color:rgba(155,127,255,0.14);}
[data-theme="amber"] #vqe3d-wrap{background:#13161c;border-color:rgba(255,176,92,.12);}
[data-theme="dark"] #vqe3d-hint,[data-theme="aurora"] #vqe3d-hint{color:#94A3B8;}
[data-theme="amber"] #vqe3d-hint{color:#B49B7B;}

.ansb{padding:9px;background:var(--surf);border:1px solid var(--b1);border-radius:4px;font-family:var(--mono);font-size:11px;color:var(--t7);line-height:1.9;}
.gtbl{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:11px;margin-top:7px;}
.gtbl td{padding:3px 5px;border-bottom:1px solid var(--b1);}
.gtbl td:first-child{color:var(--t5);}
.gtbl td:last-child{text-align:right;}
.bwarn{padding:7px 9px;background:var(--amber-lt);border:1px solid #F59E0B;border-radius:4px;font-size:11px;color:var(--amber);display:none;margin-top:7px;}
.exprow{display:flex;gap:5px;margin-top:9px;}
.expb{flex:1;padding:6px;border-radius:4px;border:1px solid;font-size:11px;cursor:pointer;font-family:var(--sans);font-weight:600;text-align:center;transition:all .15s;}
.eqk{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}
.emq{border-color:var(--teal);color:var(--teal);background:var(--teal-lt);}

/* ── CODE MODAL ── */
.mbg{position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:1000;display:none;align-items:center;justify-content:center;}
.mbg.op{display:flex;}
.modal{width:620px;max-height:76vh;background:var(--white);border-radius:8px;border:1px solid var(--b2);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 50px rgba(0,0,0,.15);}
.mhd{padding:12px 15px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;font-family:var(--serif);font-size:16px;font-weight:600;color:var(--navy);}
.mcls{cursor:pointer;color:var(--t3);font-size:18px;transition:color .15s;}
.mcls:hover{color:var(--t7);}
.mtbar{display:flex;padding:7px 11px;gap:4px;border-bottom:1px solid var(--b1);background:var(--surf);}
.mt{padding:3px 13px;border-radius:4px;font-size:12px;font-family:var(--mono);cursor:pointer;color:var(--t5);transition:all .12s;border:1px solid transparent;}
.mt.on{background:var(--navy-lt);color:var(--navy);border-color:var(--b1);}
.carea{flex:1;overflow-y:auto;padding:13px 15px;background:#FAFBFD;font-family:var(--mono);font-size:12px;line-height:1.7;}
.ck{color:#7C3AED;}.cf{color:#1D4ED8;}.cs{color:#15803D;}.cc{color:#94A3B8;font-style:italic;}.cn{color:#B45309;}
.mft{padding:8px 13px;border-top:1px solid var(--b1);display:flex;gap:7px;justify-content:flex-end;background:var(--surf);}
.cpybtn{padding:5px 14px;border-radius:4px;border:none;background:var(--navy);color:#fff;font-size:12px;cursor:pointer;font-weight:600;transition:all .15s;}
.cpybtn:hover{background:var(--navy-mid);}

/* ── STATUS ── */
#sb{height:26px;background:var(--navy);display:flex;align-items:center;padding:0 12px;gap:14px;font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.5);}
.sbi{display:flex;align-items:center;gap:4px;}
.sbd{width:5px;height:5px;border-radius:50%;}
.sg{background:#4ADE80;}.sb2{background:#60A5FA;}.sy{background:#FBBF24;}
#sbm{margin-left:auto;color:rgba(255,255,255,.7);}

/* ── DRAG GHOST ── */
#dg{position:fixed;pointer-events:none;z-index:9000;font-family:var(--mono);font-size:12px;font-weight:500;width:34px;height:34px;display:none;align-items:center;justify-content:center;border-radius:4px;border:1.5px solid var(--navy);background:var(--navy-lt);color:var(--navy);box-shadow:0 4px 12px rgba(27,58,107,.2);transform:translate(-50%,-50%);}

/* ══ THEME: DEEP SPACE (dark) ══ */
[data-theme="dark"] {
  --navy:#2A66C8; --navy-mid:#4A86E8; --navy-lt:rgba(74,134,232,.16); --navy-sub:rgba(74,134,232,.07);
  --purple:#9B7FD4; --purple-lt:rgba(155,127,212,.15);
  --teal:#14B8A6; --teal-lt:rgba(20,184,166,.12);
  --green:#22C55E; --green-lt:rgba(34,197,94,.12);
  --amber:#F59E0B; --amber-lt:rgba(245,158,11,.12);
  --red:#EF4444; --red-lt:rgba(239,68,68,.12);
  --bg:#0F172A; --white:#1E293B; --surf:#172135; --surface:#172135; --surf3:#1E3251;
  --navy-xs:rgba(42,102,200,.12);
  --b1:#1E3251; --b2:#2A4268;
  --t9:#F1F5F9; --t7:#CBD5E1; --t5:#94A3B8; --t3:#475569;
}
[data-theme="dark"] header,[data-theme="dark"] #sb{background:#080E1E;border-color:rgba(255,255,255,.06);}
[data-theme="dark"] .intro-hero{background:linear-gradient(135deg,#050C1C 0%,#0C1E3F 55%,#1A3570 100%);}
[data-theme="dark"] .theme-pick-hd{background:linear-gradient(135deg,#050C1C,#0F2050);}

/* ══ THEME: QUANTUM AURORA (purple) ══ */
[data-theme="aurora"] {
  --navy:#9B7FFF; --navy-mid:#B49FFF; --navy-lt:rgba(155,127,255,.16); --navy-sub:rgba(155,127,255,.07);
  --purple:#E879F9; --purple-lt:rgba(232,121,249,.14);
  --teal:#22D3EE; --teal-lt:rgba(34,211,238,.12);
  --green:#34D399; --green-lt:rgba(52,211,153,.12);
  --amber:#FB923C; --amber-lt:rgba(251,146,60,.12);
  --red:#F87171; --red-lt:rgba(248,113,113,.12);
  --bg:#0C0720; --white:#150D30; --surf:#1C1248; --surface:#1C1248; --surf3:#2C1D62;
  --navy-xs:rgba(155,127,255,.12);
  --b1:#2C1D62; --b2:#3C2878;
  --t9:#F0EAFF; --t7:#DDD6FE; --t5:#A78BFA; --t3:#6D28D9;
}
[data-theme="aurora"] header,[data-theme="aurora"] #sb{background:#07031A;border-color:rgba(155,127,255,.18);}
[data-theme="aurora"] .intro-hero{background:linear-gradient(135deg,#06011A 0%,#120838 55%,#211060 100%);}
[data-theme="aurora"] .theme-pick-hd{background:linear-gradient(135deg,#06011A,#150840);}

/* ══ SETTINGS MODAL ══ */
/* ══ SETTINGS MODAL ══ */
.settings-overlay{position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:2800;display:none;align-items:center;justify-content:center;backdrop-filter:blur(8px);}
.settings-overlay.on{display:flex;}
.settings-box{width:540px;max-height:90vh;background:var(--white);border-radius:14px;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.28),0 0 0 1px var(--b1);display:flex;flex-direction:column;}
.settings-hd{padding:0 20px;height:56px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-mid) 100%);}
.settings-hd-title{font-family:var(--serif);font-size:17px;font-weight:600;color:#fff;display:flex;align-items:center;gap:8px;}
.settings-hd-icon{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:14px;}
.settings-hd-close{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.12);border:none;color:rgba(255,255,255,.75);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s;}
.settings-hd-close:hover{background:rgba(255,255,255,.25);color:#fff;}
.settings-body{padding:22px 20px 28px;overflow-y:auto;scrollbar-width:thin;}
.settings-sec{margin-bottom:6px;}
.settings-sec-hd{display:flex;align-items:center;gap:7px;margin-bottom:14px;}
.settings-sec-icon{width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0;}
.settings-sec-icon.blue{background:var(--navy-lt);color:var(--navy);}
.settings-sec-icon.purple{background:var(--purple-lt);color:var(--purple);}
.settings-sec-icon.teal{background:var(--teal-lt);color:var(--teal);}
.settings-sec-icon.amber{background:var(--amber-lt);color:var(--amber);}
.settings-sec-icon.red{background:var(--red-lt);color:var(--red);}
.settings-sec-label{font-size:11px;font-family:var(--mono);color:var(--t5);letter-spacing:1.3px;text-transform:uppercase;margin:0;}
.settings-divider{height:1px;background:var(--b1);margin:20px 0;}
.settings-row{display:flex;align-items:center;justify-content:space-between;padding:9px 10px;border-radius:8px;margin-bottom:4px;gap:12px;transition:background .12s;}
.settings-row:hover{background:var(--surf);}
.settings-row-lbl{font-size:13px;color:var(--t9);font-weight:500;}
.settings-row-sub{font-size:10px;color:var(--t5);font-family:var(--mono);margin-top:2px;line-height:1.5;}
.seg-ctrl{display:flex;border:1px solid var(--b1);border-radius:7px;overflow:hidden;flex-shrink:0;background:var(--surf);}
.seg-btn{padding:5px 14px;font-size:12px;cursor:pointer;color:var(--t5);background:transparent;border:none;border-right:1px solid var(--b1);transition:all .14s;font-family:var(--sans);}
.seg-btn:last-child{border-right:none;}
.seg-btn:hover{background:var(--navy-lt);color:var(--navy);}
.seg-btn.on{background:var(--navy);color:#fff;font-weight:600;}
.tog-switch{width:40px;height:22px;border-radius:11px;background:var(--b2);cursor:pointer;position:relative;transition:background .22s;flex-shrink:0;border:none;}
.tog-switch.on{background:var(--navy);}
.tog-switch::after{content:'';position:absolute;width:16px;height:16px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .22s cubic-bezier(.34,1.56,.64,1);box-shadow:0 1px 4px rgba(0,0,0,.22);}
.tog-switch.on::after{transform:translateX(18px);}
.zoom-row{display:flex;align-items:center;gap:6px;width:200px;}
.zoom-slider{flex:1;accent-color:var(--navy);cursor:pointer;}
.zoom-badge{font-family:var(--mono);font-size:11px;color:#fff;min-width:40px;text-align:center;font-weight:700;background:var(--navy);border-radius:4px;padding:2px 5px;}
.zoom-step-btn{width:26px;height:26px;border-radius:5px;border:1px solid var(--b1);background:var(--surf);color:var(--t7);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .14s;line-height:1;}
.zoom-step-btn:hover{border-color:var(--navy);background:var(--navy-lt);color:var(--navy);}
.settings-action-btn{padding:6px 18px;border-radius:6px;font-size:12px;cursor:pointer;font-family:var(--sans);font-weight:600;transition:all .14s;border:1px solid var(--b1);background:var(--white);color:var(--t7);}
.settings-action-btn:hover{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}
.settings-action-btn.danger{border-color:rgba(163,21,21,.25);background:var(--red-lt);color:var(--red);}
.settings-action-btn.danger:hover{background:var(--red);color:#fff;border-color:var(--red);}
.settings-about{background:linear-gradient(135deg,var(--navy-sub) 0%,var(--purple-lt) 100%);border:1px solid var(--b1);border-radius:10px;padding:14px 16px;text-align:center;}
.settings-about-name{font-family:var(--serif);font-size:15px;font-weight:600;color:var(--navy);margin-bottom:4px;}
.settings-about-ver{display:inline-block;font-family:var(--mono);font-size:11px;background:var(--navy);color:#fff;border-radius:3px;padding:1px 6px;margin-bottom:8px;}
.settings-about-line{font-size:11px;font-family:var(--mono);color:var(--t5);line-height:2;}
.th-card.on::after{content:'✓';position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;background:var(--navy);color:#fff;font-size:10px;font-weight:700;line-height:18px;text-align:center;}
.th-prev{position:relative;}
.no-anim *{transition:none!important;animation:none!important;}
.th-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.th-card{border:2px solid var(--b1);border-radius:8px;overflow:hidden;cursor:pointer;transition:all .18s;position:relative;}
.th-card:hover{border-color:var(--b2);transform:translateY(-2px);}
.th-card.on{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy);}
.th-prev{height:68px;position:relative;overflow:hidden;}
.th-prev-bar{position:absolute;top:0;left:0;right:0;height:9px;}
.th-prev-body{position:absolute;top:9px;inset:9px 0 0 0;display:flex;gap:2px;padding:3px;}
.th-prev-sb{width:20px;height:100%;border-radius:2px;}
.th-prev-cn{flex:1;height:100%;border-radius:2px;}
.th-prev-rp{width:16px;height:100%;border-radius:2px;}
.th-info{padding:7px 9px;background:var(--surf);}
.th-name{font-size:12px;font-weight:600;color:var(--t9);margin-bottom:1px;}
.th-desc{font-size:9px;color:var(--t5);font-family:var(--mono);}
.th-card.on .th-info{background:var(--navy-lt);}
.th-card.on .th-name{color:var(--navy);}

/* ══ THEME PICKER (first visit) ══ */
.tp-overlay{position:fixed;inset:0;z-index:4500;background:rgba(8,14,35,.92);backdrop-filter:blur(12px);display:none;align-items:center;justify-content:center;}
.tp-overlay.on{display:flex;}
.tp-box{width:560px;background:var(--white);border-radius:16px;overflow:hidden;box-shadow:0 28px 70px rgba(0,0,0,.45);}
.tp-hd{padding:30px 34px 22px;text-align:center;background:linear-gradient(135deg,#0F2347,#2D5AA0);}
.tp-hd-icon{font-size:32px;margin-bottom:10px;display:block;}
.tp-hd-title{font-family:var(--serif);font-size:24px;font-weight:600;color:#fff;margin-bottom:6px;}
.tp-hd-sub{font-size:13px;color:rgba(255,255,255,.58);}
.tp-body{padding:24px 28px;}
.tp-hint{font-size:10px;font-family:var(--mono);color:var(--t5);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:14px;text-align:center;}
.tp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:8px;}
.tp-card{border:2px solid var(--b1);border-radius:10px;overflow:hidden;cursor:pointer;transition:all .18s;}
.tp-card:hover{border-color:var(--b2);transform:translateY(-2px);}
.tp-card.on{border-color:var(--navy);box-shadow:0 0 0 2px var(--navy-lt),0 6px 18px rgba(0,0,0,.15);}
.tp-card-prev{height:80px;position:relative;overflow:hidden;}
.tp-card-bar{position:absolute;top:0;left:0;right:0;height:10px;}
.tp-card-body{position:absolute;top:10px;inset:10px 0 0 0;display:flex;gap:3px;padding:3px;}
.tp-card-sb{width:22px;height:100%;border-radius:2px;}
.tp-card-cn{flex:1;height:100%;border-radius:2px;}
.tp-card-rp{width:18px;height:100%;border-radius:2px;}
.tp-card-info{padding:9px 11px;background:var(--surf);}
.tp-card-name{font-size:12px;font-weight:600;color:var(--t9);margin-bottom:2px;}
.tp-card-desc{font-size:10px;color:var(--t5);}
.tp-card.on .tp-card-info{background:var(--navy-lt);}
.tp-card.on .tp-card-name{color:var(--navy);}
.tp-foot{padding:0 28px 26px;display:flex;justify-content:center;}
.tp-confirm{padding:10px 36px;border-radius:24px;border:none;background:linear-gradient(135deg,var(--navy),var(--navy-mid));color:#fff;font-size:14px;font-weight:600;cursor:pointer;font-family:var(--sans);box-shadow:0 3px 12px rgba(0,0,0,.25);transition:all .16s;}
.tp-confirm:hover{box-shadow:0 6px 20px rgba(0,0,0,.35);transform:translateY(-1px);}

::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--b2);border-radius:2px;}

/* ── AUTH MODAL ── */
.auth-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:3000;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.auth-overlay.on{display:flex;}
.auth-box{width:380px;background:var(--white);border-radius:12px;overflow:hidden;box-shadow:0 8px 32px rgba(27,58,107,.22),0 0 0 1px rgba(27,58,107,.08);}
.auth-hd{padding:22px 24px 0;}
.auth-logo{font-family:var(--serif);font-size:20px;font-weight:600;color:var(--navy);margin-bottom:3px;}
.auth-sub{font-size:12px;color:var(--t5);}
.auth-tabs{display:flex;padding:16px 24px 0;border-bottom:1px solid var(--b1);margin-top:14px;}
.auth-tab{padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;color:var(--t5);border-bottom:2px solid transparent;transition:all .15s;margin-bottom:-1px;}
.auth-tab.on{color:var(--navy);border-bottom-color:var(--navy);}
.auth-body{padding:20px 24px 24px;}
.auth-form-pane{display:none;}.auth-form-pane.on{display:block;}
.auth-field{margin-bottom:13px;}
.auth-field label{display:block;font-size:10px;font-family:var(--mono);color:var(--t5);margin-bottom:5px;letter-spacing:.5px;text-transform:uppercase;}
.auth-field input{width:100%;padding:8px 11px;border-radius:5px;border:1px solid var(--b1);font-size:13px;font-family:var(--sans);color:var(--t9);outline:none;transition:border-color .15s;background:var(--white);}
.auth-field input:focus{border-color:var(--navy);}
.auth-err{font-size:11px;color:var(--red);margin-bottom:10px;display:none;padding:7px 10px;background:var(--red-lt);border-radius:4px;border:1px solid rgba(163,21,21,.15);}
.auth-submit{width:100%;padding:9px;border-radius:5px;border:none;background:var(--navy);color:#fff;font-size:13px;font-weight:600;cursor:pointer;font-family:var(--sans);transition:all .15s;margin-top:4px;}
.auth-submit:hover{background:var(--navy-mid);}

/* ── PROFILE MODAL ── */
.profile-overlay{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:2500;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.profile-overlay.on{display:flex;}
.profile-box{width:580px;max-height:82vh;background:var(--white);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 40px rgba(27,58,107,.2),0 0 0 1px rgba(27,58,107,.08);}
.profile-hd{padding:13px 18px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;background:var(--navy);color:#fff;}
.profile-hd-left{display:flex;flex-direction:column;gap:2px;}
.profile-hd-title{font-family:var(--serif);font-size:17px;font-weight:600;}
.profile-hd-sub{font-size:10px;opacity:.6;font-family:var(--mono);}
.profile-tabs{display:flex;border-bottom:1px solid var(--b1);background:var(--surf);}
.profile-tab{padding:10px 18px;font-size:12px;font-weight:600;cursor:pointer;color:var(--t5);border-bottom:2px solid transparent;transition:all .15s;}
.profile-tab.on{color:var(--navy);border-bottom-color:var(--navy);background:var(--white);}
.profile-content{flex:1;overflow-y:auto;scrollbar-width:thin;}
.profile-pane{display:none;padding:12px;}.profile-pane.on{display:block;}
.circ-card{border:1px solid var(--b1);border-radius:6px;padding:10px 12px;margin-bottom:8px;display:flex;align-items:center;gap:10px;background:var(--surf);transition:all .15s;}
.circ-card:hover{border-color:var(--b2);}
.circ-icon{width:36px;height:36px;border-radius:5px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;font-weight:600;flex-shrink:0;}
.circ-info{flex:1;min-width:0;}
.circ-name{font-size:13px;font-weight:600;color:var(--t9);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.circ-meta{font-size:10px;font-family:var(--mono);color:var(--t5);}
.circ-actions{display:flex;gap:5px;flex-shrink:0;}
.circ-btn{padding:4px 10px;border-radius:4px;font-size:11px;cursor:pointer;font-weight:600;border:1px solid;font-family:var(--sans);transition:all .15s;}
.circ-load{border-color:var(--navy);color:var(--navy);background:var(--navy-lt);}
.circ-load:hover{background:var(--navy);color:#fff;}
.circ-del{border-color:var(--b2);color:var(--t5);background:var(--white);}
.circ-del:hover{border-color:var(--red);color:var(--red);}
.hist-row{padding:8px 10px;border-bottom:1px solid var(--b1);display:flex;align-items:center;gap:10px;font-size:12px;}
.hist-row:last-child{border-bottom:none;}
.hist-time{font-family:var(--mono);font-size:10px;color:var(--t5);width:100px;flex-shrink:0;}
.hist-name{flex:1;color:var(--t7);font-size:12px;}
.hist-badge{padding:2px 7px;border-radius:3px;font-size:9px;font-family:var(--mono);font-weight:500;flex-shrink:0;}
.hist-sim{background:var(--green-lt);color:var(--green);}
.hist-save{background:var(--navy-lt);color:var(--navy);}
.profile-empty{text-align:center;padding:40px 20px;color:var(--t5);font-size:13px;line-height:1.7;}
.profile-empty-icon{font-size:34px;margin-bottom:10px;}

/* ── SAVE CIRCUIT DIALOG ── */
.save-overlay{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:3100;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.save-overlay.on{display:flex;}
.save-box{width:340px;background:var(--white);border-radius:10px;overflow:hidden;box-shadow:0 8px 32px rgba(27,58,107,.18);}
.save-hd{padding:14px 18px;border-bottom:1px solid var(--b1);font-family:var(--serif);font-size:16px;font-weight:600;color:var(--navy);}
.save-body{padding:16px 18px;}
.save-note{font-size:12px;color:var(--t5);margin-bottom:12px;}
.save-ft{padding:0 18px 16px;display:flex;gap:7px;justify-content:flex-end;}
.save-cancel{padding:6px 14px;border-radius:5px;border:1px solid var(--b1);background:var(--white);color:var(--t5);cursor:pointer;font-size:12px;font-family:var(--sans);}
.save-confirm{padding:6px 14px;border-radius:5px;border:none;background:var(--navy);color:#fff;cursor:pointer;font-size:12px;font-weight:600;font-family:var(--sans);transition:all .15s;}
.save-confirm:hover{background:var(--navy-mid);}

/* ── INTRO OVERLAY ── */
.intro-overlay{position:fixed;inset:0;z-index:4000;display:none;align-items:center;justify-content:center;background:rgba(10,20,45,.82);backdrop-filter:blur(8px);}
.intro-overlay.on{display:flex;}
.intro-box{width:700px;max-height:90vh;background:var(--white);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(10,20,45,.35),0 0 0 1px rgba(27,58,107,.12);}
.intro-hero{background:linear-gradient(135deg,#0F2347 0%,#1B3A6B 55%,#2D5AA0 100%);padding:36px 40px 28px;position:relative;overflow:hidden;}
.intro-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 80% 50%,rgba(93,129,198,.22) 0%,transparent 70%);}
.intro-hero-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:20px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);font-size:10px;font-family:var(--mono);color:rgba(255,255,255,.7);letter-spacing:.8px;margin-bottom:14px;position:relative;}
.intro-hero-tag-dot{width:5px;height:5px;border-radius:50%;background:#4ADE80;animation:apulse 1.8s ease-in-out infinite;}
.intro-title{font-family:var(--serif);font-size:30px;font-weight:600;color:#fff;line-height:1.2;letter-spacing:-.3px;margin-bottom:10px;position:relative;}
.intro-title em{font-style:normal;color:#93C5FD;}
.intro-sub{font-size:14px;color:rgba(255,255,255,.65);line-height:1.7;max-width:520px;position:relative;}
.intro-orbs{position:absolute;right:36px;top:50%;transform:translateY(-50%);width:120px;height:120px;opacity:.18;pointer-events:none;}
.intro-body{padding:28px 40px 24px;overflow-y:auto;scrollbar-width:thin;flex:1;}
.intro-section-title{font-size:10px;font-family:var(--mono);color:var(--t5);letter-spacing:1.4px;text-transform:uppercase;margin-bottom:14px;}
.intro-what{font-size:14px;color:var(--t7);line-height:1.85;margin-bottom:24px;padding:16px 18px;background:var(--navy-sub);border-radius:8px;border-left:3px solid var(--navy-mid);}
.intro-what strong{color:var(--navy);font-weight:600;}
.intro-features{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:4px;}
.intro-feat{padding:13px 14px;border-radius:8px;border:1px solid var(--b1);background:var(--surf);transition:border-color .15s;}
.intro-feat:hover{border-color:var(--b2);}
.intro-feat-icon{font-size:20px;margin-bottom:7px;line-height:1;}
.intro-feat-name{font-size:12px;font-weight:600;color:var(--t9);margin-bottom:3px;font-family:var(--sans);}
.intro-feat-desc{font-size:11px;color:var(--t5);line-height:1.55;}
.intro-footer{padding:16px 40px 22px;border-top:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;background:var(--surf);flex-shrink:0;}
.intro-skip{font-size:11px;color:var(--t5);display:flex;align-items:center;gap:6px;cursor:default;}
.intro-skip input{cursor:pointer;}
.intro-skip label{cursor:pointer;user-select:none;}
.intro-cta{display:flex;gap:8px;}
.intro-btn-sec{padding:8px 18px;border-radius:20px;border:1px solid var(--b2);background:var(--white);color:var(--t5);font-size:13px;cursor:pointer;font-family:var(--sans);transition:all .15s;}
.intro-btn-sec:hover{border-color:var(--navy);color:var(--navy);}
.intro-btn-pri{padding:8px 22px;border-radius:20px;border:none;background:linear-gradient(135deg,var(--navy),var(--navy-mid));color:#fff;font-size:13px;font-weight:600;cursor:pointer;font-family:var(--sans);box-shadow:0 2px 8px rgba(27,58,107,.3);transition:all .15s;}
.intro-btn-pri:hover{box-shadow:0 4px 14px rgba(27,58,107,.4);transform:translateY(-1px);}

/* ══ QAOA VIEW ══ */
#qv{display:none;grid-template-columns:var(--qv-c1) minmax(0,1fr) var(--qv-c3);height:calc(100vh - 48px - 26px);position:relative;}
.qaoa-col{overflow-y:auto;padding:14px;background:var(--white);border:1px solid var(--b1);scrollbar-width:thin;}
.qaoa-col+.qaoa-col{border-left:none;}
/* ── QAOA EDGE PANEL ── */
.qaoa-ep{margin:7px 0;border:1px solid var(--b1);border-radius:6px;padding:7px 9px;background:var(--surf);}
.qaoa-ep-toolbar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:6px;}
.qaoa-ep-lbl{font-size:10px;font-family:var(--mono);color:var(--t5);white-space:nowrap;}
.qaoa-ep-dash{font-size:12px;color:var(--t5);}
.qaoa-ep-sel{font-size:11px;font-family:var(--mono);padding:2px 4px;border:1px solid var(--b1);border-radius:3px;background:var(--white);color:var(--t9);outline:none;max-width:72px;}
.qaoa-ep-sel:focus{border-color:var(--navy);}
.qaoa-del-node-btn{color:var(--red)!important;border-color:var(--red)!important;}
.qaoa-del-node-btn:hover{background:var(--red)!important;color:#fff!important;}
.qaoa-ep-edges{display:flex;flex-wrap:wrap;gap:4px;min-height:20px;}
.qaoa-ep-empty{font-size:10px;color:var(--t3);font-family:var(--mono);}
.qaoa-ep-chip{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:10px;background:var(--navy-lt);border:1px solid var(--b1);font-size:10px;font-family:var(--mono);color:var(--navy);transition:border-color .12s;}
.qaoa-ep-chip:hover{border-color:var(--navy-mid);}
.qaoa-ep-chip-del{cursor:pointer;color:var(--t3);font-size:13px;line-height:1;margin-left:1px;}
.qaoa-ep-chip-del:hover{color:var(--red);}
.qh{font-family:var(--serif);font-size:15px;font-weight:600;color:var(--t9);margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--b1);}
#qaoa-graph-cv{display:block;width:100%;border-radius:6px;border:1px solid var(--b1);cursor:crosshair;}
.qaoa-graph-ctrl{display:flex;gap:5px;margin:7px 0;}
.qgbtn{padding:4px 10px;border-radius:4px;font-size:11px;cursor:pointer;border:1px solid var(--b1);background:var(--surf);color:var(--t7);font-family:var(--sans);transition:all .15s;}
.qgbtn:hover{border-color:var(--navy);color:var(--navy);}
.qgbtn.active{background:var(--navy-lt);border-color:var(--navy);color:var(--navy);}
.qaoa-vstg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin-bottom:10px;}
.qaoa-sc{padding:7px;background:var(--surf);border:1px solid var(--b1);border-radius:4px;text-align:center;}
.qaoa-sc .sv{font-family:var(--mono);font-size:20px;font-weight:600;color:var(--navy);}
.qaoa-sc .sl{font-size:11px;font-family:var(--mono);color:var(--t5);}
.qrun{width:100%;padding:8px;border-radius:4px;border:none;background:var(--navy);color:#fff;font-family:var(--sans);font-weight:600;font-size:13px;cursor:pointer;transition:all .15s;margin-top:8px;}
.qrun:hover{background:var(--navy-mid);}
.qrun:disabled{opacity:.5;cursor:not-allowed;}
.qaoa-legend{display:flex;gap:10px;font-size:10px;font-family:var(--mono);color:var(--t5);margin-top:6px;}
.qaoa-legend span{display:flex;align-items:center;gap:4px;}
.qaoa-legend i{width:10px;height:10px;border-radius:2px;display:inline-block;}
.qaoa-info{font-size:11px;color:var(--t7);line-height:1.7;padding:8px;background:var(--surf);border:1px solid var(--b1);border-radius:4px;font-family:var(--mono);}
.qaoa-prob-hint{font-size:10px;font-family:var(--mono);color:var(--t3);text-align:right;margin-top:3px;letter-spacing:.5px;opacity:.8;}
/* ── QAOA PROB ZOOM ── */
#qaoa-zoom-overlay{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
#qaoa-zoom-overlay.on{display:flex;}
.qaoa-zoom-box{background:var(--white);border:1px solid var(--b1);border-radius:12px;padding:20px 22px 16px;box-shadow:0 24px 64px rgba(0,0,0,.35);max-width:min(860px,92vw);width:100%;}
.qaoa-zoom-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.qaoa-zoom-title{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--navy);}
.qaoa-zoom-close{width:30px;height:30px;border-radius:6px;border:1px solid var(--b1);background:var(--surf);cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.qaoa-zoom-close:hover{border-color:var(--navy);color:var(--navy);}
#qaoa-zoom-cv{display:block;width:100%;}
[data-theme="amber"] .qaoa-zoom-box{background:linear-gradient(180deg,#181b23,#0f1116);border-color:rgba(255,176,92,.18);}
/* ══ ALGORITHM LIBRARY ══ */
#lv{display:none;height:calc(100vh - 48px - 26px);overflow-y:auto;background:var(--bg);padding:20px 24px;scrollbar-width:thin;}
.algo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(256px,1fr));gap:16px;max-width:1100px;margin:0 auto;align-items:stretch;}
/* 卡片整体用 flex column，保证所有卡片内部结构对齐 */
.algo-card{background:var(--white);border:1px solid var(--b1);border-radius:10px;overflow:hidden;transition:all .18s;cursor:pointer;display:flex;flex-direction:column;}
.algo-card:hover{border-color:var(--navy);box-shadow:0 4px 16px rgba(27,58,107,.1);transform:translateY(-2px);}
/* 头部：固定高度 circuit 预览 + 标题行 */
.algo-card-header{padding:14px 16px 10px;border-bottom:1px solid var(--b1);flex-shrink:0;}
.algo-circuit{font-family:var(--mono);font-size:10px;color:var(--t7);background:var(--surf);border-radius:5px;padding:8px 10px;line-height:1.9;margin-bottom:8px;white-space:pre;height:58px;overflow:hidden;}
.algo-title-row{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;min-height:26px;}
.algo-name{font-family:var(--serif);font-size:15px;font-weight:600;color:var(--t9);white-space:nowrap;}
.algo-zh{font-size:10px;color:var(--t5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0;}
.diff-badge{padding:2px 7px;border-radius:10px;font-size:10px;font-weight:600;font-family:var(--mono);flex-shrink:0;}
.diff-green{background:var(--green-lt);color:var(--green);}
.diff-amber{background:var(--amber-lt);color:var(--amber);}
.diff-red{background:var(--red-lt);color:var(--red);}
/* 卡片体 flex column，让按钮始终贴底 */
.algo-card-body{padding:12px 16px 14px;display:flex;flex-direction:column;flex:1;}
.algo-desc{font-size:12px;color:var(--t7);line-height:1.7;margin-bottom:10px;flex:1;}
.algo-tags{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px;}
.algo-tag{padding:1px 7px;border-radius:3px;background:var(--navy-lt);color:var(--navy);font-size:10px;font-family:var(--mono);}
.algo-meta{display:flex;gap:10px;font-size:10px;font-family:var(--mono);color:var(--t5);margin-bottom:10px;}
/* 按钮行 */
.algo-btn-row{display:flex;gap:7px;margin-top:auto;}
.algo-load-btn{flex:1;padding:7px;border-radius:5px;border:1px solid var(--navy);background:var(--navy-lt);color:var(--navy);font-size:12px;font-weight:600;cursor:pointer;font-family:var(--sans);transition:all .15s;}
.algo-load-btn:hover{background:var(--navy);color:#fff;}
.algo-prev-btn{padding:7px 10px;border-radius:5px;border:1px solid var(--teal);background:var(--teal-lt);color:var(--teal);font-size:12px;font-weight:600;cursor:pointer;font-family:var(--sans);transition:all .15s;white-space:nowrap;}
.algo-prev-btn:hover{background:var(--teal);color:#fff;}
.algo-page-hd{max-width:1100px;margin:0 auto 18px;display:flex;align-items:baseline;gap:12px;}
.algo-page-title{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--t9);}
.algo-page-sub{font-size:13px;color:var(--t5);}
/* ══ ALGORITHM PREVIEW MODAL ══ */
.aprev-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:2000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s;}
.aprev-overlay.on{opacity:1;pointer-events:all;}
.aprev-box{background:var(--white);border-radius:14px;width:min(680px,95vw);max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.25);transform:translateY(12px);transition:transform .2s;}
.aprev-overlay.on .aprev-box{transform:translateY(0);}
.aprev-hd{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid var(--b1);flex-shrink:0;}
.aprev-hd-left{display:flex;align-items:center;gap:10px;}
.aprev-hd-name{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--t9);}
.aprev-hd-zh{font-size:12px;color:var(--t5);}
.aprev-close{background:none;border:none;font-size:20px;cursor:pointer;color:var(--t5);line-height:1;padding:2px 6px;border-radius:4px;}
.aprev-close:hover{background:var(--surf);color:var(--t9);}
.aprev-body{display:flex;gap:0;flex:1;overflow:hidden;}
.aprev-anim{flex:1;min-width:0;border-right:1px solid var(--b1);display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--surf);padding:16px;}
.aprev-anim canvas{border-radius:8px;display:block;}
.aprev-anim-ctrl{display:flex;gap:8px;margin-top:12px;}
.aprev-anim-btn{padding:5px 14px;border-radius:5px;border:1px solid var(--navy);background:var(--navy-lt);color:var(--navy);font-size:11px;font-family:var(--mono);cursor:pointer;transition:all .14s;}
.aprev-anim-btn:hover{background:var(--navy);color:#fff;}
.aprev-anim-btn.active{background:var(--navy);color:#fff;}
.aprev-spd{padding:5px 10px;border-color:var(--teal);color:var(--teal);background:var(--teal-lt);}
.aprev-spd:hover,.aprev-spd.active{background:var(--teal);color:#fff;border-color:var(--teal);}
.aprev-spd-sep{width:1px;height:20px;background:var(--b2);margin:0 4px;align-self:center;}
.aprev-info{width:220px;flex-shrink:0;padding:18px 16px;overflow-y:auto;display:flex;flex-direction:column;gap:14px;}
.aprev-info-sec{font-size:11px;color:var(--t7);line-height:1.75;}
.aprev-info-lbl{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--t5);text-transform:uppercase;letter-spacing:.8px;margin-bottom:4px;}
.aprev-steps{display:flex;flex-direction:column;gap:5px;}
.aprev-step{display:flex;gap:7px;font-size:11px;color:var(--t7);}
.aprev-step-num{width:18px;height:18px;border-radius:50%;background:var(--navy);color:#fff;font-size:9px;font-family:var(--mono);font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}
.aprev-ft{padding:12px 20px;border-top:1px solid var(--b1);display:flex;justify-content:flex-end;gap:8px;flex-shrink:0;}
.aprev-load-btn{padding:8px 20px;border-radius:6px;border:none;background:var(--navy);color:#fff;font-size:13px;font-weight:600;cursor:pointer;font-family:var(--sans);transition:background .15s;}
.aprev-load-btn:hover{background:#122d5a;}
/* ══ RIGHT PANEL TABS (Bloch / 密度矩阵 / 纠缠) ══ */
.sp-tabs{display:flex;border-bottom:1px solid var(--b1);flex-shrink:0;}
.sp-tab{padding:5px 12px;font-size:11px;font-family:var(--mono);cursor:pointer;color:var(--t5);border-bottom:2px solid transparent;transition:all .14s;}
.sp-tab.on{color:var(--navy);border-bottom-color:var(--navy);}
.sp-pane{display:none;flex:1;flex-direction:column;overflow-y:auto;overflow-x:hidden;min-height:0;}
.sp-pane.on{display:flex;}
#dm-wrap{flex:1;overflow-y:auto;padding:0 0 8px;scrollbar-width:thin;}
#dm-cv{display:block;margin:0 auto;}
/* 密度矩阵比特选择器 */
#dm-qsel-wrap{display:flex;align-items:center;gap:5px;padding:5px 8px;border-bottom:1px solid var(--b1);flex-shrink:0;flex-wrap:wrap;}
.dm-qsel-lbl{font-size:11px;font-family:var(--mono);color:var(--t5);}
.dm-qsel-hint{font-size:10px;font-family:var(--mono);color:var(--t3);}
#dm-qsel-bar{display:flex;gap:3px;flex-wrap:wrap;}
.dm-qsb{padding:2px 8px;border-radius:3px;font-size:11px;font-family:var(--mono);cursor:pointer;border:1px solid var(--b1);background:var(--surf);color:var(--t5);transition:all .12s;}
.dm-qsb.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600;}
.dm-qsb:hover:not(.on){border-color:var(--navy);color:var(--navy);}
/* 密度矩阵 Tooltip */
#dm-tooltip{position:fixed;background:var(--white);border:1px solid var(--b2);border-radius:7px;padding:9px 12px;font-family:var(--mono);font-size:11px;z-index:9999;box-shadow:0 4px 16px rgba(0,0,0,.15);min-width:170px;pointer-events:none;}
.dmt-title{font-weight:700;color:var(--navy);margin-bottom:6px;font-size:12px;}
.dmt-row{display:flex;justify-content:space-between;gap:16px;padding:2px 0;border-bottom:1px solid var(--b1);color:var(--t7);}
.dmt-row span:last-child{font-weight:600;color:var(--navy);}
.dmt-type{margin-top:6px;font-size:10px;color:var(--t5);font-style:italic;}
#ent-wrap{padding:6px 8px;border-top:1px solid var(--b1);flex-shrink:0;}
#ent-cv{display:block;width:100%;}
/* ══ SHARE MODAL ══ */
.share-modal{position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:1000;display:none;align-items:center;justify-content:center;}
.share-modal.op{display:flex;}
.share-box{width:500px;background:var(--white);border-radius:10px;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.18);}
.share-hd{padding:13px 18px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;font-family:var(--serif);font-size:16px;font-weight:600;color:var(--t9);}
.share-body{padding:16px 18px 20px;}
.share-note{font-size:12px;color:var(--t7);margin-bottom:12px;line-height:1.6;}
.share-url-row{display:flex;gap:6px;}
.share-url-inp{flex:1;padding:7px 10px;border-radius:5px;border:1px solid var(--b1);font-size:11px;font-family:var(--mono);color:var(--t7);background:var(--surf);outline:none;}
.share-copy-btn{padding:7px 14px;border-radius:5px;border:none;background:var(--navy);color:#fff;font-size:12px;font-weight:600;cursor:pointer;font-family:var(--sans);white-space:nowrap;}
.share-copy-btn:hover{background:var(--navy-mid);}
/* ══ STEP REPLAY ══ */
.creplay{border-color:var(--teal);color:var(--teal);background:var(--teal-lt);}
.creplay:hover{background:#C7EDED;}
.creplay.active{background:var(--teal);color:#fff;}
/* ── AI MASCOT ── */
.ai-mascot{width:66px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;padding:7px 0 4px;border-right:1px solid var(--surf3);background:linear-gradient(180deg,var(--navy-xs) 0%,var(--surface) 100%);gap:3px;}
.mascot-name{font-size:8px;font-family:var(--mono);color:var(--t5);letter-spacing:.5px;}
.mascot-status{font-size:8px;font-family:var(--mono);color:var(--green);background:var(--green-lt);padding:1px 6px;border-radius:8px;text-align:center;transition:all .3s;}
.mascot-status.thinking{color:var(--amber);background:var(--amber-lt);}
#mascot-svg{display:block;animation:mfloat 3.2s ease-in-out infinite;cursor:pointer;transition:transform .3s;}
#mascot-svg:hover{transform:scale(1.06)!important;}
@keyframes mfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.eye-group{animation:mblink 5s ease-in-out infinite;}
.eye-group.right{animation-delay:.07s;}
@keyframes mblink{0%,42%,58%,100%{transform:scaleY(1)}50%{transform:scaleY(0.06)}}
#ant-tip{animation:apulse 1.8s ease-in-out infinite;}
@keyframes apulse{0%,100%{opacity:1}50%{opacity:.3}}
.ai-body{flex:1;display:flex;flex-direction:column;overflow:hidden;}


/* ══ TWO-QUBIT GATE PICKER (双量子比特门目标选择器) ══ */
.tq-picker{position:fixed;background:var(--white);border:1px solid var(--b2);border-radius:6px;padding:8px 10px;z-index:9000;box-shadow:0 6px 20px rgba(0,0,0,.15);white-space:nowrap;min-width:130px;}
.tq-title{font-size:9px;font-family:var(--mono);color:var(--t5);margin-bottom:6px;letter-spacing:.5px;}
.tq-btn{display:inline-block;margin:2px;padding:4px 8px;border-radius:4px;border:1.5px solid var(--teal);background:var(--teal-lt);color:var(--teal);font-size:11px;font-family:var(--mono);cursor:pointer;font-weight:600;transition:all .12s;}
.tq-btn:hover{background:var(--teal);color:#fff;}
.tq-cancel{display:block;width:100%;margin-top:5px;padding:3px 0;border:none;background:none;font-size:10px;font-family:var(--mono);color:var(--t3);cursor:pointer;text-align:center;}
.tq-cancel:hover{color:var(--red);}

/* ══ CNOT CTRL/TGT 门样式区别 ══ */
.gb.CNOT.cnot-ctrl{border-style:solid;font-size:14px;}
.gb.CNOT.cnot-tgt{border-style:dashed;font-size:16px;}
.gb.CZ.cz-ctrl{border-style:solid;}

/* ═══════════════════════════════════════════════════════════════════
   Q-EDU 视觉重设计 · 四款全新主题
   ── 经典学院 (classic) · 梦幻紫 (dark) · 量子青 (aurora) · 暗金控制台 (amber)
   ═══════════════════════════════════════════════════════════════════ */

/* ── 渐变边框变量 (四套主题各自定义) ── */
:root {
  /* 经典学院: 海军蓝 */
  --grad-from:#2D5AA0; --grad-to:#1B3A6B;
  --gi-bg:#FFFFFF; --gi-bg2:#F0F4FC;
}
[data-theme="dark"]   { --grad-from:#7C3AED; --grad-to:#EC4899; --gi-bg:#FFFFFF; --gi-bg2:#FAF7FF; }
[data-theme="aurora"] { --grad-from:#06B6D4; --grad-to:#0EA5E9; --gi-bg:#FFFFFF; --gi-bg2:#F0FAFF; }
[data-theme="amber"]  { --grad-from:#F7A84D; --grad-to:#DE7D1F; --gi-bg:#2a231d; --gi-bg2:#1e1a14; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   主题2: 梦幻紫 (DREAM PURPLE) — "dark"
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
[data-theme="dark"]{
  --navy:#7C3AED;    --navy-mid:#9B5FF8;
  --navy-lt:rgba(124,58,237,.13); --navy-sub:rgba(124,58,237,.07); --navy-xs:rgba(124,58,237,.07);
  --purple:#EC4899;  --purple-lt:rgba(236,72,153,.12);
  --teal:#06B6D4;    --teal-lt:rgba(6,182,212,.10);
  --green:#10B981;   --green-lt:rgba(16,185,129,.10);
  --amber:#F59E0B;   --amber-lt:rgba(245,158,11,.10);
  --red:#EF4444;     --red-lt:rgba(239,68,68,.10);
  --bg:#F2EEFF; --white:#FFFFFF; --surf:#FAF7FF; --surface:#FAF7FF; --surf3:#EDE4FF;
  --b1:#D9CCFF; --b2:#BBA6F8;
  --t9:#1E0A4A; --t7:#38167A; --t5:#7040C0; --t3:#B49AE8;
}
[data-theme="dark"] header{background:linear-gradient(130deg,#1A0840 0%,#3A10A0 55%,#5A18C8 100%);border-color:rgba(139,92,246,.2);box-shadow:0 2px 18px rgba(26,8,64,.4);}
[data-theme="dark"] #sb{background:linear-gradient(to right,#0D0422 0%,#1A0840 100%);}
[data-theme="dark"] .intro-hero{background:linear-gradient(135deg,#1A0840 0%,#3A10A0 55%,#5A18C8 100%);}
[data-theme="dark"] .theme-pick-hd{background:linear-gradient(135deg,#1A0840,#3A10A0);}
[data-theme="dark"] .tp-hd{background:linear-gradient(135deg,#1A0840,#5A18C8);}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   主题3: 量子青 (QUANTUM CYAN) — "aurora"
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
[data-theme="aurora"]{
  --navy:#0EA5E9;    --navy-mid:#38BDF8;
  --navy-lt:rgba(14,165,233,.13); --navy-sub:rgba(14,165,233,.07); --navy-xs:rgba(14,165,233,.07);
  --purple:#6366F1;  --purple-lt:rgba(99,102,241,.12);
  --teal:#06B6D4;    --teal-lt:rgba(6,182,212,.10);
  --green:#10B981;   --green-lt:rgba(16,185,129,.10);
  --amber:#F59E0B;   --amber-lt:rgba(245,158,11,.10);
  --red:#EF4444;     --red-lt:rgba(239,68,68,.10);
  --bg:#EBF8FF; --white:#FFFFFF; --surf:#F0FAFF; --surface:#F0FAFF; --surf3:#D6F0FF;
  --b1:#BAE0FF; --b2:#7EC8F0;
  --t9:#082540; --t7:#0C3860; --t5:#1068A8; --t3:#60A8D8;
}
[data-theme="aurora"] header{background:linear-gradient(130deg,#062840 0%,#0A4880 55%,#1068B8 100%);border-color:rgba(14,165,233,.2);box-shadow:0 2px 18px rgba(6,40,64,.4);}
[data-theme="aurora"] #sb{background:linear-gradient(to right,#031220 0%,#062840 100%);}
[data-theme="aurora"] .intro-hero{background:linear-gradient(135deg,#062840 0%,#0A4880 55%,#1068B8 100%);}
[data-theme="aurora"] .theme-pick-hd{background:linear-gradient(135deg,#062840,#0A4880);}
[data-theme="aurora"] .tp-hd{background:linear-gradient(135deg,#062840,#1068B8);}

/* ═══════════════════════════════════════════
   全局视觉增强 (三套主题共用)
   ═══════════════════════════════════════════ */

/* ── 导航栏细节 ── */
.logo-ring{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.55);}
.ntab.on{background:rgba(255,255,255,.2);box-shadow:inset 0 -2px 0 rgba(255,255,255,.45);}
.hdot{background:#4ADE80;box-shadow:0 0 6px rgba(74,222,128,.5);}

/* ── 量子门卡片 — 渐变边框 ── */
.gi{
  border-radius:7px;
  padding:8px 4px;
  min-height:52px;
  overflow:hidden;
  border:2px solid transparent;
  background:
    linear-gradient(var(--gi-bg,#fff),var(--gi-bg2,#f4f5ff)) padding-box,
    linear-gradient(135deg,var(--grad-from,#4A6CF7),var(--grad-to,#7C3AED)) border-box;
  box-shadow:0 2px 8px rgba(0,0,0,.07);
  transition:all .22s cubic-bezier(.34,1.56,.64,1);
}
.gi:hover{
  transform:translateY(-3px) scale(1.04);
  border-color:transparent;
  background:
    linear-gradient(var(--navy-lt),var(--navy-lt)) padding-box,
    linear-gradient(135deg,var(--grad-from,#6B8EFF),var(--grad-to,#A570F8)) border-box;
  box-shadow:0 8px 24px rgba(0,0,0,.4),0 0 22px rgba(107,142,255,.22),0 0 0 1px rgba(107,142,255,.3);
}
/* 亮色主题 (梦幻紫/量子青) 取消发光阴影 */
[data-theme="dark"] .gi:hover,[data-theme="aurora"] .gi:hover{
  box-shadow:0 8px 20px rgba(0,0,0,.13);
}
.gi:active{transform:scale(.96);transition:transform .08s;}
.gsym{font-size:clamp(13px,1.2em,17px);font-weight:600;}
.glbl{font-size:clamp(9px,0.72em,11px);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
.gcat{padding-top:12px;font-weight:600;color:var(--t7);}

/* ── 预置线路按钮 ── */
.pbtn{
  border-radius:7px;
  background:linear-gradient(to bottom,var(--white),var(--surf));
  border-color:var(--b1);
}
.pbtn:hover{background:linear-gradient(to bottom,var(--navy-lt),var(--navy-lt));border-color:var(--navy);}

/* ── 面板与边框 ── */
.panel{box-shadow:0 2px 12px rgba(0,0,0,.06);border-color:var(--b1);}
.ph{
  background:linear-gradient(to right,var(--navy-lt),transparent);
  color:var(--navy);
  font-weight:600;
  letter-spacing:1.3px;
  border-bottom-color:var(--b1);
}

/* ── 电路画布 ── */
.ci{
  background-image:
    linear-gradient(var(--b1) 1px,transparent 1px),
    linear-gradient(90deg,var(--b1) 1px,transparent 1px);
}
.wl{height:1.5px;background:linear-gradient(to right,transparent,var(--b2) 10%,var(--b2) 90%,transparent);}
.ds.dov{border-color:var(--navy);background:var(--navy-lt);}
#cf{background:linear-gradient(to bottom,var(--white),var(--surf));border-top-color:var(--b1);}

/* ── 电路门格子 ── */
.gb{border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.09);}

/* ── 底部操作按钮 ── */
.crun{box-shadow:0 2px 8px rgba(39,103,73,.22);transition:all .18s;}
.crun:hover{box-shadow:0 4px 14px rgba(39,103,73,.35);transform:translateY(-1px);}
.ccod:hover,.cclr:hover,.cund:hover{transform:translateY(-1px);transition:all .15s;}
.creplay:hover{transform:translateY(-1px);transition:all .15s;}

/* ── 右侧状态面板 ── */
.sp-tab{font-weight:500;}
.sp-tab.on{background:var(--navy-lt);border-radius:4px 4px 0 0;}
.bsc{background:linear-gradient(to bottom,var(--white),var(--surf));box-shadow:0 1px 4px rgba(0,0,0,.06);}
.bsval{font-weight:600;}
.qsb.on{background:linear-gradient(135deg,var(--navy-lt),var(--navy-xs));border-color:var(--navy);}
.dm-qsb.on{background:var(--navy);border-color:var(--navy);}

/* ── AI助手区 ── */
.ai-mascot{background:linear-gradient(180deg,var(--navy-lt) 0%,transparent 100%);}
#aiinp{border-radius:18px;padding:6px 14px;}
#aiinp:focus{box-shadow:0 0 0 3px var(--navy-lt);}
#aisnd{border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.2);}
.chip{border-radius:12px;}
.chip:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.1);}
.mbody{border-radius:10px;border-color:var(--b1);background:linear-gradient(to bottom,var(--white),var(--surf));}
.mur .mbody{background:linear-gradient(to bottom,var(--purple-lt),rgba(255,255,255,.4));}

/* ── VQE / QAOA ── */
.ecard{background:linear-gradient(135deg,var(--navy-lt),var(--navy-xs));box-shadow:0 2px 8px rgba(0,0,0,.07);border-color:var(--b1);}
.mb:hover,.mb.on{border-color:var(--navy);background:var(--navy-lt);box-shadow:0 2px 8px rgba(0,0,0,.08);}
.vsc{background:linear-gradient(to bottom,var(--white),var(--surf));border-color:var(--b1);}
.qaoa-sc{background:linear-gradient(to bottom,var(--white),var(--surf));border-color:var(--b1);}

/* ── 算法库 ── */
.algo-card{border-radius:12px;border-color:var(--b1);transition:all .2s cubic-bezier(.34,1.56,.64,1);}
.algo-card:hover{box-shadow:0 8px 28px rgba(0,0,0,.13);transform:translateY(-4px);border-color:var(--navy);}
.algo-circuit{background:linear-gradient(to bottom,var(--surf),var(--white));}

/* ── 弹窗圆角优化 ── */
.modal{border-radius:12px;border-color:var(--b1);}
#guide-box{border-radius:18px;}
.settings-box{border-radius:16px;}
.auth-box{border-radius:14px;}
.profile-box{border-radius:14px;}
.aprev-box{border-radius:16px;}
.share-box{border-radius:12px;}
.save-box{border-radius:12px;}

/* ── 引导图标 ── */
.guide-icon{background:linear-gradient(135deg,var(--navy-lt),var(--navy-xs));border-color:var(--b1);}
.guide-next{background:linear-gradient(135deg,var(--navy),var(--navy-mid));}

/* ── 主题选择卡 (首次启动 & 设置) ── */
.tp-card.on{border-color:var(--navy);box-shadow:0 0 0 2px var(--navy-lt),0 6px 18px rgba(0,0,0,.12);}
.th-card.on{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy);}

/* ── 认证、分享、代码按钮 ── */
.auth-submit{background:linear-gradient(135deg,var(--navy),var(--navy-mid));}
.auth-submit:hover{background:var(--navy-mid);}
.share-copy-btn{background:linear-gradient(135deg,var(--navy),var(--navy-mid));}
.cpybtn{background:linear-gradient(135deg,var(--navy),var(--navy-mid));}
.tp-confirm{background:linear-gradient(135deg,var(--navy),var(--navy-mid));}

/* ── 滚动条适配新主题 ── */
::-webkit-scrollbar-thumb{background:var(--b2);}

/* ── 拖拽幽灵 ── */
#dg{border-color:var(--navy);background:var(--navy-lt);color:var(--navy);}

/* (默认主题 — 经典学院，直接使用原始 CSS 变量，无额外覆盖) */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   主题4: 暗金量子控制台 (AMBER QUANTUM CONSOLE) — "amber"
   黑曜石深色 + 暖琥珀金 + 精密仪器质感
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
[data-theme="amber"]{
  --navy:#F7A84D;    --navy-mid:#FFCC8A;
  --navy-lt:rgba(247,168,77,.14); --navy-sub:rgba(247,168,77,.08); --navy-xs:rgba(247,168,77,.06);
  --purple:#DE7D1F;  --purple-lt:rgba(222,125,31,.14);
  --teal:#C8903A;    --teal-lt:rgba(200,144,58,.14);
  --green:#4CAF72;   --green-lt:rgba(76,175,114,.15);
  --amber:#FFCC8A;   --amber-lt:rgba(255,204,138,.16);
  --red:#F07070;     --red-lt:rgba(240,112,112,.15);
  --bg:#0f1116; --white:#181b23; --surf:#1d2028; --surface:#1d2028; --surf3:#232833;
  --b1:rgba(255,176,92,.16); --b2:rgba(255,168,76,.30);
  --t9:#F4E6D2; --t7:#D8C4A8; --t5:#B49B7B; --t3:#7F6C56;
}
[data-theme="amber"] header{background:linear-gradient(180deg,#13151b 0%,#0b0c10 100%);border-color:rgba(255,176,92,.12);box-shadow:0 4px 20px rgba(0,0,0,.6),0 0 0 0.5px rgba(255,176,92,.08);}
[data-theme="amber"] #sb{background:linear-gradient(to right,#07080b 0%,#0d0f14 100%);}
[data-theme="amber"] .intro-hero{background:linear-gradient(135deg,#0d0e13 0%,#1a1409 55%,#2d1f0a 100%);}
[data-theme="amber"] .theme-pick-hd{background:linear-gradient(135deg,#0d0e13,#1a1409);}
[data-theme="amber"] .tp-hd{background:linear-gradient(135deg,#0d0e13,#2d1f0a);}

/* ── 暗金控制台: 元素级覆盖 ── */

/* body 背景: 黑曜石 + 暖金辉光 */
[data-theme="amber"] body{
  background:
    radial-gradient(circle at 12% 84%, rgba(255,145,40,.10), transparent 18%),
    radial-gradient(circle at 88% 22%, rgba(255,145,40,.07), transparent 16%),
    linear-gradient(180deg, #090a0d 0%, #0f1116 100%);
}

/* 面板: 炭灰金属底 */
[data-theme="amber"] .panel{
  background:linear-gradient(180deg,#181b23,#0f1116);
  border-color:rgba(255,176,92,.12);
  box-shadow:0 0 0 1px rgba(255,176,92,.06),0 14px 36px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,200,130,.03);
}

/* 面板标题条 */
[data-theme="amber"] .ph{
  background:linear-gradient(to right,rgba(255,168,76,.10),transparent);
  color:#FFCC8A;
  border-bottom-color:rgba(255,176,92,.10);
}

/* 电路画布区 */
[data-theme="amber"] #cc{background:#0d0f14;}
[data-theme="amber"] .ci{
  background-image:
    linear-gradient(rgba(255,176,92,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,176,92,.06) 1px, transparent 1px);
  background-size:54px 54px;
  background-color:#0d0f14;
}
[data-theme="amber"] .wl{background:linear-gradient(to right,transparent,rgba(255,176,92,.22) 10%,rgba(255,176,92,.22) 90%,transparent);}
[data-theme="amber"] .qlbl{color:#D8C4A8;font-weight:500;}

/* 量子门格子颜色 */
[data-theme="amber"] .gb{box-shadow:0 2px 8px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,200,130,.06);border-radius:8px;}
[data-theme="amber"] .gb.H{background:rgba(255,168,76,.12);border-color:#F7A84D;color:#FFCC8A;}
[data-theme="amber"] .gb.X,[data-theme="amber"] .gb.Y,[data-theme="amber"] .gb.Z{background:rgba(222,125,31,.12);border-color:#DE7D1F;color:#F7A84D;}
[data-theme="amber"] .gb.S,[data-theme="amber"] .gb.T{background:rgba(200,144,58,.12);border-color:#C8903A;color:#D8A84A;}
[data-theme="amber"] .gb.CNOT,[data-theme="amber"] .gb.CZ,[data-theme="amber"] .gb.SWAP{background:rgba(255,176,92,.10);border-color:#E8952A;color:#F7A84D;}
[data-theme="amber"] .gb.Rx,[data-theme="amber"] .gb.Ry,[data-theme="amber"] .gb.Rz{background:rgba(200,144,58,.12);border-color:#C8903A;color:#D8A84A;}
[data-theme="amber"] .gb.M{background:rgba(240,112,112,.12);border-color:#F07070;color:#F07070;}

/* 电路底部栏 */
[data-theme="amber"] #cf{background:linear-gradient(to bottom,#181b23,#131620);border-top-color:rgba(255,176,92,.10);}

/* 工具栏: 深黑金属左侧栏 */
[data-theme="amber"] #tb{background:linear-gradient(180deg,#13151b,#0b0c10);border-right:1px solid rgba(255,176,92,.10);}
[data-theme="amber"] .gcat{color:rgba(255,200,130,.50);font-size:11px;}
[data-theme="amber"] .pbtn{background:rgba(255,255,255,.04);border-color:rgba(255,176,92,.12);color:rgba(255,200,130,.70);}
[data-theme="amber"] .pbtn:hover{background:rgba(255,168,76,.08);border-color:rgba(255,168,76,.32);color:#FFCC8A;}

/* 门卡片 (工具栏内): 深炭琥珀 */
[data-theme="amber"] .gi{
  border:1.5px solid transparent;
  background:
    linear-gradient(180deg,#2a231d,#17181e) padding-box,
    linear-gradient(135deg,rgba(247,168,77,.65),rgba(222,125,31,.55)) border-box;
  box-shadow:0 4px 16px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,200,130,.06);
}
[data-theme="amber"] .gi:hover{
  border-color:transparent;
  background:
    linear-gradient(180deg,#332b20,#1d1f26) padding-box,
    linear-gradient(135deg,rgba(255,196,118,.85),rgba(247,168,77,.75)) border-box;
  box-shadow:0 8px 22px rgba(0,0,0,.5),0 0 20px rgba(255,140,40,.14),inset 0 1px 0 rgba(255,210,140,.10);
}
[data-theme="amber"] .gsym{color:#F4E6D2;font-weight:700;}
[data-theme="amber"] .glbl{color:rgba(200,160,90,.70);}

/* AI 助手区 */
[data-theme="amber"] #at{background:linear-gradient(180deg,#181b23,#0f1116);border-top:1px solid rgba(255,176,92,.10);}
[data-theme="amber"] #airw{background:#131620;border-top-color:rgba(255,176,92,.10);}
[data-theme="amber"] #aim{background:transparent;}
[data-theme="amber"] .mbody{
  background:linear-gradient(180deg,#1d2028,#181b23);
  border-color:rgba(255,176,92,.12);
  color:#D8C4A8;
  box-shadow:inset 0 1px 0 rgba(255,200,130,.04);
}
[data-theme="amber"] .mur .mbody{background:linear-gradient(180deg,rgba(255,168,76,.10),rgba(255,168,76,.06));border-color:rgba(255,176,92,.20);}
[data-theme="amber"] #aiinp{background:#13161c;border-color:rgba(255,176,92,.16);color:#F4E6D2;box-shadow:inset 0 1px 0 rgba(255,200,130,.03);}
[data-theme="amber"] #aiinp::placeholder{color:rgba(180,155,123,.45);}
[data-theme="amber"] #aiinp:focus{border-color:rgba(255,168,76,.32);box-shadow:0 0 0 4px rgba(255,140,40,.07),inset 0 1px 0 rgba(255,200,130,.04);}
[data-theme="amber"] #aisnd{background:linear-gradient(135deg,#FFCC8A,#DE7D1F);color:#1a1200;box-shadow:0 4px 14px rgba(222,125,31,.30);}

/* Chip 建议 */
[data-theme="amber"] .chip{background:rgba(255,255,255,.04);border-color:rgba(255,176,92,.14);color:#D8C4A8;}
[data-theme="amber"] .chip:hover{background:rgba(255,168,76,.10);border-color:rgba(255,168,76,.40);color:#FFCC8A;box-shadow:0 0 12px rgba(255,140,40,.10);}

/* AI 吉祥物 */
[data-theme="amber"] .ai-mascot{background:linear-gradient(180deg,rgba(255,168,76,.07) 0%,transparent 100%);border-right-color:rgba(255,176,92,.12);}

/* Bloch 球面板 */
[data-theme="amber"] .bsc{background:linear-gradient(180deg,#1d2028,#131620);border-color:rgba(255,176,92,.14);box-shadow:0 2px 8px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,200,130,.04);}
[data-theme="amber"] .bslbl{color:#7F6C56;}
[data-theme="amber"] .bsval{color:#F4E6D2;font-weight:700;}
[data-theme="amber"] .bloch-formula{background:#13161c;border-top-color:rgba(255,176,92,.10);}
[data-theme="amber"] .bloch-sz-btn{background:rgba(255,255,255,.04);border-color:rgba(255,176,92,.14);color:#B49B7B;}
[data-theme="amber"] .bloch-sz-btn.on{background:linear-gradient(135deg,#F7A84D,#DE7D1F);border-color:transparent;color:#0f1116;}
[data-theme="amber"] .bi-chip-0{background:rgba(76,175,114,.15);color:#4CAF72;}
[data-theme="amber"] .bi-chip-1{background:rgba(240,112,112,.15);color:#F07070;}
[data-theme="amber"] .bi-chip-sup{background:rgba(255,168,76,.15);color:#F7A84D;}

/* 多球 amber 主题 */
[data-theme="amber"] .bloch-sphere-slot:hover{background:rgba(255,176,92,.08);}
[data-theme="amber"] .bloch-sphere-slot.focused{background:rgba(255,176,92,.12);outline-color:rgba(247,168,77,.5);}
[data-theme="amber"] .bloch-sphere-qlbl{color:#7F6C56;}
[data-theme="amber"] .bloch-sphere-slot.focused .bloch-sphere-qlbl{color:#F7A84D;}
/* 量子态选择器 */
[data-theme="amber"] .qsel-bar{border-top-color:rgba(255,176,92,.12);}
[data-theme="amber"] .qsb{background:rgba(255,255,255,.04);border-color:rgba(255,176,92,.14);color:#7F6C56;}
[data-theme="amber"] .qsb.on{background:linear-gradient(135deg,rgba(255,168,76,.18),rgba(255,168,76,.10));border-color:#F7A84D;color:#FFCC8A;}

/* VQE / QAOA */
[data-theme="amber"] .vqecol,[data-theme="amber"] .qaoa-col{background:linear-gradient(180deg,#181b23,#0f1116);border-color:rgba(255,176,92,.12);}
[data-theme="amber"] .ecard{background:linear-gradient(135deg,rgba(255,168,76,.12),rgba(255,168,76,.06));border-color:rgba(255,176,92,.16);box-shadow:inset 0 1px 0 rgba(255,200,130,.04);}
[data-theme="amber"] .ilog{background:#13161c;border-color:rgba(255,176,92,.12);}
[data-theme="amber"] .ansb{background:#13161c;border-color:rgba(255,176,92,.12);}

/* 算法库 */
[data-theme="amber"] #lv{background:linear-gradient(180deg,#0d0f14,#0b0c10);}
[data-theme="amber"] .algo-card{background:linear-gradient(180deg,#181b23,#131620);border-color:rgba(255,176,92,.12);box-shadow:0 6px 20px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,200,130,.03);}
[data-theme="amber"] .algo-card:hover{border-color:rgba(255,176,92,.35);box-shadow:0 10px 28px rgba(0,0,0,.50),0 0 20px rgba(255,140,40,.10),inset 0 1px 0 rgba(255,200,130,.06);}
[data-theme="amber"] .algo-circuit{background:#13161c;color:#D8C4A8;}
[data-theme="amber"] .algo-name{color:#F4E6D2;}
[data-theme="amber"] .algo-desc{color:#D8C4A8;}
[data-theme="amber"] .algo-tag{background:rgba(255,168,76,.12);color:#F7A84D;border:1px solid rgba(255,168,76,.24);}

/* 弹窗 */
[data-theme="amber"] .modal{background:linear-gradient(180deg,#181b23,#131620);border-color:rgba(255,176,92,.14);}
[data-theme="amber"] .mhd{background:linear-gradient(180deg,#1d2028,#181b23);border-bottom-color:rgba(255,176,92,.10);color:#F4E6D2;}
[data-theme="amber"] .carea{background:#13161c;color:#D8C4A8;}
[data-theme="amber"] .mtbar{background:#13161c;border-bottom-color:rgba(255,176,92,.10);}
[data-theme="amber"] .mft{background:#131620;border-top-color:rgba(255,176,92,.10);}

/* 拖放槽 */
[data-theme="amber"] .ds{background:rgba(255,255,255,.02);border-color:rgba(255,176,92,.12);}
[data-theme="amber"] .ds.dov{background:rgba(255,168,76,.08);border-color:rgba(255,168,76,.40);box-shadow:0 0 10px rgba(255,140,40,.12);}

/* 运行按钮: 暖金渐变 */
[data-theme="amber"] .crun{
  background:linear-gradient(180deg,#6e4216,#3f2610);
  border:1px solid rgba(255,176,92,.34);
  color:#F6E2C6;
  box-shadow:0 0 0 1px rgba(255,176,92,.18),0 8px 20px rgba(0,0,0,.48),0 0 20px rgba(255,140,40,.10),inset 0 1px 0 rgba(255,220,170,.08);
}
[data-theme="amber"] .crun:hover{
  box-shadow:0 0 0 1px rgba(255,176,92,.28),0 10px 24px rgba(0,0,0,.52),0 0 28px rgba(255,140,40,.16),inset 0 1px 0 rgba(255,220,170,.10);
  transform:translateY(-1px);
}

/* 导航标签 */
[data-theme="amber"] .ntab.on{background:rgba(255,168,76,.14);box-shadow:inset 0 -2px 0 rgba(255,196,118,.50);}

/* 主题卡与设置卡 */
[data-theme="amber"] .tp-card.on{border-color:#F7A84D;box-shadow:0 0 0 2px rgba(247,168,77,.18),0 6px 18px rgba(0,0,0,.30);}
[data-theme="amber"] .th-card.on{border-color:#F7A84D;box-shadow:0 0 0 1px rgba(247,168,77,.28);}

/* 认证与操作按钮 */
[data-theme="amber"] .auth-submit,[data-theme="amber"] .share-copy-btn,[data-theme="amber"] .cpybtn,[data-theme="amber"] .tp-confirm{
  background:linear-gradient(135deg,#F7A84D,#DE7D1F);color:#1a1200;
}

/* 滚动条 */
[data-theme="amber"] ::-webkit-scrollbar-thumb{background:rgba(255,168,76,.22);}
[data-theme="amber"] ::-webkit-scrollbar-track{background:rgba(255,176,92,.04);}

/* ══════════════════════════════════════════════════════════
   首屏首页  CSS Step 1 — 全屏覆盖容器
   ══════════════════════════════════════════════════════════ */

/* 全屏固定覆盖层 */
.home-screen {
  position: fixed;
  inset: 0;
  z-index: 3000;                /* 高于所有弹窗（guide-overlay 最高为 2000） */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow-y: auto;             /* 小屏内容超高时可滚动 */
  background: linear-gradient(135deg, #0C1220 0%, #1B2D50 100%);
  /* 固定深色背景，不随主题变色，与工作台形成明显视觉区隔 */
}

/* 居中内容容器 */
.hs-content {
  width: min(860px, 95vw);
  padding: 48px 28px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 36px;
}

/* ══════════════════════════════════════════════════════════
   首屏首页  CSS Step 2 — 顶部 Logo 与标题区
   ══════════════════════════════════════════════════════════ */

/* 顶部整体区域：竖排居中 */
.hs-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}

/* Logo 圆环：带渐变描边的圆形徽章 */
.hs-logo-ring {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.6rem;
  font-weight: 900;
  color: #fff;
  letter-spacing: -2px;
  box-shadow: 0 0 0 4px rgba(139,92,246,0.25), 0 8px 32px rgba(59,130,246,0.35);
  user-select: none;
}

/* 产品名称大标题 */
.hs-title {
  font-size: 2.4rem;
  font-weight: 800;
  color: #E2E8F0;
  letter-spacing: 1px;
  margin: 0;
  line-height: 1.1;
}

/* 副标题标语 */
.hs-tagline {
  font-size: 1.05rem;
  font-weight: 500;
  color: #7DD3FC;          /* 浅蓝，与背景形成对比但不刺眼 */
  letter-spacing: 2px;
  margin: 0;
  text-transform: none;
}

/* 一句话描述 */
.hs-desc {
  font-size: 0.92rem;
  color: #94A3B8;          /* 中灰，次要信息 */
  margin: 4px 0 0;
  line-height: 1.6;
  max-width: 520px;
}

/* ══════════════════════════════════════════════════════════
   首屏首页  CSS Step 3 — 卡片网格与五色卡片变体
   ══════════════════════════════════════════════════════════ */

/* 区块容器：含标题 + 卡片网格 */
.hs-section {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* 区块小标题 */
.hs-section-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: #64748B;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin: 0;
}

/* 卡片网格：5 列等宽，最小 140px */
.hs-exp-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  width: 100%;
}

/* ── 单张卡片基础样式 ── */
.hs-exp-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  padding: 22px 14px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
  user-select: none;
  text-align: center;
}
.hs-exp-card:hover {
  transform: translateY(-4px);
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.18);
}
.hs-exp-card:active {
  transform: translateY(-1px);
}

/* 角标（实验类型） */
.hs-exp-badge {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  padding: 2px 8px;
  border-radius: 20px;
  text-transform: uppercase;
  opacity: 0.85;
}

/* 大号图标符号 */
.hs-exp-sym {
  font-size: 2.4rem;
  line-height: 1;
}

/* 实验名称 */
.hs-exp-name {
  font-size: 0.95rem;
  font-weight: 700;
  color: #E2E8F0;
  margin: 0;
}

/* 简短说明 */
.hs-exp-info {
  font-size: 0.76rem;
  color: #94A3B8;
  margin: 0;
  line-height: 1.4;
}

/* ── 五张卡片各自的主题色 ── */

/* Bell 态 — 蓝色 */
.hs-exp-bell {
  border-color: rgba(59,130,246,0.25);
}
.hs-exp-bell:hover {
  border-color: rgba(59,130,246,0.55);
  box-shadow: 0 8px 28px rgba(59,130,246,0.22);
}
.hs-exp-bell .hs-exp-badge {
  background: rgba(59,130,246,0.18);
  color: #93C5FD;
}
.hs-exp-bell .hs-exp-sym { color: #60A5FA; }

/* GHZ 态 — 紫色 */
.hs-exp-ghz {
  border-color: rgba(139,92,246,0.25);
}
.hs-exp-ghz:hover {
  border-color: rgba(139,92,246,0.55);
  box-shadow: 0 8px 28px rgba(139,92,246,0.22);
}
.hs-exp-ghz .hs-exp-badge {
  background: rgba(139,92,246,0.18);
  color: #C4B5FD;
}
.hs-exp-ghz .hs-exp-sym { color: #A78BFA; }

/* QFT — 青色 */
.hs-exp-qft {
  border-color: rgba(20,184,166,0.25);
}
.hs-exp-qft:hover {
  border-color: rgba(20,184,166,0.55);
  box-shadow: 0 8px 28px rgba(20,184,166,0.22);
}
.hs-exp-qft .hs-exp-badge {
  background: rgba(20,184,166,0.18);
  color: #5EEAD4;
}
.hs-exp-qft .hs-exp-sym { color: #2DD4BF; }

/* Grover — 橙色 */
.hs-exp-grover {
  border-color: rgba(249,115,22,0.25);
}
.hs-exp-grover:hover {
  border-color: rgba(249,115,22,0.55);
  box-shadow: 0 8px 28px rgba(249,115,22,0.22);
}
.hs-exp-grover .hs-exp-badge {
  background: rgba(249,115,22,0.18);
  color: #FDBA74;
}
.hs-exp-grover .hs-exp-sym { color: #FB923C; }

/* 空白线路 — 灰色 */
.hs-exp-blank {
  border-color: rgba(148,163,184,0.15);
  border-style: dashed;
}
.hs-exp-blank:hover {
  border-color: rgba(148,163,184,0.4);
  border-style: solid;
  box-shadow: 0 8px 28px rgba(148,163,184,0.10);
}
.hs-exp-blank .hs-exp-badge {
  background: rgba(148,163,184,0.12);
  color: #94A3B8;
}
.hs-exp-blank .hs-exp-sym { color: #64748B; }

/* ══════════════════════════════════════════════════════════
   首屏首页  CSS Step 4 — 页脚、入场动画、响应式
   ══════════════════════════════════════════════════════════ */

/* 页脚区域 */
.hs-foot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding-top: 4px;
}

/* 「跳过，直接进入工作台」按钮 */
.hs-skip-btn {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 8px;
  color: #64748B;
  font-size: 0.85rem;
  padding: 8px 20px;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
}
.hs-skip-btn:hover {
  color: #94A3B8;
  border-color: rgba(255,255,255,0.28);
}

/* 版权小字 */
.hs-foot-note {
  font-size: 0.72rem;
  color: #334155;
  margin: 0;
}

/* ── 入场动画 ── */
@keyframes hs-fade-in {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 首屏整体淡入 */
#home-screen {
  animation: hs-fade-in 0.45s ease both;
}

/* 各子区块错开入场，营造层次感 */
.hs-head      { animation: hs-fade-in 0.45s 0.05s ease both; }
.hs-section   { animation: hs-fade-in 0.45s 0.15s ease both; }
.hs-foot      { animation: hs-fade-in 0.45s 0.25s ease both; }

/* ── 响应式：≤700px 改为 2 列，调小字号 ── */
@media (max-width: 700px) {
  .hs-exp-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  /* 空白线路卡片（第 5 张）在 2 列下横跨全宽 */
  .hs-exp-blank {
    grid-column: 1 / -1;
  }
  .hs-title {
    font-size: 1.8rem;
  }
  .hs-logo-ring {
    width: 68px;
    height: 68px;
    font-size: 2rem;
  }
  .hs-content {
    padding: 32px 16px 28px;
    gap: 24px;
  }
}

/* ══════════════════════════════════════════════════════════
   实验报告按钮
   ══════════════════════════════════════════════════════════ */

/* 「生成报告」按钮：与 aq-console-btn 风格保持一致，加绿色强调 */
.report-btn {
  border-color: var(--teal, #14b8a6) !important;
  color: var(--teal, #14b8a6) !important;
  background: transparent;
  transition: background 0.15s, color 0.15s;
}
.report-btn:hover {
  background: rgba(20, 184, 166, 0.10) !important;
}