/* ผลเอย Ops Hub — พื้นขาว กรอบชัด ใช้ง่ายทุกตำแหน่ง (โหลดเป็นไฟล์สุดท้าย) */
:root{
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F8F3F4; --surface-3:#EFE6E9;
  --border:#D9CCD0; --hair:#E4D9DC; --text:#2A1A1F; --text-muted:#6B5960;
  --good:#2F7D4F; --warn:#9C6512; --critical:#B42D20;
}
body{ background:#FFFFFF !important; }
.topbar{ background:#FFFFFF !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; border-bottom:1.5px solid var(--border) !important; }
.card, .sect, .stat, .person, .rulecard, .rowcard, .menucard, .tbl-wrap, .login-card, details.phase{
  border:1.5px solid var(--border) !important; box-shadow:none !important; background:#FFFFFF;
}
.sect{ border-radius:16px; padding:16px; margin-top:16px; }
.sect-h{ border-bottom:1.5px solid var(--surface-3); padding-bottom:10px; margin-bottom:12px; display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; }
.sect-h h3{ margin:0; }
.pg-head{ background:var(--accent-soft); border:1.5px solid #EFCBD5; border-left:6px solid var(--accent); border-radius:14px; padding:12px 16px; }
.tab{ border:1.5px solid var(--border) !important; }
.tab[aria-selected="true"]{ border-color:var(--accent) !important; }
.card:hover, .stat:hover, .person:hover{ transform:none !important; }

/* เมนูของฉัน */
.mymenu{ display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; }
.mybtn{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; text-align:left; cursor:pointer; min-height:92px;
  background:#FFFFFF; border:1.5px solid var(--border); border-radius:14px; padding:14px; color:var(--text); font:inherit; }
.mybtn:hover{ border-color:var(--accent); }
.mybtn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.mybtn .i{ font-size:24px; line-height:1; }
.mybtn .t{ font-weight:700; font-size:15px; }
.mybtn .d{ font-size:12px; color:var(--text-muted); }
.mybtn.main{ background:var(--accent); border-color:var(--accent); color:#FFFFFF; }
.mybtn.main .d{ color:#FFFFFF; opacity:.9; }

/* กฎปฏิบัติตัว */
.conduct-banner{ background:var(--accent); color:#FFFFFF; border-radius:12px; padding:11px 14px; text-align:center; font-weight:700; margin-bottom:12px; }
.conduct-list{ display:flex; flex-direction:column; gap:8px; }
.conduct-g{ border:1.5px solid var(--border); border-radius:12px; overflow:hidden; background:#FFFFFF; }
.conduct-g > summary{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:12px 14px; background:var(--surface-2); font-weight:600; }
.conduct-g > summary::-webkit-details-marker{ display:none; }
.conduct-g[open] > summary{ border-bottom:1.5px solid var(--border); }
.conduct-g ol{ list-style:none; margin:0; padding:0; }
.conduct-g li{ display:flex; align-items:flex-start; gap:10px; padding:10px 14px; border-top:1px solid var(--hair); font-size:14px; }
.conduct-g li:first-child{ border-top:none; }
.conduct-g .cid{ color:var(--text-muted); font-size:12.5px; min-width:30px; }
.conduct-g .ct{ flex:1; min-width:0; }
.conduct-g li b{ color:var(--critical); flex:none; }

/* ชา */
.tea-rounds{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
.tea-round{ border:1.5px solid var(--border); border-radius:10px; padding:8px 4px; text-align:center; background:#FFFFFF; }
.tea-round .t{ font-size:12.5px; color:var(--text-muted); }
.tea-round .q{ font-size:24px; font-weight:700; line-height:1.2; }
.tea-round .s{ font-size:11px; color:var(--text-muted); }
.tea-round.next{ background:var(--accent); border-color:var(--accent); color:#FFFFFF; }
.tea-round.next .t, .tea-round.next .s{ color:#FFFFFF; }
.tea-round.past{ opacity:.5; }
.tea-must{ margin:10px 0 0; padding-left:1.2em; display:flex; flex-direction:column; gap:6px; font-size:14px; }

.build-stamp{ text-align:center; font-size:11px; color:var(--text-muted); padding:18px 16px 28px; }
@media print{ .build-stamp{ display:none; } }