:root{--forest:oklch(31% .06 125);--forest-soft:oklch(40% .065 120);--leaf:oklch(55% .08 112);--chilli:oklch(49% .18 27);--mango:oklch(79% .14 83);--paper:oklch(96% .018 85);--surface:oklch(99% .008 85);--ink:oklch(25% .025 60);--muted:oklch(49% .018 80);--line:oklch(86% .022 82);--good:oklch(57% .11 145);--warn:oklch(63% .15 55)}
*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Mitr","Leelawadee UI",sans-serif;font-weight:300}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}.admin-brand{display:flex;align-items:center;gap:12px;text-decoration:none}.admin-brand>span{display:grid;width:46px;height:46px;place-items:center;border-radius:50%;background:var(--chilli);color:var(--surface);font-weight:600}.admin-brand>div{display:grid}.admin-brand strong{font-size:18px;font-weight:500}.admin-brand small{font-size:11px;opacity:.68}
.login-shell{display:grid;grid-template-columns:minmax(390px,.92fr) 1.08fr;min-height:100svh}.login-brand{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(32px,5vw,72px);background:var(--forest);color:var(--surface)}.login-brand>div:last-child{max-width:620px;padding:80px 0}.login-brand p{margin:0 0 14px;color:var(--mango);font-weight:500}.login-brand h1{margin:0 0 28px;font-size:clamp(48px,6vw,88px);font-weight:500;line-height:1.04;letter-spacing:-.045em}.login-brand>div:last-child>span{display:block;max-width:52ch;color:oklch(88% .025 115);font-size:17px;line-height:1.7}.login-panel{display:grid;place-items:center;padding:32px;background:var(--surface)}.login-form-wrap{width:min(440px,100%)}.login-kicker{margin:0;color:var(--chilli)!important;font-weight:500}.login-form-wrap h2{margin:8px 0 4px;font-size:40px;font-weight:500;letter-spacing:-.03em}.login-form-wrap>p{margin:0 0 30px;color:var(--muted)}.login-form-wrap form{display:grid;gap:18px}.login-form-wrap label{display:grid;gap:7px;font-weight:400}.login-form-wrap input{width:100%;height:52px;padding:0 15px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:16px;outline:none}.login-form-wrap input:focus{border-color:var(--forest);box-shadow:0 0 0 3px oklch(45% .07 125/.14)}.login-form-wrap button{height:54px;margin-top:5px;border:0;border-radius:10px;background:var(--forest);color:var(--surface);font-weight:500;cursor:pointer}.login-form-wrap button:hover{background:var(--forest-soft)}.form-error{margin-bottom:20px;padding:13px 15px;border:1px solid oklch(67% .12 27);border-radius:9px;background:oklch(95% .035 27);color:oklch(42% .15 27);font-size:14px}.back-link{display:inline-flex;min-height:44px;align-items:center;margin-top:24px;color:var(--muted);font-size:14px}
.admin-shell{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100svh}.admin-sidebar{position:sticky;top:0;display:flex;height:100svh;flex-direction:column;padding:24px 16px;background:var(--forest);color:var(--surface)}.admin-sidebar>.admin-brand{padding:0 10px 26px}.admin-sidebar nav{display:grid;gap:5px}.admin-sidebar nav button{display:grid;grid-template-columns:26px 1fr;min-height:48px;align-items:center;padding:0 14px;border:0;border-radius:9px;background:transparent;color:oklch(89% .025 115);text-align:left;cursor:pointer}.admin-sidebar nav button span{font-size:18px}.admin-sidebar nav button:hover,.admin-sidebar nav button.is-active{background:oklch(96% .018 85/.12);color:var(--surface)}.admin-sidebar nav button.is-active{box-shadow:inset 0 0 0 1px oklch(96% .018 85/.14)}.sidebar-foot{display:grid;gap:14px;margin-top:auto;padding:18px 10px 0;border-top:1px solid oklch(90% .02 115/.2)}.sidebar-foot>a{font-size:13px}.sidebar-foot p{display:grid;margin:0;font-weight:400}.sidebar-foot p span{color:oklch(77% .025 115);font-size:11px;text-transform:capitalize}.sidebar-foot form{margin:0}.sidebar-foot button{min-height:42px;width:100%;border:1px solid oklch(90% .02 115/.25);border-radius:8px;background:transparent;color:var(--surface);cursor:pointer}
.admin-main{min-width:0;padding:32px clamp(20px,4vw,58px) 70px}.admin-topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px}.admin-topbar p,.admin-topbar h1{margin:0}.admin-topbar p{color:var(--muted);font-size:13px}.admin-topbar h1{font-size:30px;font-weight:500;letter-spacing:-.025em}.live-state{display:flex;min-height:42px;align-items:center;gap:9px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font-size:12px}.live-state span{width:8px;height:8px;border-radius:50%;background:var(--warn)}.live-state.is-live span{background:var(--good)}.admin-view{display:none}.admin-view.is-active{display:block}.setup-notice{display:flex;align-items:center;gap:20px;margin-bottom:22px;padding:18px 20px;border:1px solid oklch(82% .07 83);border-radius:11px;background:oklch(94% .055 85)}.setup-notice strong{flex:0 0 auto;font-weight:500}.setup-notice p{margin:0;color:var(--muted);font-size:13px}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.stat-grid article{display:flex;min-height:145px;flex-direction:column;justify-content:space-between;padding:20px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.stat-grid article>span{color:var(--muted);font-size:13px}.stat-grid article strong{font-size:30px;font-weight:500;letter-spacing:-.035em}.stat-grid article small{color:var(--muted)}.stat-grid .urgent{background:var(--chilli);color:var(--surface)}.stat-grid .urgent>span,.stat-grid .urgent small{color:oklch(91% .03 28)}
.dashboard-columns{display:grid;grid-template-columns:1.4fr .6fr;gap:16px;margin-top:16px}.panel{border:1px solid var(--line);border-radius:13px;background:var(--surface)}.panel>header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;border-bottom:1px solid var(--line)}.panel h2,.panel header p{margin:0}.panel h2{font-size:18px;font-weight:500}.panel header p{margin-top:3px;color:var(--muted);font-size:12px}.panel header button{min-height:38px;padding:0 13px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--forest);font-size:12px;cursor:pointer}.bar-chart{display:flex;height:245px;align-items:end;gap:clamp(10px,2vw,26px);padding:48px 28px 34px}.bar-chart>div{display:grid;height:100%;flex:1;grid-template-rows:1fr auto;align-items:end;gap:8px;text-align:center}.bar-chart span{display:block;width:100%;height:var(--bar-height);min-height:4px;border-radius:5px 5px 0 0;background:var(--leaf)}.bar-chart small{color:var(--muted);font-size:11px}.chart-empty{margin:-4px 20px 18px;color:var(--muted);font-size:12px;text-align:center}.queue-panel dl{margin:0;padding:10px 22px}.queue-panel dl>div{display:flex;align-items:center;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--line)}.queue-panel dl>div:last-child{border-bottom:0}.queue-panel dt{color:var(--muted)}.queue-panel dd{margin:0;font-size:21px;font-weight:500}.recent-orders{margin-top:16px}.empty-state{display:grid;min-height:200px;place-items:center;align-content:center;padding:34px;text-align:center}.empty-state>span{margin-bottom:8px;color:var(--line);font-size:38px}.empty-state strong{font-weight:500}.empty-state p{max-width:56ch;margin:5px 0 0;color:var(--muted);font-size:13px}.empty-state.tall{min-height:400px}.view-heading{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-bottom:20px}.view-heading h2,.view-heading p{margin:0}.view-heading h2{font-size:25px;font-weight:500}.view-heading p{margin-top:3px;color:var(--muted);font-size:13px}.view-heading>span{color:var(--muted);font-size:13px}.search-field{display:flex;align-items:center;gap:10px}.search-field span{color:var(--muted);font-size:12px}.search-field input{height:42px;padding:0 13px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:14px;outline:none}.search-field input:focus{border-color:var(--forest)}
.table-panel{overflow:hidden}.data-table{overflow-x:auto}.table-row{display:grid;grid-template-columns:1.5fr 1fr .7fr .65fr;min-width:670px;align-items:center;gap:16px;min-height:58px;padding:10px 20px;border-bottom:1px solid var(--line);font-size:13px}.table-row:last-child{border-bottom:0}.table-head{min-height:46px;background:var(--paper);color:var(--muted);font-size:11px}.table-row strong{font-weight:400}.status-pill{display:inline-flex;width:max-content;min-height:28px;align-items:center;padding:0 10px;border-radius:999px;background:oklch(93% .04 145);color:oklch(42% .1 145);font-size:11px}.staff-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.staff-list article{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:14px;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.avatar{display:grid;width:48px;height:48px;place-items:center;border-radius:50%;background:var(--forest);color:var(--surface);font-weight:500}.staff-list article>div:nth-child(2){display:grid}.staff-list article strong{font-weight:500}.staff-list article span{color:var(--muted);font-size:12px}.staff-list article p{margin:0}.calendar-placeholder{max-width:600px;margin:0 auto;padding:26px}.calendar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.calendar-head button{width:38px;height:38px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.calendar-head strong{font-weight:500}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center}.calendar-grid b{padding:9px;color:var(--muted);font-size:11px;font-weight:400}.calendar-grid span{display:grid;aspect-ratio:1;place-items:center;border-radius:8px;font-size:12px}.calendar-grid .today{background:var(--forest);color:var(--surface)}.report-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.report-grid article{min-height:210px;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.report-grid span{color:var(--muted);font-size:13px}.report-grid strong{display:block;margin:46px 0 8px;font-size:22px;font-weight:500}.report-grid p{margin:0;color:var(--muted);font-size:12px}
@media(max-width:1050px){.stat-grid{grid-template-columns:repeat(2,1fr)}.dashboard-columns{grid-template-columns:1fr}.report-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.login-shell{grid-template-columns:1fr}.login-brand{min-height:290px;padding:28px 22px}.login-brand>div:last-child{padding:52px 0 8px}.login-brand h1{font-size:45px}.login-brand>div:last-child>span{font-size:14px}.login-panel{padding:42px 20px}.admin-shell{display:block}.admin-sidebar{position:sticky;z-index:20;top:0;height:auto;padding:10px 12px}.admin-sidebar>.admin-brand{display:none}.admin-sidebar nav{display:flex;gap:7px;overflow-x:auto;padding-bottom:3px}.admin-sidebar nav button{grid-template-columns:1fr;min-width:92px;min-height:48px;padding:0 12px;text-align:center;white-space:nowrap}.admin-sidebar nav button span{display:none}.sidebar-foot{display:none}.admin-main{padding:22px 14px 54px}.admin-topbar{align-items:start}.admin-topbar h1{font-size:25px}.live-state{max-width:145px;line-height:1.25}.setup-notice{display:block}.setup-notice p{margin-top:5px}.staff-list{grid-template-columns:1fr}.report-grid{grid-template-columns:1fr}.view-heading{align-items:start}.search-field{display:grid;gap:5px}.search-field input{width:170px}}
@media(max-width:480px){.stat-grid{grid-template-columns:1fr 1fr;gap:9px}.stat-grid article{min-height:126px;padding:15px}.stat-grid article strong{font-size:23px}.stat-grid article small{font-size:10px}.panel>header{padding:16px}.bar-chart{height:210px;padding:38px 17px 28px}.view-heading{display:block}.view-heading>span,.search-field{margin-top:12px}.search-field input{width:100%}.staff-list article{grid-template-columns:44px 1fr}.staff-list article p{grid-column:2}.report-grid article{min-height:170px}.login-form-wrap h2{font-size:34px}}
.admin-brand{min-width:0}.admin-brand>img{display:block;width:48px;height:48px;flex:0 0 auto;border:2px solid oklch(83% .08 75);border-radius:50%;object-fit:cover;box-shadow:0 4px 12px oklch(16% .03 120/.22)}.admin-brand>div{min-width:0}.admin-brand strong{font-size:15px;line-height:1.25}
