:root{color:#17202a;background:#f6f7f9;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px}html{scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.center-screen,.login-page{min-height:100vh;display:grid;place-items:center;padding:24px}.login-page{background:linear-gradient(#f6f7f9e6,#f6f7f9e6),url(https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1600&q=80) center/cover}.login-panel{width:min(460px,100%);background:#fffffff2;border:1px solid #dfe4ea;border-radius:8px;padding:32px;box-shadow:0 18px 50px #17202a24}.eyebrow{margin:0 0 6px;color:#687386;font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{margin-bottom:8px;font-size:clamp(1.75rem,4vw,2.45rem)}h2{margin-bottom:14px;font-size:1.05rem}h3{margin:8px 0 6px;font-size:1rem}.muted,.empty{color:#687386}.form{display:grid;gap:14px}.form.tight{gap:10px}.form label{display:grid;gap:7px;color:#344054;font-size:.9rem;font-weight:700}input,select,textarea{width:100%;min-height:42px;border:1px solid #cfd6df;border-radius:6px;padding:10px 12px;background:#fff;color:#17202a}textarea{min-height:90px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:#1d7a8c;box-shadow:0 0 0 3px #1d7a8c29;outline:none}.primary-button,.secondary-button,.icon-button{border:0;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800}.primary-button{min-height:44px;padding:0 16px;background:#1d7a8c;color:#fff}.primary-button:hover{background:#166676}.secondary-button{min-height:42px;padding:0 14px;background:#edf1f5;color:#17202a}.primary-button.compact{white-space:nowrap}.icon-button{width:38px;height:38px;background:#eef2f6;color:#273444}.icon-button:hover{background:#dde5ed}.icon-button.danger{color:#b42318;background:#fff1f0}.demo-logins{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;color:#687386;font-size:.86rem}.demo-logins span{border:1px solid #dfe4ea;border-radius:999px;padding:6px 10px}.app-shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 28px;border-bottom:1px solid #dfe4ea;background:#fffffff0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.topbar h1{margin:0;font-size:1.35rem}.topbar-actions{display:flex;align-items:center;gap:10px}.deadline-badge,.user-chip{border:1px solid #dfe4ea;border-radius:8px;padding:8px 10px;background:#fff;color:#455264;font-size:.82rem;font-weight:700}.user-chip{min-height:38px}.user-chip:hover{border-color:#9fcdd5;background:#e8f3f5;color:#166676}.deadline-badge strong{display:block;color:#17202a}.deadline-badge.open{border-color:#b7dfc9;background:#f0fbf5}.deadline-badge.closed{border-color:#f4c7c3;background:#fff4f2}.content-grid,.admin-layout{display:grid;gap:22px;padding:24px 28px 40px}.content-grid{grid-template-columns:minmax(0,1fr) 280px}.content-grid>section{min-width:0}.admin-layout{grid-template-columns:minmax(0,1fr) 320px}.admin-main,.admin-side{min-width:0}.admin-side{display:grid;align-content:start;gap:16px}.toolbar{display:flex;align-items:center;gap:12px;margin-bottom:18px}.search-box{position:relative;flex:1;min-width:220px;display:flex;align-items:center;gap:8px;border:1px solid #cfd6df;border-radius:8px;padding:0 12px;background:#fff}.search-box input{min-height:46px;border:0;box-shadow:none;padding-left:2px}.category-nav{position:sticky;top:88px;z-index:8;display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;margin:14px 0 6px;padding:10px 10px 12px;border:1px solid #dfe4ea;border-radius:8px;background:#fffffff0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 22px #17202a0d;scrollbar-width:thin;scrollbar-color:#aab6c4 transparent}.category-nav::-webkit-scrollbar{height:7px}.category-nav::-webkit-scrollbar-track{background:transparent}.category-nav::-webkit-scrollbar-thumb{border-radius:999px;background:#aab6c4}.category-nav button{flex:0 0 auto;min-height:34px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--category-border, #dfe4ea);border-radius:999px;padding:0 10px 0 12px;background:var(--category-bg, #f8fafc);color:var(--category-text, #344054);white-space:nowrap;font-size:.86rem;font-weight:800}.category-nav button:hover{border-color:var(--category-text, #166676);box-shadow:0 5px 14px #17202a14}.category-nav strong{min-width:22px;border-radius:999px;padding:2px 6px;background:#ffffffb8;color:var(--category-text, #1d7a8c);text-align:center;font-size:.74rem}.category-section{margin-top:24px;scroll-margin-top:158px}.category-section>h2{width:fit-content;border:1px solid var(--category-border, #dfe4ea);border-radius:999px;padding:7px 12px;background:var(--category-bg, #f8fafc);color:var(--category-text, #344054)}.item-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}.item-card{min-width:0;display:grid;grid-template-rows:118px 1fr;overflow:hidden;border:1px solid #dfe4ea;border-radius:8px;background:#fff;box-shadow:0 8px 24px #17202a0f}.item-image-frame{position:relative;width:100%;height:118px;display:grid;place-items:center;overflow:hidden;border:0;padding:0;background:var(--category-bg, #edf1f5);cursor:zoom-in}.item-card img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center center;display:block;background:var(--category-bg, #edf1f5)}.product-preview-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;padding:22px;background:#0f172a94}.product-preview-dialog{width:min(900px,100%);max-height:min(92vh,820px);display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid var(--category-border, #dfe4ea);border-radius:8px;background:#fff;box-shadow:0 28px 80px #00000047}.product-preview-dialog header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid var(--category-border, #dfe4ea)}.product-preview-dialog h2{margin:8px 0 0;font-size:1.08rem}.product-preview-image{min-height:360px;display:grid;place-items:center;padding:22px;background:var(--category-bg, #edf1f5)}.product-preview-image img{max-width:100%;max-height:min(70vh,660px);object-fit:contain;display:block}.item-body{display:grid;grid-template-rows:1fr auto;gap:12px;padding:12px}.item-body p{margin-bottom:0;color:#687386;font-size:.92rem}.category-pill{display:inline-block;border-radius:999px;padding:4px 8px;border:1px solid var(--category-border, #9fcdd5);background:var(--category-bg, #e8f3f5);color:var(--category-text, #166676);font-size:.76rem;font-weight:800}.item-footer{display:grid;grid-template-columns:1fr;gap:8px}.color-select{display:grid;gap:5px;color:#455264;font-size:.78rem;font-weight:800}.color-select select{min-height:34px;padding:6px 8px;border-radius:6px;font-size:.86rem}.quantity-controls,.card-actions{display:inline-flex;align-items:center;gap:6px}.quantity-controls{width:100%;justify-content:space-between;border:1px solid #dfe4ea;border-radius:8px;padding:5px;background:#f8fafc}.card-actions{justify-content:flex-end}.quantity-controls strong{flex:1;min-width:28px;text-align:center;font-size:1.05rem}.quantity-controls .icon-button{width:34px;height:34px;background:#fff;border:1px solid #cfd6df;color:#17202a;box-shadow:0 2px 8px #17202a14}.quantity-controls .icon-button:not(:disabled):hover{border-color:#1d7a8c;background:#e8f3f5;color:#166676}.quantity-controls .icon-button:not(:disabled):last-child{background:#1d7a8c;border-color:#1d7a8c;color:#fff}.quantity-controls .icon-button:not(:disabled):last-child:hover{background:#166676;border-color:#166676}.side-panel{border:1px solid #dfe4ea;border-radius:8px;padding:18px;background:#fff;box-shadow:0 8px 24px #17202a0f}.order-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.order-panel-heading h2{margin-bottom:0}.mobile-order-toggle,.mobile-order-close,.mobile-order-backdrop{display:none}.content-grid>.side-panel,.admin-side{position:sticky;top:112px;align-self:start;max-height:calc(100vh - 132px);overflow:auto}.notice{margin:14px 0 4px;border:1px solid #f4c7c3;border-radius:8px;padding:12px;background:#fff4f2;color:#8a241d;font-weight:800}.summary-list{display:grid;gap:10px}.summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #edf1f5;padding:8px 0}.summary-row span{min-width:0}.order-edit-row{display:grid;gap:6px;border:1px solid #edf1f5;border-radius:8px;padding:8px;background:#fbfcfe}.order-item-name{min-width:0;display:-webkit-box;overflow:hidden;color:#273444;font-size:.88rem;font-weight:800;line-height:1.28;-webkit-box-orient:vertical;-webkit-line-clamp:2}.order-quantity-editor{justify-self:end;display:grid;grid-template-columns:28px 48px 28px;align-items:center;gap:4px}.order-quantity-editor .icon-button{width:28px;height:28px;border:1px solid #cfd6df;background:#fff}.order-quantity-editor input{min-height:28px;padding:4px 6px;text-align:center;font-weight:800}.user-order{border:1px solid #edf1f5;border-radius:8px;padding:10px}.checkbox-row{display:flex!important;grid-template-columns:auto 1fr;align-items:center;gap:10px!important}.checkbox-row input{width:18px;min-height:18px}.login-remember{justify-content:flex-start;color:#455264!important;font-weight:700!important}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;padding:18px;background:#0f172a6b}.modal{width:min(620px,100%);max-height:min(760px,92vh);overflow:auto;border-radius:8px;padding:22px;background:#fff;box-shadow:0 24px 70px #00000038}.modal-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}.profile-modal{width:min(480px,100%)}.profile-details{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #edf1f5;border-radius:8px;padding:10px 12px;background:#f8fafc;color:#455264;font-size:.9rem}.profile-details strong{color:#17202a}.forced-password-wrap{min-height:calc(100vh - 92px);display:grid;place-items:center;padding:28px}.forced-password-card{border:1px solid #f3d29c;box-shadow:0 22px 70px #92400e29}.account-list{display:grid;gap:8px}.account-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;align-items:center;gap:10px;border:1px solid #edf1f5;border-radius:8px;padding:10px;background:#fbfcfe}.account-row strong,.account-row span,.account-row em{display:block;min-width:0}.account-row strong{color:#17202a;font-size:.9rem}.account-row span{color:#687386;font-size:.82rem}.account-row em{width:fit-content;margin-top:5px;border-radius:999px;padding:3px 7px;background:#fff4e5;color:#92400e;font-size:.72rem;font-style:normal;font-weight:800}.image-field{display:grid;gap:10px}.drop-zone{display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:center;border:1px dashed #aab6c4;border-radius:8px;padding:12px;background:#f8fafc;transition:border-color .14s ease,background .14s ease}.drop-zone.active{border-color:#1d7a8c;background:#e8f3f5}.drop-zone p{margin-bottom:10px;font-size:.88rem}.image-preview{position:relative;width:132px;aspect-ratio:4 / 3;display:grid;place-items:center;overflow:hidden;border:1px solid var(--category-border, #dfe4ea);border-radius:8px;background:var(--category-bg, #edf1f5);color:var(--category-text, #687386)}.image-preview img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center}.file-button{position:relative;min-height:38px;width:fit-content;padding:0 12px}.file-button input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.toast-stack{position:fixed;right:18px;bottom:18px;z-index:40;display:grid;gap:10px}.toast{min-width:min(330px,calc(100vw - 36px));border:1px solid #b7dfc9;border-radius:8px;padding:12px 14px;background:#143f35;color:#fff;box-shadow:0 16px 36px #143f3547;animation:slideIn .18s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1060px){.content-grid,.admin-layout{grid-template-columns:1fr}.admin-side{position:static;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));max-height:none;overflow:visible}.content-grid>.side-panel{position:static;max-height:none;overflow:visible}}@media(min-width:1180px){.item-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(max-width:720px){body{padding-bottom:66px}.topbar{position:static;align-items:flex-start;flex-direction:column;padding:18px}.topbar-actions,.toolbar{width:100%;flex-wrap:wrap}.deadline-badge,.user-chip,.search-box,.primary-button.compact{width:100%}.content-grid,.admin-layout{padding:14px 12px 24px}.category-nav{top:0}.item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.category-section{margin-top:18px;scroll-margin-top:72px}.category-section>h2{margin-bottom:10px;padding:6px 10px;font-size:.94rem}.item-card{grid-template-rows:100px 1fr}.item-image-frame{height:100px}.item-body{gap:8px;padding:9px}.item-body h3{margin-top:6px;font-size:.88rem;line-height:1.25}.category-pill{max-width:100%;overflow:hidden;padding:3px 6px;font-size:.68rem;text-overflow:ellipsis;white-space:nowrap}.quantity-controls{padding:3px}.quantity-controls .icon-button{width:32px;height:32px}.mobile-order-toggle{position:fixed;right:12px;bottom:10px;left:12px;z-index:24;min-height:48px;display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:9px;border:0;border-radius:8px;padding:0 14px;background:#166676;color:#fff;box-shadow:0 12px 30px #17202a47;font-weight:800;text-align:left}.mobile-order-toggle strong{min-width:28px;border-radius:999px;padding:3px 7px;background:#fff;color:#166676;text-align:center}.mobile-order-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:block;border:0;background:#0f172a7a}.content-grid>.order-panel{position:fixed;right:12px;bottom:68px;left:12px;z-index:22;max-height:min(68vh,570px);display:none;overflow:auto;padding:14px;box-shadow:0 20px 50px #0f172a4d}.content-grid>.order-panel.mobile-open{display:block}.mobile-order-close{display:inline-flex}.drop-zone{grid-template-columns:1fr}.image-preview{width:100%}.login-panel{padding:22px}}@media(max-width:350px){.item-body{padding:8px 7px}.quantity-controls .icon-button{width:30px;height:30px}}