/* ================= DEVESSA V2 — single-layer design system ================= */
:root{
  --burgundy:#900024; --indigo:#4B0082; --indigo-hover:#5D14A0;
  --gold:#C9A24B; --rose:#C0577E; --teal:#1F8A63;
  --maple:#9A5B00; --maple-soft:#F7EFE0; /* เงินรอเก็บ/งานค้าง — โทนไม้เมเปิล (polish 2026-08-27) */
  --brand-gradient:linear-gradient(135deg,#4B0082,#900024);
  --ink:#1F2937; --body:#4B5563; --muted:#6B7280; --disabled:#9CA3AF;
  --bg:#F7F8FC; --card:#FFFFFF; --surface-2:#F2F4F8; --line:#E5E7EB;
  --ok:#10B981; --warn:#EF4444; --amber:#F59E0B; --info:#3B82F6;
  --r-lg:18px; --r-md:12px; --r-sm:10px;
  --shadow:0 10px 30px rgba(0,0,0,.05);
  --shadow-sm:0 1px 2px rgba(17,24,39,.05); --shadow-lg:0 18px 48px rgba(17,24,39,.12);
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;
  --focus:0 0 0 3px rgba(75,0,130,.16);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{font-family:'Prompt',-apple-system,'Segoe UI',sans-serif;background:var(--bg);color:var(--body);min-height:100dvh}
body.v2-modal-open{overflow:hidden}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:15px}
a{color:var(--indigo)}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--indigo);outline-offset:3px}
button:disabled,[aria-disabled="true"]{cursor:not-allowed}
@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ---- app frame ---- */
.v2-top{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;
  padding:14px 16px;padding-top:max(14px, env(safe-area-inset-top))}
.v2-top .brand{font-weight:700;font-size:15px;letter-spacing:.04em;position:relative;
  background:var(--brand-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.v2-top .brand::after{content:"✦";position:absolute;-webkit-text-fill-color:var(--gold);color:var(--gold);
  font-size:8px;top:-2px;right:-11px}
.v2-top .pagename{font-weight:700;font-size:15px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v2-top .date{margin-left:auto;color:var(--muted);font-size:12px;font-weight:500;white-space:nowrap}
.v2-top .classic{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;
  min-height:44px;min-width:44px;font-size:11.5px;font-weight:700;color:var(--muted);text-decoration:none;white-space:nowrap}
/* ปุ่มสลับหน้าร้าน / CEO เป็นจุดตัดสินใจหลัก จึงแยกจากปุ่มเครื่องมือข้างกันให้เห็นชัด */
.v2-top #v2-focusbtn{background:var(--brand-gradient);border-color:transparent;color:#fff;-webkit-text-fill-color:#fff;
  box-shadow:0 5px 14px rgba(75,0,130,.22)}
.v2-top #v2-focusbtn:hover{filter:brightness(1.06);color:#fff;-webkit-text-fill-color:#fff}
.v2-top #v2-focusbtn:active{transform:translateY(1px);box-shadow:0 2px 7px rgba(75,0,130,.2)}
.v2-main{max-width:1100px;margin:0 auto;padding:16px 16px calc(88px + env(safe-area-inset-bottom))}
.v2-badge{display:inline-block;background:#FFF3D6;color:var(--maple);border-radius:999px;padding:3px 10px;font-size:11px;font-weight:700}

/* ---- cards / tiles / rows ---- */
.v2-hero{background:var(--brand-gradient);border-radius:20px;color:#fff;
  padding:24px;margin-bottom:16px;box-shadow:0 14px 30px rgba(75,0,130,.18)}
.v2-hero small{font-size:12.5px;opacity:.85;font-weight:500;color:#fff}
.v2-hero .big{font-size:33px;font-weight:700;margin:2px 0 10px;color:#fff}
.v2-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.25);overflow:hidden}
.v2-bar i{display:block;height:100%;width:0%;background:#FFD9A0;border-radius:99px;transition:width .6s ease}
.v2-hero .goal{display:flex;justify-content:space-between;font-size:11.5px;margin-top:6px;opacity:.92;gap:8px;flex-wrap:wrap}
.v2-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(min-width:700px){.v2-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.v2-tile{background:var(--card);border:1px solid transparent;border-radius:var(--r-lg);padding:18px;min-width:0;box-shadow:var(--shadow)}
.v2-tile small{display:block;color:var(--muted);font-size:12px;font-weight:500;margin-bottom:4px}
.v2-tile b{font-size:19px;font-weight:700;color:var(--ink);white-space:nowrap}
.v2-tile b.ok{color:var(--ok)} .v2-tile b.warn{color:var(--warn)}
.v2-sec{display:flex;justify-content:space-between;align-items:baseline;margin:18px 2px 10px;gap:10px}
.v2-sec b{font-size:15px;font-weight:700}
.v2-sec .act,.v2-row .act,.v2-fold summary .act{font-size:12.5px;color:var(--indigo);font-weight:700;background:none;border:none;padding:8px 4px;min-height:44px;white-space:nowrap;cursor:pointer}
.v2-card{background:var(--card);border:1px solid transparent;border-radius:var(--r-lg);padding:24px;margin-bottom:16px;box-shadow:var(--shadow)}
.v2-note{color:var(--muted);font-size:13px;line-height:1.6}
.v2-rows{padding:4px 14px}
.v2-row{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line)}
.v2-row:last-child{border-bottom:none}
.v2-ava{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#F3E8ED,#EAE8F6);
  display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--burgundy);font-size:15px;flex-shrink:0}
.v2-row .mid{flex:1;min-width:0}
.v2-row .mid b{display:block;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v2-row .mid small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.v2-row .amt{text-align:right;flex-shrink:0}
.v2-row .amt b{font-size:14.5px;font-weight:700;display:block;white-space:nowrap}
.v2-pill{display:inline-block;font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;margin-top:2px}
.v2-pill{position:relative;padding-left:18px;border:1px solid transparent;line-height:1.45}
.v2-pill::before{content:"";position:absolute;left:7px;top:50%;width:5px;height:5px;border-radius:50%;background:currentColor;transform:translateY(-50%)}
.v2-pill.ok{background:#ECFDF5;color:#047857;border-color:#A7F3D0} .v2-pill.wait{background:#FFFBEB;color:#92400E;border-color:#FDE68A} .v2-pill.bad{background:#FEF2F2;color:#B91C1C;border-color:#FECACA}
.v2-pill.info{background:#EFF6FF;color:#1D4ED8;border-color:#BFDBFE}.v2-pill.neutral{background:#F3F4F6;color:#4B5563;border-color:#E5E7EB}
.v2-empty{text-align:center;color:var(--muted);font-size:13px;padding:22px 10px}
.v2-empty{display:grid;justify-items:center;gap:6px;line-height:1.65}
.v2-empty.loading::before,.v2-empty.error::before{content:"";width:28px;height:28px;border-radius:10px}
.v2-empty.loading::before{border:3px solid #E7E1EE;border-top-color:var(--indigo);border-radius:50%;background:none;animation:v2rot .75s linear infinite}
.v2-empty.error{color:#991B1B;background:#FEF2F2;border:1px solid #FECACA;border-radius:var(--r-md);margin:8px}.v2-empty.error::before{content:"!";display:grid;place-items:center;background:#FEE2E2;color:#B91C1C;font-weight:800}

/* ---- Aurora button system ----
   Variants: primary(default), secondary, outline, ghost, destructive,
   icon, loading, disabled and dropdown. Icons use the Lucide-style ICO set. */
.v2-btn{
  width:100%;min-height:44px;padding:11px 18px;border:1px solid transparent;border-radius:var(--r-md);
  display:inline-flex;align-items:center;justify-content:center;gap:8px;vertical-align:middle;
  background:var(--indigo);color:#fff;font-size:14px;font-weight:700;line-height:1.35;text-decoration:none;
  box-shadow:0 1px 2px rgba(0,0,0,.04);transition:background-color .16s ease,border-color .16s ease,
    color .16s ease,box-shadow .16s ease,transform .08s ease
}
.v2-btn:hover{background:var(--indigo-hover);color:#fff}
.v2-btn:active{transform:translateY(1px)}
.v2-btn:focus{outline:none}
.v2-btn:focus-visible{box-shadow:0 0 0 3px rgba(75,0,130,.16)}
.v2-btn .v2-ico{width:18px;height:18px}
.v2-btn.secondary{background:var(--surface-2);border-color:var(--surface-2);color:var(--ink);box-shadow:none}
.v2-btn.secondary:hover{background:#E5E7EB;color:var(--ink)}
.v2-btn.outline{background:#fff;border-color:#D1D5DB;color:var(--ink);box-shadow:none}
.v2-btn.outline:hover{background:#F9FAFB;border-color:var(--indigo);color:var(--indigo)}
.v2-btn.ghost{background:transparent;border-color:transparent;color:var(--ink);box-shadow:none}
.v2-btn.ghost:hover{background:#F4F1FA;color:var(--indigo)}
.v2-btn.destructive{background:var(--burgundy);border-color:var(--burgundy);color:#fff}
.v2-btn.destructive:hover{background:#73001D;border-color:#73001D;color:#fff}
.v2-btn.icon{width:44px;min-width:44px;padding:0;flex:0 0 44px}
.v2-btn.icon.sm{width:36px;min-width:36px;min-height:36px;padding:0;flex-basis:36px;border-radius:10px}
.v2-btn.sm{width:auto;min-height:36px;padding:8px 14px;font-size:13px;border-radius:10px}
.v2-btn.loading,.v2-btn[aria-busy="true"]{cursor:wait;pointer-events:none}
.v2-btn.loading .v2-ico,.v2-btn[aria-busy="true"] .v2-ico{animation:v2rot .75s linear infinite}
.v2-btn:disabled,.v2-btn.disabled,.v2-btn[aria-disabled="true"]{
  background:var(--surface-2);border-color:var(--surface-2);color:var(--disabled);
  box-shadow:none;cursor:not-allowed;pointer-events:none;transform:none
}
.v2-btn-group{display:flex;align-items:stretch}
.v2-btn-group>.v2-btn{width:auto;border-radius:12px 0 0 12px}
.v2-btn-group>.v2-btn.icon{border-radius:0 12px 12px 0;border-left-color:rgba(255,255,255,.22)}
.v2-dropdown{position:relative;display:inline-flex}
.v2-dropdown>.v2-btn{width:auto}
.v2-dropdown-menu{
  position:absolute;right:0;top:calc(100% + 8px);z-index:55;display:none;min-width:200px;padding:6px;
  background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px rgba(17,24,39,.14)
}
.v2-dropdown.open .v2-dropdown-menu{display:block}
.v2-dropdown-menu button,.v2-dropdown-menu a{
  width:100%;min-height:38px;padding:9px 10px;border:0;border-radius:8px;display:flex;align-items:center;gap:9px;
  background:transparent;color:var(--ink);font-family:inherit;font-size:13px;font-weight:600;line-height:1.4;
  text-align:left;text-decoration:none
}
.v2-dropdown-menu button:hover,.v2-dropdown-menu a:hover{background:#F4F1FA;color:var(--indigo)}
.v2-dropdown-menu .destructive{color:var(--warn)}
.v2-dropdown-menu .v2-ico{width:17px;height:17px}
@media(prefers-reduced-motion:reduce){.v2-btn{transition:none}.v2-btn.loading .v2-ico{animation-duration:1.5s}}
.v2-input{width:100%;border:1px solid #D1D5DB;border-radius:var(--r-md);padding:13px 14px;background:#fff;outline:none}
.v2-input:focus{border-color:var(--indigo);box-shadow:0 0 0 3px rgba(75,0,130,.10)}
.v2-input:hover:not(:disabled){border-color:#9CA3AF}
.v2-input:disabled{background:#F3F4F6;color:var(--disabled);border-color:var(--line)}
.v2-input[aria-invalid="true"],.v2-field.error .v2-input{border-color:#DC2626;background:#FFFBFB;box-shadow:0 0 0 3px rgba(220,38,38,.08)}
.v2-field.success .v2-input{border-color:#059669;background:#FBFFFD}
.v2-help,.v2-error,.v2-success{display:block;font-size:11.5px;line-height:1.55;margin-top:5px}.v2-help{color:var(--muted)}.v2-error{color:#B91C1C}.v2-success{color:#047857}
.v2-search{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #D1D5DB;border-radius:var(--r-md);padding:0 0 0 14px;margin-bottom:10px}
.v2-search svg{width:18px;height:18px;stroke:var(--muted);stroke-width:2;fill:none;flex-shrink:0}
.v2-search input{border:none;outline:none;font-size:15px;flex:1;background:transparent;padding:13px 0}
.v2-search button{border:none;background:var(--indigo);color:#fff;font-weight:700;font-size:13.5px;
  border-radius:0 12px 12px 0;padding:13px 18px;align-self:stretch}
.v2-search button:hover{background:var(--indigo-hover);color:#fff}
.v2-seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--surface-2);border-radius:12px;padding:3px;margin-bottom:12px}
.v2-seg button{border:none;background:transparent;padding:9px 4px;border-radius:10px;font-size:13px;font-weight:700;color:var(--muted)}
.v2-seg button:hover{color:var(--indigo)}
.v2-seg button.on{background:#fff;color:var(--indigo);box-shadow:0 2px 6px rgba(35,18,77,.10)}
.v2-chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:8px}
.v2-chip{flex-shrink:0;min-height:44px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:9px 14px;font-size:13px;font-weight:600;color:var(--ink)}
.v2-chip:hover{border-color:var(--indigo);color:var(--indigo)}
.v2-chip.on{background:var(--indigo);border-color:var(--indigo);color:#fff}
/* ปุ่มวิธีรับเงิน POS — grid 2 คอลัมน์เท่ากัน สมมาตร (2026-08-28) */
.pos-pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.pos-pay-grid .v2-chip{width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;text-align:center;white-space:normal;line-height:1.25;border-radius:12px;flex-shrink:1;padding:8px 10px}
.pos-pay-grid .v2-chip:last-child{grid-column:1 / -1}
.crm-insight-head{align-items:center}.crm-insight-head b{display:flex;align-items:center;gap:7px}.crm-insight-head .v2-ico{width:18px;height:18px}
.crm-bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
.crm-bento-card{min-width:0;min-height:126px;padding:17px;border:1px solid rgba(75,0,130,.06);border-radius:18px;background:#fff;box-shadow:var(--shadow);overflow:hidden;position:relative}
.crm-bento-card.span-2{grid-column:span 2}.crm-bento-card.span-4{grid-column:span 2}
.crm-bento-card small{display:block;color:var(--muted);font-size:11.5px;font-weight:700;margin-bottom:6px}
.crm-bento-card>strong{display:block;color:var(--ink);font-size:clamp(20px,4vw,29px);line-height:1.25;font-weight:800;overflow-wrap:anywhere}
.crm-bento-card p{color:var(--muted);font-size:11.5px;line-height:1.55;margin-top:7px}
.crm-bento-card.featured{background:var(--brand-gradient);border:0;color:#fff;box-shadow:0 14px 30px rgba(75,0,130,.18)}
.crm-bento-card.featured small,.crm-bento-card.featured strong,.crm-bento-card.featured p{color:#fff}.crm-bento-card.featured small,.crm-bento-card.featured p{opacity:.85}
.crm-bento-card.period::after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;right:-28px;bottom:-32px;background:rgba(201,162,75,.13)}
.crm-bento-card.top-product{background:linear-gradient(145deg,#FFF9EC,#FFF);border-color:rgba(201,162,75,.18)}
.crm-bento-card.top-product>strong{font-size:19px;color:var(--maple)}
.crm-bento-card.trend{background:linear-gradient(145deg,#F7F2FB,#FFF)}
.crm-bento-card.trend ul{list-style:none;display:grid;gap:7px;margin-top:8px}.crm-bento-card.trend li{color:var(--body);font-size:12px;line-height:1.45;padding-left:14px;position:relative}.crm-bento-card.trend li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.crm-bento-card.product-list{min-height:auto}.crm-bento-card.product-list>small{margin-bottom:10px}
.crm-product-row{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:9px;align-items:center;padding:7px 0}.crm-product-row>b{width:20px;height:20px;border-radius:7px;background:#F4F1FA;color:var(--indigo);display:grid;place-items:center;font-size:10px}.crm-product-row span{min-width:0}.crm-product-row em{display:block;color:var(--ink);font-size:11.5px;font-weight:700;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.crm-product-row i{display:block;height:4px;background:linear-gradient(90deg,var(--indigo),var(--burgundy));border-radius:99px;margin-top:4px}.crm-product-row>strong{font-size:11.5px;color:var(--ink);white-space:nowrap}
.crm-insight-foot{color:var(--muted);font-size:10.5px;line-height:1.6;margin:0 3px 14px}
@media(min-width:700px){.crm-bento{grid-template-columns:repeat(4,minmax(0,1fr))}.crm-bento-card.span-4{grid-column:span 4}.crm-bento-card{min-height:132px}.crm-bento-card.featured>strong{font-size:34px}}
.v2-field{margin-bottom:12px}
.v2-field label{display:block;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:6px}
select.v2-input{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2371708A' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}

/* ---- stepper ---- */
.v2-step{display:flex;align-items:center;gap:8px}
.v2-step button{width:32px;height:32px;border-radius:10px;border:1.5px solid var(--line);background:#fff;font-size:17px;font-weight:700;color:var(--indigo)}
.v2-step button:hover{border-color:var(--indigo);color:var(--indigo)}
.v2-step b{min-width:20px;text-align:center}

/* ---- dock / rail ---- */
.v2-dock{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:flex-end;
  background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-top:1px solid var(--line);
  padding:6px 6px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -6px 24px rgba(35,18,77,.08)}
.v2-dock button{flex:1;min-height:46px;border:none;background:transparent;display:flex;flex-direction:column;
  align-items:center;gap:3px;font-size:10.5px;font-weight:700;color:var(--disabled)}
.v2-dock button svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.v2-dock button.on{color:var(--indigo)}
.v2-dock button:hover,.v2-dock button:focus,.v2-dock button:active{background:transparent;color:var(--indigo)}
.v2-dock .fab{margin-top:-24px;overflow:visible;position:relative}
.v2-dock .fab i{width:50px;height:50px;border-radius:17px;background:linear-gradient(135deg,var(--burgundy),var(--indigo));
  display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(49,46,129,.38);font-style:normal;position:relative;z-index:2}
.v2-dock .fab svg{stroke:#fff}
.v2-dock .fab span{color:var(--disabled)}
.v2-dock .fab.on span,.v2-dock .fab:hover span{color:var(--burgundy)}
@media(min-width:1024px){
  .v2-dock{left:0;right:auto;top:0;bottom:0;width:88px;flex-direction:column;align-items:center;justify-content:flex-start;
    gap:6px;border-top:none;border-right:1px solid var(--line);padding:80px 8px 12px;box-shadow:none}
  .v2-dock button{flex:0 0 auto;width:100%;min-height:60px;border-radius:var(--r-md)}
  .v2-dock button:hover{background:#F4F1FA}
  .v2-dock .fab{margin-top:0}
  .v2-main{margin-left:max(88px, calc((100vw - 1192px) / 2));padding-bottom:40px}
  .v2-top{padding-left:104px}
}

/* ---- paybar ---- */
.v2-paybar{position:fixed;left:0;right:0;bottom:calc(64px + env(safe-area-inset-bottom));z-index:35;padding:0 12px;display:none}
.v2-paybar .in{max-width:560px;margin:0 auto;background:var(--indigo);color:#fff;border-radius:16px;
  display:flex;align-items:center;justify-content:space-between;padding:14px 18px;
  box-shadow:0 12px 28px rgba(109,33,60,.35);cursor:pointer;border:none;width:100%}
.v2-paybar .in:hover{background:var(--indigo-hover)}
.v2-paybar b{font-size:16.5px;font-weight:700;color:#fff}
.v2-paybar span{font-size:14px;font-weight:700;color:#fff}
@media(min-width:1024px){.v2-paybar{left:88px;bottom:16px}}

/* ---- sheet (modal) ---- */
.v2-sheet-wrap{position:fixed;inset:0;z-index:60;background:rgba(17,24,39,.42);backdrop-filter:blur(6px);
  display:none;align-items:flex-end;justify-content:center}
.v2-sheet-wrap.open{display:flex}
@media(min-width:700px){.v2-sheet-wrap{align-items:center}}
.v2-sheet{background:#fff;border-radius:20px 20px 0 0;width:100%;max-width:560px;max-height:88dvh;overflow-y:auto;
  padding:24px 24px calc(24px + env(safe-area-inset-bottom));box-shadow:0 25px 50px rgba(0,0,0,.15)}
@media(min-width:700px){.v2-sheet{border-radius:20px}}
.v2-sheet h3{font-size:16.5px;font-weight:700;margin-bottom:12px}
.v2-sheet:focus{outline:none}.v2-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.v2-sheet-close{width:40px;height:40px;flex:0 0 40px;border:0;border-radius:12px;background:var(--surface-2);color:var(--muted);font-size:20px}.v2-sheet-close:hover{background:#E5E7EB;color:var(--ink)}
.v2-kv{display:flex;justify-content:space-between;gap:10px;padding:7px 0;font-size:14px}
.v2-kv small{color:var(--muted)} .v2-kv b{text-align:right}
/* เส้นคั่นบางระหว่างแถวในการ์ด (2026-08-14) — แยกแถวให้อ่านง่ายแบบตาราง; POS summary คงแน่นไม่ใส่เส้น */
.v2-card .v2-kv{border-bottom:1px solid var(--line);align-items:center;padding:9px 0}
.v2-card .v2-kv:last-child{border-bottom:none}
.pos-sum .v2-kv{border-bottom:none;padding:5px 0}
.v2-total-line{display:flex;justify-content:space-between;border-top:1.5px solid var(--line);margin-top:8px;padding-top:12px;font-size:16px}
.v2-total-line b{font-size:20px;color:var(--burgundy)}

/* ---- login ---- */
.v2-login{width:min(100%,520px);margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;justify-content:center;text-align:center;
  padding:clamp(18px,4vw,42px);box-sizing:border-box}
.v2-login .logo{font-size:clamp(28px,4vw,36px);font-weight:700;letter-spacing:.16em;position:relative;display:inline-block;
  background:var(--brand-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.v2-login .logo::after{content:"✦";position:absolute;-webkit-text-fill-color:var(--gold);color:var(--gold);
  font-size:.35em;top:-.1em;right:-.55em}
.v2-login .sub{color:var(--muted);font-size:clamp(13px,2vw,15px);margin:5px 0 28px}
.v2-dots{display:flex;justify-content:center;gap:12px;margin-bottom:26px}
.v2-dots i{width:14px;height:14px;border-radius:50%;border:2px solid #D1D5DB;transition:all .12s}
.v2-dots i.f{background:var(--burgundy);border-color:var(--burgundy)}
.v2-pad{display:grid;grid-template-columns:repeat(3,1fr);justify-items:center;align-items:center;gap:clamp(10px,3vw,18px);max-width:340px;margin:0 auto}
.v2-pad button{width:clamp(60px,18vw,84px);height:clamp(60px,18vw,84px);flex:none;border-radius:50%;border:1.5px solid var(--line);background:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(22px,3vw,28px);font-weight:700;color:var(--ink);box-shadow:0 8px 20px rgba(33,26,36,.06);
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease,background .12s ease,color .12s ease}
.v2-pad button:hover{border-color:var(--indigo);color:var(--indigo);box-shadow:0 10px 22px rgba(75,0,130,.14)}
.v2-pad button:active{background:var(--brand-gradient);border-color:transparent;color:#fff;transform:scale(.92);box-shadow:0 4px 14px rgba(75,0,130,.28)}
.v2-pad button[data-k="C"],.v2-pad button[data-k="⌫"]{color:var(--muted);font-size:16px;background:#FBFAFD;box-shadow:none}
.v2-pad button[data-k="C"]:active,.v2-pad button[data-k="⌫"]:active{background:#F4F1FA;color:var(--ink);border-color:var(--line);transform:scale(.92)}
.v2-login .err{color:var(--warn);font-size:13px;font-weight:700;min-height:20px;margin-top:14px}
.v2-login .v2-link{background:none;border:none;color:var(--indigo);font-size:13.5px;font-weight:600;
  margin-top:22px;padding:8px 10px;text-decoration:none;align-self:center}
.v2-login .v2-link:hover{text-decoration:underline}
.shake{animation:v2shake .4s}
@keyframes v2shake{20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
@media(max-width:420px){
  .v2-login{width:100%;padding-left:14px;padding-right:14px}
  .v2-top{gap:7px;padding-left:12px;padding-right:12px}
  .v2-top .date{display:none}
  .v2-top .brand{font-size:13px}
  .v2-top .menu-label{display:none}
  .v2-top #v2-allmenu{padding:0;width:44px;justify-content:center}
  .v2-top #v2-allmenu .v2-ico{width:20px!important;height:20px!important}
  .v2-chips{flex-wrap:wrap;overflow:visible}
}

/* ---- toast / skeleton ---- */
#v2-toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom));
  z-index:70;background:var(--brand-gradient);color:#fff;border:1px solid rgba(255,255,255,.16);
  border-radius:14px;padding:12px 20px;font-size:13.5px;font-weight:600;line-height:1.5;
  box-shadow:0 12px 30px rgba(49,46,129,.35);display:none;max-width:88vw;text-align:center;animation:v2toast .22s ease}
@keyframes v2toast{from{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.v2-skel{background:linear-gradient(90deg,#EFEDF5,#F7F6FB,#EFEDF5);background-size:200% 100%;
  animation:v2sk 1.2s linear infinite;border-radius:8px;color:transparent !important;pointer-events:none}
@keyframes v2sk{to{background-position:-200% 0}}
.v2-spin{display:inline-block;width:16px;height:16px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:v2rot .7s linear infinite;vertical-align:-3px}
@keyframes v2rot{to{transform:rotate(360deg)}}

/* ---- semantic feedback / data presentation ---- */
.v2-alert{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid;border-radius:var(--r-md);font-size:12.5px;line-height:1.65;margin:10px 0}
.v2-alert::before{content:"i";display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:50%;font-weight:800;font-family:Georgia,serif}
.v2-alert.info{color:#1E40AF;background:#EFF6FF;border-color:#BFDBFE}.v2-alert.info::before{background:#DBEAFE}
.v2-alert.success{color:#065F46;background:#ECFDF5;border-color:#A7F3D0}.v2-alert.success::before{content:"✓";background:#D1FAE5;font-family:inherit}
.v2-alert.warning{color:#78350F;background:#FFFBEB;border-color:#FDE68A}.v2-alert.warning::before{content:"!";background:#FEF3C7;font-family:inherit}
.v2-alert.danger{color:#991B1B;background:#FEF2F2;border-color:#FECACA}.v2-alert.danger::before{content:"!";background:#FEE2E2;font-family:inherit}
.v2-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.v2-table{width:100%;border-collapse:collapse;font-size:13px}.v2-table th{padding:11px 12px;background:var(--surface-2);color:var(--muted);font-size:11.5px;text-align:left;white-space:nowrap}.v2-table td{padding:12px;border-top:1px solid var(--line);vertical-align:top}.v2-table tr:hover td{background:#FCFBFD}
@media(max-width:620px){.v2-table.responsive thead{display:none}.v2-table.responsive,.v2-table.responsive tbody,.v2-table.responsive tr,.v2-table.responsive td{display:block;width:100%}.v2-table.responsive tr{padding:10px 12px;border-top:1px solid var(--line)}.v2-table.responsive tr:first-child{border-top:0}.v2-table.responsive td{display:flex;justify-content:space-between;gap:16px;padding:5px 0;border:0;text-align:right}.v2-table.responsive td::before{content:attr(data-label);color:var(--muted);font-size:11.5px;text-align:left}.v2-card{padding:18px}.v2-row{align-items:flex-start}.v2-row .amt{max-width:42%}}

/* item picker */
.v2-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@media(min-width:700px){.v2-items{grid-template-columns:repeat(3,minmax(0,1fr))}}
.v2-item{background:#fff;border:1.5px solid var(--line);border-radius:var(--r-md);padding:11px 12px;text-align:left}
.v2-item:hover{border-color:var(--indigo)}
.v2-item b{display:block;font-size:13px;font-weight:700;color:var(--ink);line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
.v2-item small{color:var(--muted);font-size:11px}
.v2-item .p{display:block;color:var(--burgundy);font-weight:700;font-size:14px;margin-top:3px}

/* ---- icon system ---- */
.v2-ico{width:16px;height:16px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;flex-shrink:0}
.qa-ic svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.qa-tile{padding:14px 8px}
.qa-tile small{justify-content:center}
.qa-tile .qa-ic{color:var(--indigo)}
.qa-tile.cat-main .qa-ic{color:var(--indigo)}
.qa-tile.cat-cust .qa-ic{color:var(--rose)}
.v2-tile small{display:flex;align-items:center;gap:6px}
.v2-tile small .v2-ico{width:14px;height:14px;color:var(--indigo)}
.v2-sec b{display:flex;align-items:center;gap:0}
.v2-sec b .v2-ico{color:var(--indigo);margin-right:7px}
.v2-menu-link{display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;font-size:14px}
.v2-menu-link .v2-ico{width:19px;height:19px;color:var(--indigo)}
.v2-menu-link span{margin-left:auto;color:var(--muted);font-size:12px;font-weight:500}
.v2-field label{display:flex;align-items:center;gap:6px}
.v2-field label .v2-ico{width:14px;height:14px;color:var(--indigo)}

/* ---- responsive: iPad full width, desktop rich layout ---- */
@media(min-width:700px) and (max-width:1023px){
  .v2-main{max-width:none;padding-left:24px;padding-right:24px}
}
@media(min-width:1024px){
  .v2-main{max-width:1280px;padding-left:28px;padding-right:28px}
  .v2-hero .big{font-size:40px}
}
.home-cols{display:grid;grid-template-columns:1fr;gap:0 16px}
@media(min-width:900px){.home-cols{grid-template-columns:1fr 1fr}}
.pos-grid{display:grid;grid-template-columns:1fr;gap:0 18px;align-items:start}
.pos-left,.pos-right{min-width:0}
.pos-serial{padding:0 2px 12px;margin-top:-2px}
.pos-serial label{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:#B45309;margin-bottom:5px}
.pos-serial label .v2-ico{width:14px;height:14px;color:var(--amber)}
.pos-serial input{padding:9px 11px}
@media(min-width:900px){
  .pos-grid{grid-template-columns:minmax(0,1fr) minmax(340px,400px)}
  .pos-right{position:sticky;top:76px}
  .v2-paybar{display:none !important}
}
.pos-sum{border-top:1.5px solid var(--line);margin-top:12px;padding-top:10px}
.pos-sum .v2-kv{padding:5px 0}
@media(max-width:899px){.pos-desk-only{display:none}}
.bf-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-radius:14px;background:#F4F1FB;border:1px solid #D9D0F0;margin-bottom:10px;color:var(--indigo)}
.bf-summary.trust{box-shadow:0 2px 8px rgba(86,65,145,.06)}
.bf-summary b{font-size:14px}.bf-summary span{font-size:18px;font-weight:800;white-space:nowrap}
.bf-summary.urgent{background:#FFF1ED;border-color:#F3AA95;color:#9B2C18}.bf-search-more{border:1px solid var(--line);border-radius:12px;padding:9px 11px;margin-bottom:11px;background:#FAFAFC}.bf-search-more summary{cursor:pointer;font-size:12px;font-weight:700;color:var(--muted)}
.bf-section{font-size:12px;font-weight:800;color:var(--maple);margin:14px 2px 7px}.bf-section.danger{color:#A93620}.bf-section.verify{color:var(--maple);background:#FFF8E8;border-radius:9px;padding:8px}.bf-section.muted{color:var(--muted);border-top:1px solid var(--line);padding-top:12px}.bf-all-clear{padding:12px;border:1px solid #B9E3CA;border-radius:13px;background:#F4FFF8;color:#147A45;font-size:13px;font-weight:700;margin-bottom:10px}
.bf-card{border:1.5px solid var(--line);border-left-width:5px;border-radius:15px;padding:13px 14px;margin-bottom:9px;background:#fff}
.bf-card.due{border-color:#C9BDEB;border-left-color:var(--indigo);background:#FCFAFF}.bf-card.done{border-color:#B9E3CA;border-left-color:#159957;background:#F8FFFA}.bf-card.neutral{border-color:#D8DCE5;border-left-color:#8B93A3;background:#FBFCFE}
.bf-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.bf-head>div{min-width:0}.bf-name{font-size:15px;font-weight:800;color:var(--ink);line-height:1.4}.bf-contact{font-size:11.5px;color:var(--muted);margin-top:2px;word-break:break-word}
.bf-item{font-size:12.5px;font-weight:650;color:var(--ink);margin-top:9px;line-height:1.5}.bf-booking{font-size:11.5px;color:var(--indigo);background:#F3F0FA;border-radius:8px;padding:5px 8px;margin-top:6px;display:inline-block}
.bf-money{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}.bf-money div{background:#F6F7FA;border-radius:9px;padding:7px 8px}.bf-money small{display:block;font-size:10px;color:var(--muted)}.bf-money b{display:block;font-size:13px;margin-top:2px}.bf-money .due b{color:var(--indigo)}.bf-action{width:100%;min-height:48px;margin-top:10px;background:var(--indigo);border-color:var(--indigo);color:#fff!important}.bf-action:hover{filter:brightness(.9);border-color:var(--indigo);color:#fff!important}
@media(max-width:420px){.bf-money{gap:4px}.bf-money div{padding:7px 6px}.bf-money b{font-size:12px}.bf-summary span{font-size:16px}}
.v2-items{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:700px){.v2-items{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1024px){
  .v2-seg{max-width:560px}
  #s-list .v2-row,#h-recent .v2-row{padding:13px 6px}
}

/* ---- decorative art ---- */
.v2-hero{position:relative;overflow:hidden}
.v2-hero>*{position:relative;z-index:1}
.hero-art{position:absolute;right:-34px;top:-40px;width:200px;height:200px;opacity:.16;z-index:0;pointer-events:none}
.login-art{position:absolute;left:50%;top:-70px;transform:translateX(-50%);width:340px;height:340px;opacity:.5;pointer-events:none;z-index:0}
.v2-login{position:relative}
.v2-login>*{position:relative;z-index:1}
.v2-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:26px 10px}
.v2-empty svg{width:46px;height:46px;opacity:.42;stroke:currentColor}
/* ---- ported guide content ---- */
.v2-guide{line-height:1.7;font-size:14px}
.v2-guide h2{font-size:20px;margin:6px 0 10px}
.v2-guide h3{font-size:15.5px;margin:16px 0 8px}
.v2-guide p,.v2-guide li{color:var(--ink);font-size:13.5px}
.v2-guide small{color:var(--muted)}
.v2-guide b{font-weight:700}
.v2-guide div[class]{border:none}
.v2-guide .qa-item,.v2-guide .field-hint-card,.v2-guide .statement-mini-card,.v2-guide .statement-rule-card{
  background:#F8F7FC;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:8px 0}
.v2-guide details{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:8px 0;background:#fff}
.v2-guide summary{font-weight:700;cursor:pointer}
.v2-guide textarea,.v2-guide input,.v2-guide select{width:100%;border:1px solid var(--line);border-radius:10px;padding:9px;font-size:13px;margin:4px 0}
.v2-guide code{background:var(--surface-2);border-radius:5px;padding:1px 6px;font-size:12px}
.v2-guide a{color:var(--indigo)}
.v2-guide i.fas,.v2-guide i.far,.v2-guide i.fab{display:none}
/* ---- full rail (desktop) + menu launcher ---- */
.v2-rail{display:none}
@media(min-width:1024px){
  .v2-dock{display:none !important}
  .v2-rail{display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;width:280px;z-index:40;
    background:#fff;border-right:1px solid var(--line);padding:20px 14px 16px;overflow-y:auto;gap:2px}
  .v2-rail .rail-brand{font-weight:700;letter-spacing:.1em;font-size:16px;padding:2px 10px 10px;
    background:var(--brand-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
  .v2-rail .grp{font-size:10.5px;font-weight:700;letter-spacing:.08em;color:var(--muted);padding:12px 10px 4px;text-transform:uppercase}
  .v2-rail button,.v2-rail .rail-link{display:flex;align-items:center;gap:10px;width:100%;border:none;background:transparent;
    min-height:44px;padding:9px 10px;border-radius:10px;font-size:13.5px;font-weight:600;color:var(--ink);text-decoration:none;text-align:left}
  .v2-rail .v2-ico{width:20px;height:20px;color:var(--muted)}
  .v2-rail button:hover,.v2-rail .rail-link:hover{background:#F4F1FA;color:var(--indigo)}
  .v2-rail button.on{background:var(--indigo);color:#fff;font-weight:700}
  .v2-rail button.on .v2-ico{color:#fff}
  .v2-rail .rail-out{color:var(--warn);margin-top:auto}
  .v2-rail .rail-out .v2-ico{color:var(--warn)}
  .v2-rail .rail-out:hover{background:#FEF2F2;color:#DC2626}
  .v2-main{margin-left:max(280px, calc((100vw - 1000px) / 2)) !important;padding-bottom:40px}
  .v2-top{padding-left:296px !important}
  .v2-paybar{left:280px !important}
}
@media(min-width:1600px){
  .v2-main{max-width:1440px;margin-left:max(280px, calc((100vw - 1160px) / 2)) !important}
}
.menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:6px}
@media(min-width:700px){.menu-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1024px){.menu-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.menu-tile{background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:18px 12px;
  display:flex;flex-direction:column;align-items:center;gap:9px;cursor:pointer;
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
.menu-tile:hover{border-color:var(--indigo)}
.menu-tile:active{transform:scale(.96);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.menu-tile .mi{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#F3E8ED,#EAE8F6);
  display:flex;align-items:center;justify-content:center;color:var(--burgundy)}
.menu-tile .mi .v2-ico{width:21px;height:21px}
.menu-tile b{font-size:12.5px;font-weight:700;color:var(--ink);text-align:center;line-height:1.4}
/* category tint system — each menu group gets one brand accent (matches member.devessa.co palette) */
.menu-tile.cat-main .mi{background:rgba(75,0,130,.10);color:var(--indigo)}
.menu-tile.cat-cust .mi{background:rgba(192,87,126,.12);color:var(--rose)}
.menu-tile.cat-biz .mi{background:rgba(144,0,36,.10);color:var(--burgundy)}
.menu-tile.cat-money .mi{background:rgba(201,162,75,.16);color:var(--gold)}
.menu-tile.cat-sys .mi{background:rgba(31,138,99,.12);color:var(--teal)}
.cat-dot{width:5px;height:14px;border-radius:3px;display:inline-block;margin-right:8px;vertical-align:-2px}
.cat-dot.cat-main{background:var(--indigo)}
.cat-dot.cat-cust{background:var(--rose)}
.cat-dot.cat-biz{background:var(--burgundy)}
.cat-dot.cat-money{background:var(--gold)}
.cat-dot.cat-sys{background:var(--teal)}
/* ---- offline / draft bar ---- */
#v2-offline{position:sticky;top:53px;z-index:29;text-align:center;font-size:12.5px;font-weight:700;padding:8px 12px;cursor:pointer}
#v2-offline.off{background:#4A2535;color:#FFD9A0}
#v2-offline.pending{background:#FFFBEB;color:#B45309}
#v2-offline u{text-decoration:underline}
@media(min-width:1024px){#v2-offline{top:0;margin-left:280px}}

/* Polish pass 2026-07-08: breathing room + spacing fixes */
.v2-guide summary small{margin-left:8px}
@media(max-width:1023px){body.paybar-on .v2-main{padding-bottom:calc(150px + env(safe-area-inset-bottom))}}
@media(min-width:1024px){
  .pos-right .v2-chips{flex-wrap:wrap;overflow:visible}
}

/* ---- attention cards (🔔 ต้องจัดการ) ---- */
.att-card{width:100%;text-align:left;cursor:pointer;display:flex;gap:12px;align-items:center;padding:13px 14px;margin-bottom:8px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);box-shadow:var(--shadow);font-family:inherit;transition:transform .12s ease}
.att-card:active{transform:scale(.985)}
.att-card .ic{width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0}
.att-card .tx{min-width:0;flex:1}
.att-card b{font-size:14px;display:block;color:var(--ink);line-height:1.45}
.att-card small{color:var(--muted);font-size:12px;display:block;margin-top:1px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-card .go{color:var(--muted);font-weight:700;font-size:17px;flex-shrink:0}
.att-red{background:#FDF6F6;border-color:#F3DBDB}.att-red .ic{background:#FBEAEA}
.att-amber{background:#FDFAF3;border-color:#F0E4CB}.att-amber .ic{background:#FDF1E3}
.att-indigo{background:#F7F7FC;border-color:#E3E1F2}.att-indigo .ic{background:#EAEDF8}
/* ต้องจัดการ แบบลิสต์แบน (enterprise) — แทน .att-card เดิม 2026-08-14 */
.att-list{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-sm);overflow:hidden}
.att-row{width:100%;display:flex;align-items:center;gap:12px;padding:12px 16px;background:none;border:none;border-bottom:1px solid var(--line);text-align:left;font-family:inherit;cursor:pointer}
.att-row:last-child{border-bottom:none}
.att-row:hover,.att-row:active{background:var(--surface-2)}
.att-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.att-dot.red{background:var(--warn)}
.att-dot.amber{background:var(--amber)}
.att-dot.indigo{background:var(--indigo)}
.att-row .tx{flex:1;min-width:0}
.att-row .tx b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.45}
.att-row .tx small{display:block;color:var(--muted);font-size:12px;line-height:1.5;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-row .n{font-size:13px;font-weight:700;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.att-row .go{color:var(--disabled);font-weight:600;font-size:16px;flex-shrink:0}
/* ---- ส่วนพับได้บนหน้าภาพรวม CEO (details/summary) 2026-08-14 ---- */
.v2-fold{margin:18px 0 0}
.v2-fold>summary{list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;margin:0 2px;padding:4px 0;-webkit-user-select:none;user-select:none}
.v2-fold>summary::-webkit-details-marker{display:none}
.v2-fold>summary b{font-size:15px;font-weight:700;display:flex;align-items:center;color:var(--ink)}
.v2-fold>summary b .v2-ico{color:var(--indigo);margin-right:7px}
.v2-fold>summary b span{margin-left:5px}
.v2-fold .fold-sum{margin-left:auto;color:var(--muted);font-size:12.5px;font-weight:600;white-space:nowrap}
.v2-fold .fold-arrow{color:var(--disabled);font-size:11px;flex-shrink:0;transition:transform .15s ease}
.v2-fold[open] .fold-arrow{transform:rotate(180deg)}
.v2-fold>.v2-card,.v2-fold>.v2-note{margin-top:8px}
/* ---- Enterprise calm pass (2026-08-14): ลดเงา/ลดสีตะโกน ให้ตัวเลขนำ — override บล็อกเดิมด้านบน ---- */
.v2-hero{background:var(--card);border:1px solid var(--line);color:var(--ink);box-shadow:var(--shadow-sm);border-radius:var(--r-lg);padding:20px 24px}
.v2-hero small{color:var(--muted);opacity:1}
.v2-hero .big{color:var(--ink);font-size:32px}
@media(min-width:700px){.v2-hero .big{font-size:36px}}
.v2-bar{background:var(--surface-2)}
.v2-bar i{background:var(--brand-gradient)}
.v2-hero .goal{color:var(--muted);opacity:1}
.hero-art{display:none}
.v2-card{border-color:var(--line);box-shadow:var(--shadow-sm)}
.v2-tile{border-color:var(--line);box-shadow:var(--shadow-sm)}
/* ---- Indigo Ledge theme (พี่เกทเลือก B, 2026-08-14): สันม่วง indigo นำสายตา ตัวเลขเน้นม่วง ---- */
.v2-hero{border-left:6px solid var(--indigo)}
.v2-hero small{color:var(--indigo);font-weight:600}
.v2-hero .big{color:var(--indigo)}
.pos-success-mark{width:58px;height:58px;margin:0 auto 10px;border-radius:18px;display:grid;place-items:center;background:var(--brand-gradient);color:#fff;font-size:42px;font-weight:700;line-height:1;box-shadow:0 8px 18px rgba(75,0,130,.22)}
.v2-bar{background:#EEEBF5}
.v2-tile{border-left:4px solid var(--indigo)}
.v2-tile b{color:var(--indigo)}
.v2-tile b.ok{color:var(--ok)}.v2-tile b.warn{color:var(--warn)}
.att-row .n{color:var(--indigo)}
.v2-fold .fold-sum{color:var(--indigo)}
.qa-tile.cat-cust .qa-ic{color:var(--indigo)}

/* ป้ายแจ้งเตือน KYC */
.kyc-badge{position:absolute; top:6px; right:10px; min-width:18px; height:18px; padding:0 5px;
  border-radius:100px; background:#C62B4E; color:#fff; font-size:10px; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center; font-style:normal;}
.menu-tile .kyc-badge{top:8px; right:8px;}
.kyc-dot{position:absolute; top:6px; right:16px; width:8px; height:8px; border-radius:100px; background:#C62B4E;}

/* ---- mini fulfillment stepper (การ์ดออเดอร์รอของ) ---- */
.wo-mini{display:flex;align-items:center;margin:12px 0 0}
.wo-md{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none;line-height:1}
.wo-md.done{background:var(--indigo);color:#fff}
.wo-md.now{background:linear-gradient(135deg,#4B0082,#900024);color:#fff;box-shadow:0 0 0 3px rgba(75,0,130,.14)}
.wo-md.now.late{background:var(--amber);box-shadow:0 0 0 3px rgba(245,158,11,.18)}
.wo-md.wait{background:#fff;border:2px solid var(--line);color:var(--disabled)}
.wo-ln{height:2px;flex:1;border-radius:2px;background:var(--line)}
.wo-ln.on{background:var(--indigo)}
.wo-mlab{display:flex;margin-top:6px;font-size:10.5px;color:var(--muted)}
.wo-mlab span{flex:1;text-align:center}
.wo-mlab span:first-child{text-align:left}
.wo-mlab span:last-child{text-align:right}
.wo-mlab span.cur{color:var(--burgundy);font-weight:700}
.wo-mlab span.cur.late{color:var(--amber)}

/* ---- loading skeleton หน้ารอของ (wo-list / wo-torus) ---- */
.wo-skel{display:grid;gap:10px;padding:6px 2px}
.wo-skel .sk{height:64px;border-radius:14px;background:linear-gradient(90deg,#F1F1F5 25%,#E9E9EF 37%,#F1F1F5 63%);background-size:400% 100%;animation:skShine 1.4s ease infinite}
@keyframes skShine{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media (prefers-reduced-motion: reduce){.wo-skel .sk{animation:none}}

/* ================= Tactile press feedback (2026-08-14) — แตะแล้วรู้สึก "ยุบ-เด้ง" ================= */
/* ปุ่ม/ชิป/ไทล์/แถวที่กดได้ ยุบเล็กน้อยตอนกดแล้วสปริงกลับ (haptic สั่นเพิ่มใน v2.js) */
.v2-btn{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .09s cubic-bezier(.34,1.56,.64,1)}
.v2-btn:active{transform:scale(.96)}
.v2-chip{transition:background .14s ease,border-color .14s ease,color .14s ease,transform .09s cubic-bezier(.34,1.56,.64,1)}
.v2-chip:active{transform:scale(.94)}
.qa-tile{transition:transform .1s cubic-bezier(.34,1.56,.64,1),box-shadow .12s ease}
.qa-tile:active{transform:scale(.95);box-shadow:0 2px 10px rgba(75,0,130,.12)}
.v2-tile:active{transform:scale(.985)}
.att-row{transition:background .12s ease,transform .09s cubic-bezier(.34,1.56,.64,1)}
.att-row:active{transform:scale(.99)}
.v2-dock button{transition:color .14s ease,transform .1s cubic-bezier(.34,1.56,.64,1)}
.v2-dock button:active{transform:scale(.9)}
.v2-dock .fab:active{transform:scale(.9)}
/* แถวลิสต์ที่กดเปิดรายละเอียดได้ (ลูกค้า/บิล/นัด/รอของ) */
[data-si]:active,[data-i]:active,[data-ck]:active,.v2-row[style*="cursor"]:active{transform:scale(.99);transition:transform .09s cubic-bezier(.34,1.56,.64,1)}
/* ปุ่มลิงก์ข้อความ (บิลย้อนหลัง/จัดการ/กติกา ›) */
.act:active,.v2-sec .act:active{transform:scale(.94);transition:transform .09s ease}
/* วาบเบา ๆ ตอนแตะ (v2.js เติมคลาส .tapping ตอน pointerdown) — ครอบทุก element ที่กดได้แม้ตัวที่ไม่มี :active */
.tapping{filter:brightness(.97)}
@media(prefers-reduced-motion:reduce){
  .v2-btn:active,.v2-chip:active,.qa-tile:active,.v2-tile:active,.att-row:active,.v2-dock button:active,[data-si]:active,[data-i]:active,[data-ck]:active,.act:active{transform:none}
}

/* Organization work panel: existing brand tokens, single-column on phones. */
#enterprise-ops { margin-bottom:24px; }
#enterprise-ops .v2-card { padding:18px; margin-bottom:14px; }
.enterprise-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:12px; align-items:end; margin:16px 0; }
.enterprise-form .v2-field { display:flex; flex-direction:column; gap:6px; }
.enterprise-form .v2-input { min-width:0; width:100%; box-sizing:border-box; }
.enterprise-row { border-bottom:1px solid #e9e5ee; padding:14px 0; overflow-wrap:anywhere; }
[data-enterprise-message][role="alert"] { color:#900024; font-weight:500; }