*{box-sizing:border-box}html{background:#07090b}body{margin:0;min-height:100vh;color:#f5efe6;font-family:"Noto Sans Thai",Tahoma,system-ui,sans-serif;background:#080b0e}.shell{width:min(100%,700px);min-height:100vh;margin:auto;padding:18px 22px 38px;background:radial-gradient(circle at 50% -5%,#102637 0,#071521 30%,#030b11 72%,#020609 100%);border-left:1px solid #6d5338;border-right:1px solid #6d5338}.brand{text-align:center;padding:12px 4px 20px}.brand-mark{color:#e2b477;font-size:28px;line-height:1;margin-bottom:5px}.hours{display:inline-block;padding:4px 18px;border:1px solid #9f7647;border-radius:4px;background:#171513;color:#ead2ad;font:700 16px Georgia,serif;letter-spacing:.5px}.brand h1{margin:13px auto 8px;color:#fff8ee;font:900 clamp(31px,7vw,50px)/.95 Georgia,"Times New Roman",serif;letter-spacing:-1px;text-shadow:0 2px 0 #5d432d}.brand-rule{width:72%;height:1px;margin:9px auto;background:linear-gradient(90deg,transparent,#b98650,transparent)}.phone{color:#d9ad76;font:700 17px Georgia,serif;letter-spacing:3px}nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 25px}.tab,button{font:inherit;border:1px solid #8e6945;background:#07121a;color:#f4ede4;border-radius:16px;padding:11px}.tab{height:58px;font-size:17px;font-weight:700}.tab.active,.primary{background:linear-gradient(135deg,#e8c17f,#c99553);color:#15100b;border-color:#e8c17f}.panel{display:none}.panel.active{display:block}.step{margin:0 0 24px}.step.compact{margin-top:0}.step h3,.queue-title{display:flex;align-items:center;gap:12px;margin:0 0 12px;color:#f6f0e8;font-size:22px;line-height:1.2}.step h3 span,.queue-title span{color:#d7a76d;font-size:28px;font-family:Georgia,serif}.step h3:after,.queue-title:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,#9d7449,transparent)}.service-section{margin-bottom:14px;padding:16px;border:1px solid #75583d;border-radius:18px;background:linear-gradient(145deg,#08141d,#030a0f);box-shadow:0 12px 28px #0005}.service-section.chemical{border-color:#80613f;background:linear-gradient(145deg,#1b1712,#0a0d0e 68%);box-shadow:inset 0 0 30px #8c613018,0 12px 28px #0005}.service-heading{display:flex;align-items:baseline;gap:10px;padding:0 2px 12px}.service-heading strong{font-size:18px}.service-heading small{margin-left:auto;color:#caa87d;font-size:12px;text-align:right}.cards{display:grid;gap:10px}.services-grid,.chemical-grid{grid-template-columns:repeat(3,1fr)}.one{grid-template-columns:1fr}.choice{min-height:52px;text-align:left}.service-choice{display:flex;align-items:center;gap:8px;min-height:92px;padding:14px;border-radius:15px;background:linear-gradient(145deg,#0a1720,#050b10);border-color:#795b3f}.svc-copy{min-width:0;flex:1}.service-choice strong,.service-choice small{display:block}.service-choice strong{font-size:14px;line-height:1.25}.service-choice small{margin-top:7px;color:#d6c1a7;font-size:12px}.chem-choice{background:linear-gradient(145deg,#181713,#090c0e);border-color:#896641}.select-dot{width:18px;height:18px;flex:0 0 18px;border:1.5px solid #a8afb4;border-radius:50%}.choice.selected .select-dot{border:5px solid #1a130b;background:#e4bd7c}.choice.selected,.date.selected,.slot.selected{border-color:#e5bd7b;background:linear-gradient(145deg,#e7c17f,#c89452);color:#17110b}.choice.selected small{color:#392b1f}.dates{display:flex;gap:9px;overflow:auto;padding:1px 0 5px;scrollbar-width:none}.dates::-webkit-scrollbar{display:none}.date{min-width:90px;min-height:72px;padding:8px 6px;border-radius:14px;font-size:13px;background:#07121a}.date.closed,.slot.unavailable{opacity:.34}.queue-card{margin:0 0 20px}.queue-title{margin-bottom:12px}.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.slots .muted,.reschedule-slots .err{grid-column:1/-1}.slot{min-height:46px;padding:7px 3px;border:1px solid #795a3b;border-radius:12px;background:#07121a;color:#f6efe6;font:15px Georgia,serif}.slot.unavailable{text-decoration:line-through}.slot small{display:block;font-size:8px}.notices{margin:20px 0;border:1px solid #6f5438;border-radius:16px;overflow:hidden;background:#071017}.notice{text-align:center;padding:12px 8px;color:#ddb581}.notice+.notice{border-top:1px solid #5d4934}.notice.late{font-size:14px}.notice.color-note{font-size:12px}.booking-form{margin-top:16px}label{display:block;margin:10px 0;color:#ddc7aa}input{display:block;width:100%;margin-top:6px;padding:13px;border:1px solid #72563a;border-radius:14px;background:#07121a;color:#fff;font-size:15px}.primary{width:100%;margin:4px 0 0;font-weight:800;font-size:16px;min-height:52px;border-radius:14px}.primary:disabled{opacity:.38}.muted{color:#948a7d}.ok{color:#b8d9a7}.err{color:#e8a5a5}.row{display:flex;justify-content:space-between;align-items:center}.booking{margin:10px 0;padding:15px;border:1px solid #72563a;border-radius:16px;background:#07121a}.booking p{color:#cbbba3}.booking-actions{display:flex;gap:8px}.booking-actions button{flex:1}.cancel{color:#efb8b8}.reschedule{color:#f0d1a0}footer{text-align:center;color:#7f766c;font-size:11px;margin:24px 0}.modal{display:none;position:fixed;inset:0;z-index:999;padding:18px;overflow:auto;background:#000d}.modal.show{display:flex;align-items:center;justify-content:center}.modal-card{width:min(600px,100%);max-height:90vh;overflow:auto;padding:18px;border:1px solid #8b6844;border-radius:20px;background:#07131d}.close-modal{padding:8px 12px}.reschedule-slots{margin:16px 0;padding:10px;border:1px solid #6f512f;border-radius:14px}
@media(max-width:480px){.shell{padding:14px 16px 30px}.brand{padding-top:8px}.brand h1{font-size:32px}.tab{height:54px;font-size:16px}.step h3,.queue-title{font-size:20px}.step h3 span,.queue-title span{font-size:25px}.service-section{padding:12px}.service-heading{display:block}.service-heading strong{font-size:16px}.service-heading small{display:block;margin:4px 0 0;font-size:11px;text-align:left}.service-choice{min-height:86px;padding:11px}.service-choice strong{font-size:12px}.service-choice small{font-size:11px}.select-dot{width:16px;height:16px;flex-basis:16px}.date{min-width:82px}.slot{font-size:14px}}
@media(max-width:370px){.brand h1{font-size:28px}.tab{font-size:14px}.service-choice{padding:9px}.service-choice strong{font-size:11px}.service-choice small{font-size:10px}.select-dot{width:14px;height:14px;flex-basis:14px}.slots{grid-template-columns:repeat(4,1fr)}.slot{font-size:12px}}


/* V12.4 admin */
nav{grid-template-columns:1fr 1fr}.admin-tab{display:none}.admin-tab.visible{display:block}nav:has(.admin-tab.visible){grid-template-columns:1fr 1fr 1fr}.admin-panel h2,.admin-panel h3{margin:6px 0 12px}.admin-box{margin:12px 0;padding:16px;border:1px solid #72563a;border-radius:16px;background:#07121a}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.admin-filter{display:flex;gap:6px}.admin-filter input{margin:0;width:150px;padding:8px}.admin-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.admin-actions button{padding:8px 4px;font-size:12px}.admin-line{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #3d342a}.admin-line span,.admin-line small{display:block}.admin-line small{margin-top:4px;color:#aa9b88}.customer-card{margin:8px 0;padding:12px;border:1px solid #554331;border-radius:12px}.customer-card summary{display:flex;justify-content:space-between;cursor:pointer}.customer-edit{padding-top:8px}.customer-edit button{width:100%}@media(max-width:520px){nav:has(.admin-tab.visible){grid-template-columns:1fr 1fr}.admin-tab.visible{grid-column:1/-1}.admin-grid{grid-template-columns:1fr}.admin-actions{grid-template-columns:1fr 1fr}.admin-filter{display:block}.admin-filter input{width:140px}.admin-filter button{padding:8px}}