/* วิเคราะห์ LOG (11 ต.ค. 2569) — ต่อจาก style.css (ธีมแดง-ดำคาร์บอน) */
.an nav { grid-template-columns:repeat(5,1fr); }
.an nav[hidden], .an [hidden] { display:none !important; }
.beta { font-family:'Exo 2'; font-style:italic; font-weight:800; font-size:13px; letter-spacing:.5px; color:var(--amber);
  border:1px solid var(--amber); padding:4px 12px; border-radius:20px; white-space:nowrap; }
.hbtn { -webkit-appearance:none; appearance:none; font:600 14px Sarabun,sans-serif; color:#fff; cursor:pointer; white-space:nowrap;
  background:linear-gradient(180deg,#3a070b,#8d0c15); border:1px solid var(--red); padding:8px 16px;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%); min-height:40px; }
.hbtn:hover { box-shadow:0 0 14px var(--glow); }
.hbtn:disabled { opacity:.4; cursor:default; }
.hbtn.ghost { background:transparent; border-color:#555; color:var(--dim); }

/* วางไฟล์ */
.drop { display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; padding:56px 20px; cursor:pointer;
  border-style:dashed; max-width:760px; margin:24px auto 0; }
.drop input { position:absolute; width:1px; height:1px; opacity:0; }
.drop svg { width:56px; height:56px; stroke:var(--red); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
  filter:drop-shadow(0 0 6px var(--glow)); }
.drop b { font-family:'Exo 2'; font-style:italic; font-size:22px; }
.drop span { color:var(--dim); font-size:15px; }
.drop em { font-style:normal; color:var(--green); font-size:14px; margin-top:6px; }
.drop.over { background:rgba(200,16,28,.18); box-shadow:0 0 30px var(--glow) inset; }
.drop:focus-within { outline:2px solid var(--red); outline-offset:3px; }
.drop-foot { text-align:center; margin-top:16px; }
.err { max-width:760px; margin:14px auto 0; padding:12px 16px; border:1px solid var(--red); color:#ffb3b8; background:rgba(200,16,28,.15); }

/* แถบช่วงเวลา */
.rangebar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-height:0; margin-bottom:12px; font-size:14px; color:var(--dim); }
.rangebar:empty { display:none; }
.rangebar b { color:var(--amber); font-family:'Exo 2'; font-style:italic; }

/* สรุป */
.cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; }
.card .num { font-size:44px; margin-top:12px; }
.card p { margin:10px 0 0; color:var(--dim); font-size:14px; line-height:1.5; }
.card.bad { border-color:var(--amber); } .card.bad .num { color:var(--amber); }
.card.ok .num { color:var(--green); }
.card.na .num { color:var(--mute); }
.mix { display:flex; height:12px; margin-top:14px; border-radius:2px; overflow:hidden; background:#26272b; }
.mix i { display:block; height:100%; }
.mix .r { background:#4aa3ff; } .mix .o { background:#3a3b40; } .mix .l { background:var(--red); }
.mixlbl { display:flex; justify-content:space-between; font-size:12px; color:var(--dim); margin-top:6px; }

/* กราฟ */
.gpanel { padding:12px 10px 8px; }
.ghelp { font-size:13px; color:var(--dim); padding:0 6px 8px; }
#charts .u-legend, #cmpCharts .u-legend { font-size:12px; color:var(--dim); text-align:left; padding-left:50px; }
#charts .u-legend .u-marker, #cmpCharts .u-legend .u-marker { width:12px; height:3px; }
.u-select { background:rgba(255,176,32,.18); }
.filewarn { margin:0 0 12px; }
.rowpick { display:flex; flex-wrap:wrap; gap:6px; padding:0 6px 10px; }
.chip { -webkit-appearance:none; appearance:none; font:600 13px Sarabun,sans-serif; padding:5px 11px; border-radius:16px; cursor:pointer;
  background:transparent; color:var(--mute); border:1px solid #2b2b30; }
.chip.on { color:#fff; border-color:var(--c); background:color-mix(in srgb, var(--c) 18%, transparent); }
.cwrap { position:relative; }
.crow { position:relative; }
.crow + .crow { border-top:1px solid #1d1d21; }
.chead { display:flex; align-items:baseline; gap:8px; padding:6px 8px 0 8px; font-size:14px; }
.chead .dot { width:10px; height:10px; border-radius:50%; flex:none; align-self:center; }
.chead b { color:#fff; font-weight:600; }
.chead .unit { color:var(--mute); font-size:12px; }
.chead .val { margin-left:auto; font-family:'Exo 2'; font-style:italic; font-weight:800; color:#fff; font-size:15px; }
.ctip { position:absolute; top:40px; z-index:5; pointer-events:none; min-width:190px; padding:9px 12px; font-size:13px; line-height:1.65;
  background:rgba(8,8,10,.94); border:1px solid var(--red2); box-shadow:0 6px 22px rgba(0,0,0,.6); color:var(--dim); }
.ctip b { color:#fff; }
.ctip em { color:var(--amber); font-style:normal; }

/* ตาราง */
.tctl { display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap; margin-bottom:12px; font-size:14px; color:var(--dim); }
.tctl select, .tctl input[type=number] { background:#111114; color:#fff; border:1px solid #3a2226; padding:6px 8px; font:inherit; min-height:36px; }
.tctl input[type=number] { width:64px; }
.tctl .chk { display:flex; align-items:center; gap:6px; }
.tctl .chk input[type=checkbox] { width:18px; height:18px; accent-color:var(--red); }
.fileb { position:relative; display:inline-flex; align-items:center; }
.fileb input { position:absolute; width:1px; height:1px; opacity:0; }
.fileb:focus-within { outline:2px solid var(--amber); outline-offset:2px; }
.fname { color:#fff; }
.hmwrap { overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid #1d1d21; background:#09090b; }
.hmwrap canvas { display:block; cursor:pointer; }
.cellinfo { margin-top:10px; padding:10px 12px; border-left:3px solid var(--red); background:rgba(255,255,255,.03); font-size:14px; color:var(--dim); min-height:44px; }
.cellinfo b { color:#fff; }
.warn { margin:0 0 12px; padding:10px 12px; border:1px solid var(--amber); color:var(--amber); font-size:14px; }
.v3d { position:relative; height:520px; margin-top:12px; border:1px solid #1d1d21; background:#050506; touch-action:none; }
.v3d canvas { display:block; width:100%; height:100%; }
.v3d-hint { position:absolute; left:10px; top:8px; font-size:12px; color:var(--mute); pointer-events:none; }
.v3d-ax { position:absolute; font:700 12px 'Exo 2'; font-style:italic; color:var(--dim); pointer-events:none; }

/* 3D แบบ TunerPro: ป้ายแกน */
.v3d { overflow:hidden; }
.v3d-lab { position:absolute; left:0; top:0; font:600 12px Sarabun,sans-serif; color:#b8bac0; pointer-events:none; white-space:nowrap; }
.v3d-lab.z { color:#9a9ca3; }
.v3d-lab.ttl { font:700 14px Sarabun,sans-serif; color:var(--amber); }
.v3d-ax .sw { display:inline-block; width:12px; height:12px; vertical-align:-2px; background:linear-gradient(90deg,#1e3cdc,#28c850,#fadc28,#eb281e); }
.v3d-ax .sw.g { background:rgba(120,120,128,.45); }
.v3d-ax { font:600 12px Sarabun,sans-serif; color:var(--dim); font-style:normal; }

/* ตาราง: กล่องลอยตอนชี้ช่อง */
.htip { position:fixed; z-index:50; pointer-events:none; padding:9px 12px; font-size:13px; line-height:1.7; max-width:340px;
  background:rgba(8,8,10,.95); border:1px solid var(--red2); box-shadow:0 6px 22px rgba(0,0,0,.6); color:var(--dim); }
.htip b { color:#fff; }

/* กราฟ: สลับโหมด แยกแถว / รวมกราฟ */
.rowpick { flex-direction:column; align-items:stretch; }
.rowpick .chips { display:flex; flex-wrap:wrap; gap:6px; }
.modes { display:inline-flex; align-self:flex-start; border:1px solid var(--red2); margin-bottom:8px; }
.modes button { -webkit-appearance:none; appearance:none; background:transparent; border:0; color:var(--dim); cursor:pointer;
  font:600 14px Sarabun,sans-serif; padding:7px 16px; }
.modes button.on { background:linear-gradient(180deg,#3a070b,#8d0c15); color:#fff; }

/* ใบไดโน่ */
.pulls { display:flex; gap:8px; flex-wrap:wrap; }
.pulls label { display:flex; align-items:center; gap:5px; padding:4px 10px; border:1px solid #3a2226; font-size:13px; cursor:pointer; }
.pulls input { accent-color:var(--red); }
.sheet { overflow-x:auto; background:#fff; }
.sheet canvas { display:block; width:100%; max-width:1600px; margin:0 auto; height:auto; }
#printImg { display:none; }

.an-foot { text-align:center; color:var(--mute); font-size:13px; padding:18px 12px 26px; }
.an-foot a { color:var(--dim); }

@media (max-width:640px) {
  /* ส่วนหัว: โลโก้ + BETA + ปุ่ม แถวบน · ชื่อรถ/ไฟล์ ขึ้นแถวใหม่เต็มกว้าง (เดิมล้นจอ 21 px) */
  .an header { flex-wrap:wrap; row-gap:6px; }
  .an header .who { order:3; flex-basis:100%; }
  .an header .beta { margin-left:auto; }
  .beta { font-size:11px; padding:3px 8px; } .beta .bx { display:none; }
  header .hbtn { padding:6px 10px; font-size:12px; min-height:34px; }
  nav button { font-size:11px; }
  .drop { padding:36px 14px; margin-top:12px; } .drop b { font-size:18px; } .drop span { font-size:13px; }
  .cards { grid-template-columns:1fr 1fr; gap:12px; }
  .card .num { font-size:30px; } .card p { font-size:12px; }
  .v3d { height:360px; }
}
@media (max-width:420px) {
  .cards { grid-template-columns:1fr; }
  .an nav button svg { display:none; }
  .an nav button { white-space:nowrap; padding:0 2px; }
}

/* พิมพ์: ใบไดโน่อย่างเดียว พื้นขาว */
@media print {
  @page { size:A4 landscape; margin:8mm; }
  body.an { background:#fff !important; }
  body.an > *:not(#printImg) { display:none !important; }
  #printImg { display:block !important; width:100%; height:auto; }
}