/*
 * mod-layout 模块样式 —— 来源 frontend/legacy/layout.html <style>（:7-68）
 * 规则：
 *   - 删除门户 chrome：:root、*、body、.wrap、header、footer、.ptop、.pnav、.ptitle、.handoff
 *   - 其余每条选择器的每个逗号分段前缀 "#view-mod-layout "（ID 选择器同样前缀），
 *     .panel/.btn 等与平台同名类的冲突由前缀提升特异性消解
 *   - :root 自定义属性改为挂在 #view-mod-layout 上（原 :root 规则按契约删除，
 *     frag 内联样式仍引用 var(--muted) 等变量，需在容器上定义方可解析）
 *   - @media(max-width:860px) 断点保留，内部规则同样前缀
 *   - 末尾按契约追加打印规则（.no-print 为契约规定的全局打印工具类）
 */
#view-mod-layout{--ink:#1a2332;--muted:#6b7688;--line:#dfe4ea;--bg:#f4f6f8;--card:#fff;--navy:#0a4f96;
      --steel:#5b7288;--mist:#eef1f4;--accent:#c0392b;--ok:#2e7d5b;--warn:#b45309;}
#view-mod-layout .upload{border:2px dashed var(--steel);border-radius:12px;padding:34px 20px;text-align:center;background:var(--card);margin-bottom:16px;}
#view-mod-layout .upload.on{border-color:var(--ok);background:#f0f9f4;}
#view-mod-layout .upload .big{font-size:15px;color:var(--navy);font-weight:700;margin-bottom:6px;}
#view-mod-layout .upload .small{font-size:12px;color:var(--muted);margin-bottom:14px;}
#view-mod-layout .btn{display:inline-block;background:var(--navy);color:#fff;border:none;padding:10px 26px;font-size:14px;cursor:pointer;letter-spacing:1px;}
#view-mod-layout .btn:hover{background:#2c4f7c;}
#view-mod-layout .btn:disabled{background:#9fb0c0;cursor:not-allowed;}
#view-mod-layout .btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--navy);}
#view-mod-layout .row{display:flex;gap:16px;align-items:start;flex-wrap:wrap;}
#view-mod-layout .panel{background:var(--card);border:1px solid var(--line);padding:16px 18px;flex:1;min-width:320px;}
#view-mod-layout .panel h2{font-size:13px;color:var(--navy);letter-spacing:1px;margin-bottom:10px;border-left:3px solid var(--navy);padding-left:8px;}
#view-mod-layout .side{flex:0 0 400px;display:flex;flex-direction:column;gap:16px;max-width:100%;}
@media(max-width:860px){#view-mod-layout .side{flex:1 1 100%;}}
#view-mod-layout .frow{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
#view-mod-layout .frow label{width:86px;font-size:12px;color:var(--muted);flex-shrink:0;}
#view-mod-layout .specrow{display:flex;gap:4px;flex-wrap:wrap;flex:1;}
#view-mod-layout .specchk{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;padding:2px 8px;border:1px solid var(--line);border-radius:999px;cursor:pointer;background:#fff;user-select:none;}
#view-mod-layout .specchk:hover{border-color:var(--accent);}
#view-mod-layout .specchk input{accent-color:var(--accent);margin:0;}
#view-mod-layout .specchk:has(input:checked){background:#e6f0fa;border-color:var(--accent);color:var(--accent);font-weight:600;}
#view-mod-layout .frow input{flex:1;min-width:60px;padding:5px 8px;border:1px solid var(--line);font-size:13px;background:#fff;}
#view-mod-layout .frow input:focus{outline:none;border-color:var(--navy);}
#view-mod-layout .unit{font-size:11px;color:var(--steel);width:30px;}
#view-mod-layout .stats{display:flex;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:12px;}
#view-mod-layout .stat{flex:1;background:#fff;padding:10px;text-align:center;}
#view-mod-layout .stat .v{font-size:18px;font-weight:800;color:var(--navy);}
#view-mod-layout .stat .k{font-size:10.5px;color:var(--muted);}
#view-mod-layout #svgWrap{background:#fff;border:1px solid var(--line);overflow:auto;max-height:560px;min-height:300px;}
#view-mod-layout #svgWrap svg{display:block;width:100%;height:auto;}
#view-mod-layout table.qty{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:8px;}
#view-mod-layout table.qty th{background:var(--navy);color:#fff;padding:6px 8px;text-align:left;}
#view-mod-layout table.qty td{padding:5px 8px;border-bottom:1px solid var(--mist);}
#view-mod-layout table.qty tr:nth-child(even) td{background:#fafbfc;}
#view-mod-layout .log{background:#0f1826;color:#c9d6e3;padding:12px;font-family:Consolas,monospace;font-size:11.5px;
     max-height:180px;overflow:auto;margin-top:10px;line-height:1.8;}
#view-mod-layout .log .ok{color:#6fcf97;}
#view-mod-layout .log .err{color:#f28b82;}
#view-mod-layout .log .warn{color:#f7d060;}
@media print{ #view-mod-layout.active{display:block;} .no-print{display:none!important;} }