*{box-sizing:border-box}body{margin:0;background:#eef4fb;color:#10223b;font-family:"Microsoft JhengHei",Arial,sans-serif}header{height:66px;background:linear-gradient(90deg,#0f4b7c,#1769a8);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 24px;box-shadow:0 8px 24px rgba(8,53,92,.22);position:sticky;top:0;z-index:5}header h1{font-size:20px;margin:0;font-weight:900;letter-spacing:.5px}nav{display:flex;gap:10px;align-items:center}.topbtn,.btn,button{border:0;border-radius:12px;background:linear-gradient(180deg,#1d6faa,#12558c);color:#fff;padding:10px 16px;text-decoration:none;font-weight:800;cursor:pointer;box-shadow:0 5px 12px rgba(16,82,132,.22)}.topbtn.active{background:linear-gradient(180deg,#5b7cff,#6d55d9)}.topbtn:hover,.btn:hover,button:hover{filter:brightness(1.08)}main{padding:18px}.dashboard-main{padding:18px 22px 28px}.dash-hero{background:linear-gradient(120deg,#ffffff,#eef6ff 60%,#f7f1ff);border:1px solid rgba(120,160,220,.24);border-radius:22px;padding:20px 24px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 14px 40px rgba(58,98,150,.12)}.dash-hero p{margin:0;color:#708198}.dash-hero h2{margin:4px 0;font-size:26px;color:#233d6b}.dash-hero span{color:#65758c}.hero-api{background:#fff;color:#175b92;border:1px solid #cfe0f3;border-radius:16px;padding:12px 18px;text-decoration:none;font-weight:900;box-shadow:0 10px 25px rgba(47,90,140,.12)}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:14px;margin-bottom:14px}.metric-card{background:rgba(255,255,255,.9);border:1px solid rgba(210,225,245,.9);border-radius:20px;padding:18px 20px;box-shadow:0 14px 36px rgba(57,96,150,.12);position:relative;overflow:hidden}.metric-card:after{content:"";position:absolute;right:-28px;top:-28px;width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,rgba(115,197,255,.28),rgba(141,104,230,.2))}.metric-card span{display:block;color:#6b7c92;font-weight:800;margin-bottom:8px}.metric-card b{font-size:34px;color:#5542a1;line-height:1}.metric-card small{margin-left:6px;color:#76869a;font-weight:800}.dash-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:14px}.dash-panel{background:#fff;border:1px solid #dbe7f5;border-radius:20px;padding:16px;box-shadow:0 14px 36px rgba(57,96,150,.1);min-height:255px}.big-panel{grid-column:span 1}.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.panel-title h3{margin:0;font-size:17px}.panel-title span{font-size:12px;color:#7d8ea5}.modern-bars{display:flex;flex-direction:column;gap:13px}.mbar-label{display:flex;justify-content:space-between;font-weight:800;color:#324965;margin-bottom:5px}.mbar-track{height:18px;background:#eef3fb;border-radius:999px;overflow:hidden}.mbar-fill{height:100%;background:linear-gradient(90deg,#d7cfff,#8565ed 70%,#5140c8);border-radius:999px;box-shadow:0 5px 12px rgba(97,74,211,.22)}.donut-wrap{display:flex;justify-content:center;align-items:center;padding:8px}.donut-new{width:184px;height:184px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}.donut-new>div{width:105px;height:105px;background:#fff;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(45,70,120,.1)}.donut-new b{font-size:28px;color:#5642a5}.donut-new span{font-size:12px;color:#8390a3}.legend-list{display:flex;flex-direction:column;gap:8px;margin-top:6px}.legend-list div{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:8px;color:#33465f}.legend-list i{width:10px;height:10px;border-radius:50%}.legend-list b{color:#5642a5}.sparkline{height:190px;background:linear-gradient(180deg,#fbfdff,#f5f2ff);border-radius:16px;padding:6px}.recent-panel{grid-column:span 3}.clean-table{border-collapse:collapse;width:100%;overflow:hidden;border-radius:14px}table{border-collapse:collapse;width:100%}th,td{padding:11px;border-bottom:1px solid #eef2f7;text-align:left;white-space:nowrap}th{background:#f7faff;color:#20344d}.clean-table th{background:#f4f7ff}.clean-table tr:hover td{background:#fafcff}.cards{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:14px;margin-bottom:14px}.cards.mini{grid-template-columns:repeat(3,1fr)}.card{background:#fff;border-radius:14px;padding:18px;box-shadow:0 6px 20px rgba(45,90,140,.1)}.card span{display:block;color:#6b7a90;margin-bottom:8px}.card b{font-size:28px;color:#4b3f89}.layout{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:14px}.panel{background:#fff;border-radius:16px;padding:18px;box-shadow:0 8px 28px rgba(45,90,140,.1);min-height:220px;border:1px solid #dce8f5}.panel h3{margin:0 0 12px}.wide{grid-column:span 2}.toolbar{display:flex;gap:10px;background:#fff;border-radius:14px;padding:12px;margin-bottom:14px;box-shadow:0 6px 20px rgba(45,90,140,.08);align-items:center}.toolbar input,.toolbar select,input{height:42px;border:1px solid #d9e3f1;border-radius:10px;padding:0 12px;background:#fff}.table-wrap{background:#fff;border-radius:14px;padding:10px;box-shadow:0 6px 20px rgba(45,90,140,.08);overflow:auto}.muted{color:#7c8796}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.actions{display:flex;gap:10px;margin-top:12px}.login-body{background:linear-gradient(135deg,#eaf4ff,#f6efff);min-height:100vh}.login-card,.loginbox{max-width:380px;margin:12vh auto;background:#fff;padding:28px;border-radius:18px;box-shadow:0 18px 45px rgba(0,0,0,.12)}.login-card input,.loginbox input{width:100%;margin:8px 0}.err{background:#fff0f0;color:#a82020;padding:8px;border-radius:8px;margin:8px 0}.copy,.copyrow{display:flex;gap:8px;align-items:center}.copy input,.copyrow input{flex:1;width:100%}.api-card{max-width:980px}.apihelp{margin-top:14px;background:#f6f9ff;border:1px solid #dce8f6;border-radius:14px;padding:14px;line-height:1.8}@media(max-width:1100px){.metric-grid,.dash-grid,.cards,.layout{grid-template-columns:1fr}.recent-panel,.wide{grid-column:auto}.toolbar{flex-wrap:wrap}header{height:auto;min-height:66px;align-items:flex-start;gap:10px;flex-direction:column;padding:14px 18px}nav{flex-wrap:wrap}.copyrow{flex-direction:column;align-items:stretch}}

/* v3.2 dashboard cards */
.api-update-card{background:linear-gradient(120deg,#ffffff,#eef7ff 58%,#f3efff);border:1px solid rgba(174,204,238,.9);border-radius:24px;padding:20px 24px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:18px;box-shadow:0 14px 36px rgba(52,94,148,.12)}
.api-update-card .api-label{display:inline-block;background:#eaf4ff;color:#145b92;border:1px solid #cae1f8;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:900;margin-bottom:10px}
.api-update-card strong{display:block;color:#1e3656;font-size:24px;line-height:1.25;margin-bottom:6px}
.api-update-card em{display:block;color:#728198;font-style:normal;font-weight:700}
.calc-card-grid{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:16px;align-items:stretch}
.calc-card{width:178px;min-height:150px;background:linear-gradient(180deg,#fff,#f8fbff);border:1px solid #dbe8f6;border-radius:22px;padding:18px;box-shadow:0 12px 30px rgba(56,96,150,.12);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.calc-card:before{content:"";position:absolute;right:-28px;top:-28px;width:88px;height:88px;border-radius:26px;background:linear-gradient(135deg,rgba(120,198,255,.28),rgba(126,92,231,.18));transform:rotate(18deg)}
.calc-card span{color:#6a7c92;font-weight:900;position:relative;z-index:1}
.calc-card b{font-size:34px;color:#4f43a5;line-height:1;position:relative;z-index:1}
.calc-card small{color:#718199;font-weight:900;position:relative;z-index:1}
@media(max-width:700px){.api-update-card{flex-direction:column;align-items:stretch;padding:16px}.api-update-card strong{font-size:20px}.calc-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:12px}.calc-card{width:auto;min-height:135px;border-radius:20px}}

/* v3.3 six-container dashboard, Cambodia +07:00 */
.ws2-six-dashboard{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;padding:20px;background:linear-gradient(135deg,#edf5ff,#f7fbff 50%,#f4f1ff)}
.dash-container{background:rgba(255,255,255,.96);border:1px solid rgba(205,222,245,.95);border-radius:24px;padding:18px;box-shadow:0 18px 42px rgba(41,80,130,.12);overflow:hidden;position:relative}.dash-container:before{content:"";position:absolute;right:-42px;top:-42px;width:115px;height:115px;border-radius:32px;background:linear-gradient(135deg,rgba(85,177,255,.16),rgba(126,91,235,.13));transform:rotate(20deg)}.dash-container>*{position:relative;z-index:1}.dash-container-1{grid-column:1/-1;min-height:86px;display:flex;align-items:center}.dash-container-2{grid-column:1/-1}.dash-container-3{grid-column:span 4;min-height:310px}.dash-container-4{grid-column:span 4;min-height:310px}.dash-container-5{grid-column:span 4;min-height:310px}.dash-container-6{grid-column:1/-1;min-height:330px}.api-line{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;font-size:16px}.api-line strong{font-size:22px;color:#173d67}.api-line span{color:#39506c;font-weight:800}.api-line b{color:#7160dd}.status-dot{width:14px;height:14px;border-radius:50%;background:#28c76f;box-shadow:0 0 0 8px rgba(40,199,111,.14);display:inline-block}.dash-container h2{margin:0;color:#183553;font-size:20px}.summary-row{display:grid;grid-template-columns:repeat(5,minmax(145px,1fr));gap:14px;margin-top:14px}.summary-mini{min-height:128px;border-radius:22px;background:linear-gradient(180deg,#fafdff,#f2f7ff);border:1px solid #d9e7f7;padding:17px;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);display:flex;flex-direction:column;justify-content:space-between}.summary-mini span{color:#667b96;font-weight:900}.summary-mini b{font-size:36px;color:#4f43a5;line-height:1}.summary-mini em{font-style:normal;color:#7488a2;font-weight:900}.container-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:16px}.container-title span{color:#8392a6;font-weight:700;font-size:13px}.soft-bars{display:flex;flex-direction:column;gap:13px}.soft-bar>div{display:flex;justify-content:space-between;gap:12px;margin-bottom:7px;font-weight:900;color:#28425f}.soft-bar b{color:#5a4bb5}.soft-bar i{display:block;height:20px;border-radius:999px;background:#edf3fb;overflow:hidden;box-shadow:inset 0 1px 4px rgba(40,70,110,.08)}.soft-bar u{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#bfe3ff,#2ea7ff 65%,#6b63f6);box-shadow:0 6px 15px rgba(69,107,230,.22)}.accent-bars .soft-bar u{background:linear-gradient(90deg,#ead8ff,#c66ee5 65%,#7654da)}.trend-card{height:250px;border-radius:18px;background:linear-gradient(180deg,#fbfdff,#f3f6ff);border:1px solid #e1eaf7;padding:8px}.flat-table{box-shadow:none;border:1px solid #e2ebf6;border-radius:18px;padding:0;max-height:420px}.flat-table table{margin:0}.flat-table th{background:#f4f8ff;color:#183553;position:sticky;top:0}.flat-table td,.flat-table th{padding:13px 14px}@media(max-width:1150px){.ws2-six-dashboard{grid-template-columns:1fr}.dash-container-1,.dash-container-2,.dash-container-3,.dash-container-4,.dash-container-5,.dash-container-6{grid-column:1}.summary-row{grid-template-columns:repeat(auto-fit,minmax(145px,1fr))}}@media(max-width:640px){.ws2-six-dashboard{padding:12px;gap:12px}.dash-container{border-radius:20px;padding:14px}.api-line{font-size:14px;gap:8px}.api-line strong{font-size:19px}.summary-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.summary-mini{min-height:112px;padding:13px}.summary-mini b{font-size:30px}.dash-container-6{min-height:260px}.flat-table{max-height:360px}}

/* v3.4 強化儀表盤容器：每一區都是明顯圓角白色容器 */
body{background:#eef4fb!important;}
.ws2-six-dashboard{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:18px!important;
  padding:22px!important;
  background:#eef4fb!important;
  align-items:stretch!important;
}
.ws2-six-dashboard .dash-container{
  display:block!important;
  background:linear-gradient(180deg,#ffffff 0%,#f9fcff 100%)!important;
  border:1px solid #cfe0f3!important;
  border-radius:24px!important;
  padding:20px!important;
  box-shadow:0 14px 34px rgba(22,69,114,.13)!important;
  overflow:hidden!important;
  position:relative!important;
  min-height:180px!important;
}
.ws2-six-dashboard .dash-container:before{
  content:""!important;
  position:absolute!important;
  right:-36px!important;
  top:-36px!important;
  width:110px!important;
  height:110px!important;
  border-radius:32px!important;
  background:linear-gradient(135deg,rgba(47,167,255,.18),rgba(114,83,220,.12))!important;
  transform:rotate(18deg)!important;
  pointer-events:none!important;
}
.ws2-six-dashboard .dash-container>*{position:relative!important;z-index:1!important;}
.ws2-six-dashboard .dash-container-1{
  grid-column:1/-1!important;
  min-height:96px!important;
  display:flex!important;
  align-items:center!important;
}
.ws2-six-dashboard .dash-container-2{
  grid-column:1/-1!important;
  min-height:210px!important;
}
.ws2-six-dashboard .dash-container-3,
.ws2-six-dashboard .dash-container-4,
.ws2-six-dashboard .dash-container-5{
  grid-column:span 4!important;
  min-height:360px!important;
}
.ws2-six-dashboard .dash-container-6{
  grid-column:1/-1!important;
  min-height:380px!important;
}
.ws2-six-dashboard .api-line{
  width:100%!important;
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:10px 18px!important;
  line-height:1.7!important;
}
.ws2-six-dashboard .api-line strong{font-size:22px!important;color:#14395f!important;}
.ws2-six-dashboard .api-line span{font-weight:800!important;color:#344f6e!important;}
.ws2-six-dashboard .api-line b{font-weight:900!important;color:#4f43a5!important;}
.ws2-six-dashboard .summary-row{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(150px,1fr))!important;
  gap:16px!important;
  margin-top:18px!important;
}
.ws2-six-dashboard .summary-mini{
  min-height:138px!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,#fafdff,#eef6ff)!important;
  border:1px solid #d5e5f6!important;
  padding:18px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 18px rgba(56,96,150,.08)!important;
}
.ws2-six-dashboard .summary-mini span{font-size:14px!important;color:#61738b!important;}
.ws2-six-dashboard .summary-mini b{font-size:38px!important;color:#4f43a5!important;}
.ws2-six-dashboard .container-title{
  border-bottom:1px solid #e6eef8!important;
  padding-bottom:12px!important;
  margin-bottom:16px!important;
}
.ws2-six-dashboard .soft-bars{max-height:285px!important;overflow:auto!important;padding-right:4px!important;}
.ws2-six-dashboard .trend-card{height:285px!important;background:#f8fbff!important;}
.ws2-six-dashboard .flat-table{max-height:460px!important;background:#fff!important;}
@media(max-width:1150px){
  .ws2-six-dashboard{grid-template-columns:1fr!important;}
  .ws2-six-dashboard .dash-container-1,
  .ws2-six-dashboard .dash-container-2,
  .ws2-six-dashboard .dash-container-3,
  .ws2-six-dashboard .dash-container-4,
  .ws2-six-dashboard .dash-container-5,
  .ws2-six-dashboard .dash-container-6{grid-column:1!important;}
  .ws2-six-dashboard .summary-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;}
}
@media(max-width:640px){
  .ws2-six-dashboard{padding:12px!important;gap:12px!important;}
  .ws2-six-dashboard .dash-container{border-radius:20px!important;padding:14px!important;min-height:auto!important;}
  .ws2-six-dashboard .summary-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .ws2-six-dashboard .summary-mini{min-height:118px!important;border-radius:18px!important;}
  .ws2-six-dashboard .summary-mini b{font-size:30px!important;}
}

.now-clock-label{display:inline-flex;align-items:center;gap:4px;font-weight:800;color:#12314f;}
.now-clock-label strong{display:inline-block;min-width:74px;font-variant-numeric:tabular-nums;color:#0b65b8;background:#eef7ff;border:1px solid #c8e8ff;border-radius:10px;padding:4px 8px;}
@media(max-width:720px){.now-clock-label{margin-top:6px;}.now-clock-label strong{min-width:70px;}}

/* v3.6 API 接收中閃爍燈 */
.ws2-six-dashboard .green-light{
  width:20px!important;
  height:20px!important;
  background-color:#2ecc71!important;
  border-radius:50%!important;
  margin-right:2px!important;
  box-shadow:0 0 10px #2ecc71!important;
  display:inline-block!important;
  animation:ws2Blink 1s linear infinite!important;
  flex:0 0 auto!important;
}
@keyframes ws2Blink{
  0%{opacity:1;}
  50%{opacity:.2;}
  100%{opacity:1;}
}