:root{--bg:#f5f7fb;--ink:#152033;--muted:#7c889a;--orange:#f97316;--line:#e8ecf2}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif}button,input,select{font:inherit}button{cursor:pointer}header{height:72px;background:#101828;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1220px)/2));position:sticky;top:0;z-index:4}.headbrand{font-size:23px;display:flex;align-items:center;gap:9px}.accent{color:#ff9d4d}.shopname{font-size:13px;color:#d8e0ee}.shopname button{border:0;background:#27364e;color:white;border-radius:10px;padding:8px 12px;margin-left:10px}main{max-width:1220px;margin:auto;padding:24px 20px 90px}.hero{border-radius:24px;padding:30px 34px;background:linear-gradient(115deg,#15223a,#283958 70%,#ad5324);color:white;display:flex;align-items:end;justify-content:space-between}.hero h1{font-size:30px;margin:10px 0 5px}.hero p{color:#c9d4e4;margin:0}.tag{font-size:10px;letter-spacing:1.8px;color:#f9c69e;font-weight:800}.date{font-size:13px;color:#dce4f0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:18px 0}.stat,.panel{background:white;border:1px solid var(--line);border-radius:20px;box-shadow:0 4px 18px #13243b08}.stat{padding:21px 24px}.stat small,.stat span{display:block;color:var(--muted);font-size:12px}.stat strong{display:block;font-size:30px;margin:9px 0}.grid{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;margin-bottom:18px}.panel{padding:24px;min-width:0}.sectiontitle{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:20px}.sectiontitle h2{margin:0;font-size:20px}.sectiontitle p{margin:5px 0 0;color:var(--muted);font-size:12px}.outline,.smallbtn{border:1px solid #fbd4b9;color:#b94e0d;background:#fff8f3;border-radius:11px;padding:10px 13px;font-weight:700;white-space:nowrap;font-size:12px}.kselect{display:flex;align-items:end;gap:9px;background:#f8fafc;padding:12px;border-radius:13px;margin-bottom:18px}.kselect label{flex:1;font-size:11px;font-weight:700;color:#64748b}.kselect select{display:block;width:100%;margin-top:6px;background:white;border:1px solid #dfe5ed;border-radius:9px;padding:10px;color:var(--ink)}.productgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.product{min-height:146px;position:relative;border:1px solid #e9edf3;background:#fff;border-radius:17px;padding:17px 12px;display:flex;flex-direction:column;align-items:flex-start;gap:9px;text-align:left;transition:.15s}.product:active{transform:scale(.96);background:#fff7ed}.producticon{display:grid;place-items:center;font-size:30px;width:50px;height:50px;background:color-mix(in srgb,var(--pc) 13%,white);border-radius:14px}.productname{font-weight:750;font-size:13px}.product strong{font-size:18px}.pplus{position:absolute;bottom:12px;right:12px;background:#fff1e5;color:#ea580c;border-radius:10px;padding:4px 9px;font-weight:800}.kettlelist{max-height:530px;overflow:auto}.kettleitem{padding:16px;border:1px solid var(--line);border-radius:14px;margin-bottom:11px}.krow{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px}.krow:last-child{margin-bottom:0}.krow small{color:#8b97a7;font-size:11px}.muted{font-size:11px;color:var(--muted)}.badge{background:#f0f2f5;color:#687586;border-radius:20px;padding:5px 9px;font-size:10px;font-weight:800}.badge.green{background:#ddf8eb;color:#15805c}.progress{height:9px;border-radius:30px;background:#edf1f6;overflow:hidden;margin:12px 0}.progress span{display:block;height:100%;background:linear-gradient(90deg,#fb923c,#ea580c);border-radius:30px}.textbtn{border:0;background:transparent;color:#d45c15;font-size:11px;font-weight:800}.tablewrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;color:#8390a1;background:#f8fafc;font-size:11px}td,th{padding:12px 10px;border-bottom:1px solid #eef1f5}td:last-child,th:last-child{text-align:right}h3{font-size:15px;margin-top:25px}.histrow,.manage{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #edf0f4;padding:12px 0;font-size:13px}.histrow small{display:block;color:#94a0af;font-size:11px;margin-top:5px}.histrow strong{color:#15906c}.history{max-height:350px;overflow:auto}.manage button{border:0;background:#f3f5f8;border-radius:7px;padding:6px 9px;margin-left:5px;color:#526074;font-size:11px}.empty{padding:30px;text-align:center;color:#94a0af}.undo{margin-top:14px;padding:13px;border-radius:12px;background:#eaf9f0;display:flex;justify-content:space-between}.undo[hidden]{display:none}.undo button{border:0;background:transparent;color:#0b8153;font-weight:800}.auth{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 80% 20%,#a64e21,#15213a 55%,#101828);padding:20px}.authcard{background:white;border-radius:26px;padding:35px;max-width:440px;width:100%;box-shadow:0 25px 80px #0004}.brand{font-size:27px;font-weight:850}.auth h1{font-size:28px;margin:30px 0 7px}.auth p{color:#7c889a;margin:0 0 22px}.switch{display:flex;background:#f3f5f8;border-radius:12px;padding:5px;margin-bottom:22px}.switch button{flex:1;border:0;background:transparent;padding:11px;border-radius:9px;font-weight:750;color:#7b8798}.switch button.selected{background:white;color:#ea580c;box-shadow:0 2px 8px #0001}form label{display:block;font-size:12px;font-weight:700;margin:14px 0;color:#4c596b}form input:not([type=checkbox]){display:block;width:100%;margin-top:7px;border:1px solid #dce2eb;border-radius:11px;padding:13px;outline-color:#f97316}.primary{border:0;background:linear-gradient(110deg,#f97316,#e65a0a);color:white;border-radius:12px;padding:14px;font-weight:800}.wide{width:100%;margin-top:15px}.authcard small{display:block;text-align:center;margin-top:23px;color:#a1aab6}.modal{display:none;position:fixed;inset:0;background:#10182899;z-index:9;align-items:center;justify-content:center;padding:20px}.modal.visible{display:flex}.modalbox{position:relative;background:white;border-radius:22px;width:100%;max-width:430px;padding:28px}.modalbox h2{margin-top:0}.x{position:absolute;right:20px;top:17px;border:0;background:#f1f3f7;border-radius:8px;padding:8px}.check{display:flex;align-items:center;gap:10px}.quickcaps{display:flex;gap:8px}.quickcaps button{flex:1;border:1px solid #fbd4b9;background:#fff7ed;border-radius:9px;padding:9px;color:#b45309}.bottomnav{display:none}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(100px);background:#142138;color:white;padding:13px 20px;border-radius:12px;z-index:30;opacity:0;transition:.2s;box-shadow:0 6px 22px #0002}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}#toast.error{background:#b91c1c}a{color:#d9681a}@media(max-width:800px){.grid{grid-template-columns:1fr}.hero{padding:23px}.hero h1{font-size:24px}.date{display:none}.stats{gap:8px}.stat{padding:14px}.stat strong{font-size:22px}.stat small,.stat span{font-size:10px}.panel{padding:18px}.bottomnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:white;border-top:1px solid #e8ecf2;z-index:5;justify-content:space-around;padding:9px 8px max(10px,env(safe-area-inset-bottom))}.bottomnav a{display:flex;flex-direction:column;align-items:center;text-decoration:none;font-size:20px;gap:2px}.bottomnav span{font-size:10px;color:#637083}.productgrid{grid-template-columns:repeat(2,1fr)}.product{min-height:135px}header{padding:0 18px;height:64px}.shopname{max-width:50%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}main{padding:16px 12px 100px}}@media print{header,.bottomnav,.pos,.outline,.textbtn,.manage{display:none!important}main{padding:0}.grid{display:block}.panel{break-inside:avoid;box-shadow:none;margin:12px 0}}

/* Version 1.1: separate app screens, SPA-like transitions */
.appview[hidden]{display:none!important}.appview{animation:viewIn .2s ease-out}@keyframes viewIn{from{opacity:.55;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.appnav{display:flex;position:fixed;bottom:0;left:0;right:0;justify-content:center;gap:7px;background:#fff;border-top:1px solid #e8ecf2;padding:9px 12px max(10px,env(safe-area-inset-bottom));z-index:5;box-shadow:0 -8px 25px #1421380a}
.appnav button{display:flex;align-items:center;flex-direction:column;gap:3px;border:0;background:transparent;border-radius:12px;padding:8px 20px;color:#617084;font-size:20px}.appnav button span{font-size:11px;font-weight:750}.appnav button.active{background:#fff0e4;color:#dc5a0b}
.viewheading{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:22px}.viewheading h1{margin:0;font-size:28px;width:100%}.viewheading p{color:#7c889a;margin:0;flex:1}.viewheading .primary{white-space:nowrap}
.homeactions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}.homeactions button{border:1px solid #fbd6bc;background:#fff;color:#b44e0e;padding:28px 16px;border-radius:19px;font-weight:850;font-size:18px;box-shadow:0 5px 18px #13243b0a;text-align:left}
.appview[data-view="sales"] .grid,.appview[data-view="kettles"] .grid,.appview[data-view="reports"] .grid{grid-template-columns:1fr}
.appview[data-view="sales"] .productgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:800px){.appnav{justify-content:space-around;gap:0;padding:6px 3px max(8px,env(safe-area-inset-bottom))}.appnav button{padding:7px 8px;font-size:19px}.appnav button span{font-size:10px}.homeactions{gap:10px}.homeactions button{padding:22px 12px;font-size:14px}.viewheading h1{font-size:23px}.appview[data-view="sales"] .productgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media print{.appnav,.homeactions{display:none!important}}

/* Product icon and quick catalogue enhancements */
.producticon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 10px;border-radius:20px;background:color-mix(in srgb,var(--pc) 17%,transparent);font-size:36px;line-height:1.2;filter:none}
.product{transition:transform .13s ease,box-shadow .13s ease}.product:active{transform:scale(.95)}
.product-actions{display:flex;flex-wrap:wrap;gap:9px}.manage-icon{display:inline-grid;place-items:center;min-width:42px;height:42px;font-size:25px;border-radius:12px;background:color-mix(in srgb,var(--pc) 15%,transparent);margin-right:10px}
.icon-color-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.icon-color-row input[type=color]{height:46px;padding:5px;cursor:pointer}.icon-picks{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 16px}.icon-picks button{font-size:24px;border:1px solid #e5e7eb;background:#fff;border-radius:12px;min-width:43px;min-height:43px;cursor:pointer}

/* V1.3 premium mobile dashboard */
:root{--bg:#f3f5fa;--ink:#19243a;--orange:#f77929}body{background:var(--bg)}header{background:#101a2b;box-shadow:0 4px 22px #15203616}.brand-mark{display:inline-grid;place-items:center;width:37px;height:37px;border-radius:13px;background:#ff8a3326;color:#ffa45e;font-size:27px}.headbrand b{letter-spacing:-.7px}.premium-hero{border-radius:26px;background:radial-gradient(circle at 100% 10%,#ef8b463f,transparent 43%),linear-gradient(125deg,#17243c,#293d60 72%,#74442e);color:white;padding:24px;position:relative;overflow:hidden;box-shadow:0 15px 35px #17243b24}.premium-hero:after{content:'♨';position:absolute;right:-18px;top:25px;font-size:165px;color:#ffffff0a;pointer-events:none}.hero-top,.hero-bottom{display:flex;justify-content:space-between;align-items:center}.live-pill{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:1.5px;font-weight:900;color:#ffcdab}.live-pill i{width:7px;height:7px;border-radius:50%;background:#39e6a5;box-shadow:0 0 0 5px #39e6a51c;animation:pulse 2s infinite}@keyframes pulse{50%{box-shadow:0 0 0 9px #39e6a500}}.hero-clock{font-size:12px;color:#d7e0f2}.hero-greeting{font-size:26px;font-weight:850;margin:21px 0 3px;letter-spacing:-.8px}.wave,.spark{color:#ffac66}.premium-hero p{font-size:13px;color:#c8d5e9;margin:0}.hero-revenue{margin:26px 0 20px}.hero-revenue span{display:block;color:#d7e0ee;font-size:12px;margin-bottom:6px}.hero-revenue strong{font-size:43px;letter-spacing:-1.7px;font-variant-numeric:tabular-nums}.hero-bottom{border-top:1px solid #ffffff28;padding-top:14px;font-size:11px;color:#d7dfed}.mini-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin:17px 0 27px}.mini-stat{background:white;border:1px solid #e9edf4;border-radius:19px;padding:16px;box-shadow:0 5px 18px #15213808}.mini-icon{display:grid;place-items:center;width:35px;height:35px;border-radius:11px;font-size:22px;margin-bottom:13px}.mini-icon.orange{background:#fff0e5;color:#f57c29}.mini-icon.teal{background:#dcf9f0;color:#0e9f78}.mini-icon.purple{background:#efe9ff;color:#8660d7}.mini-icon.blue{background:#e6f0ff;color:#4589d6}.mini-stat small{display:block;color:#8894a7;font-size:11px}.mini-stat strong{display:block;font-size:24px;margin-top:4px}.home-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 13px}.home-section-title h2{margin:0;font-size:19px;letter-spacing:-.4px}.home-section-title p{margin:4px 0 0;color:#8b97a7;font-size:11px}.see-all{border:0;background:#fff1e7;color:#d75e18;border-radius:10px;padding:9px 10px;font-weight:800;font-size:11px;white-space:nowrap}.home-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.quick-tile{background:white;position:relative;border:1px solid #e9edf4;border-radius:20px;padding:15px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:8px;min-height:155px;box-shadow:0 5px 17px #19243b08;transition:transform .16s,box-shadow .16s;touch-action:manipulation}.quick-tile:active,.quick-tile.tapped{transform:scale(.94);box-shadow:0 0 0 3px #f9731633}.quick-tile .producticon{margin:0 0 4px;width:49px;height:49px;border-radius:15px}.quick-name{font-size:12px;font-weight:800;line-height:1.3;min-height:30px}.quick-tile strong{font-size:18px}.quick-add{position:absolute;bottom:14px;right:13px;width:29px;height:29px;border-radius:10px;background:#fff1e6;color:#ef6b1b;display:grid;place-items:center;font-size:21px;font-weight:700}.home-kettle,.breakdown-card{background:white;border:1px solid #e9edf4;border-radius:22px;padding:20px;box-shadow:0 5px 18px #15213808}.hk-head{display:flex;align-items:center;gap:12px}.hk-symbol{display:grid;place-items:center;background:#fff0e5;color:#ef7425;width:48px;height:48px;border-radius:16px;font-size:29px}.hk-head div{flex:1}.hk-head b,.hk-head small{display:block}.hk-head b{font-size:15px}.hk-head small{font-size:11px;color:#8794a6;margin-top:4px}.hk-status{font-size:10px;font-weight:850;background:#dff8ed;color:#159568;padding:7px 9px;border-radius:20px}.hk-values{display:flex;justify-content:space-between;align-items:end;margin-top:19px}.hk-values strong{font-size:26px}.hk-values strong small{font-size:12px;color:#8b97a7;font-weight:500}.hk-values>span{font-size:12px;color:#8593a5}.hk-bar{height:10px;border-radius:20px;background:#eef2f7;overflow:hidden;margin:12px 0}.hk-bar span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#ffa354,#f66b25);transition:width .4s}.hk-foot{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#8994a3}.hk-foot button{background:transparent;border:0;color:#ea6a20;font-weight:800}.start-brew{margin-top:17px;border:0;background:#fff0e6;color:#d65d17;border-radius:12px;width:100%;padding:14px;font-weight:800}.breakdown-row{display:grid;grid-template-columns:1fr auto auto;gap:15px;padding:13px 0;border-bottom:1px solid #f0f2f6;font-size:12px}.breakdown-row:last-child{border:0}.breakdown-row>span:nth-child(2){color:#8a96a7}.breakdown-row strong{color:#203149}.home-undo{margin:12px 0}.producticon svg,.manage-icon svg{width:65%;height:65%;stroke:var(--pc,#e47b2e);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.producticon{color:var(--pc,#e47b2e)}.appnav button .nav-symbol{font-size:25px;line-height:1}.appnav button span:not(.nav-symbol){font-size:11px}.appnav button.active{background:#fff0e6;color:#df671f}.appnav{border-radius:20px 20px 0 0;box-shadow:0 -10px 30px #18253d13}.producticon,.manage-icon{font-family:Arial,sans-serif}.productgrid .producticon{margin:0 auto 10px}.quick-tile .producticon{margin:0 0 4px}
@media(max-width:800px){main{padding:14px 12px 115px}.premium-hero{padding:22px}.mini-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mini-stat{padding:14px}.mini-stat .mini-icon{margin-bottom:8px}.home-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quick-tile{min-height:145px}.hero-revenue strong{font-size:39px}.appnav button{min-width:0;padding:7px 9px}.headbrand{font-size:20px}}
@media(min-width:900px){.appview[data-view=home]{max-width:900px;margin:auto}.home-products{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* V1.4: mobile app-shell refinement */
html{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}body{overscroll-behavior-y:contain;user-select:none;-webkit-user-select:none}input,textarea,select{user-select:text;-webkit-user-select:text}button,a{touch-action:manipulation;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #fb9c5a;outline-offset:3px}button{transition:transform .16s cubic-bezier(.2,.8,.2,1),background-color .2s,box-shadow .2s}button:active{transform:scale(.965)}
.native-topline{display:flex;align-items:center;gap:8px;margin:0 0 13px;padding:0 4px;color:#68788e;font-size:11px;font-weight:700;min-height:18px}.nt-indicator{width:7px;height:7px;border-radius:50%;background:#18b77d;box-shadow:0 0 0 4px #18b77d16}.nt-indicator.working{background:#f59e0b;box-shadow:0 0 0 4px #f59e0b20}#installApp{margin-left:auto;background:#192c48;color:white;border:0;border-radius:10px;padding:8px 12px;font-size:11px;font-weight:800}
.appnav{padding-bottom:max(12px,env(safe-area-inset-bottom));background:#fffffff5;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid #ffffffb0}.appnav button{min-width:58px;position:relative;transition:color .2s,background .2s}.appnav button.active:before{content:'';position:absolute;top:1px;left:32%;right:32%;height:3px;background:#f4772d;border-radius:5px}.appnav .nav-symbol{height:26px;display:grid;place-items:center}.appnav .nav-symbol svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.appview{animation:nativeScreen .22s cubic-bezier(.22,1,.36,1)}@keyframes nativeScreen{from{opacity:.4;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.premium-hero{box-shadow:0 18px 35px #1527441f}.quick-tile,.mini-stat,.home-kettle,.breakdown-card{box-shadow:0 5px 20px #1b315009}.quick-tile:active,.product:active{transform:scale(.95)}
@media(max-width:800px){header{height:60px;position:sticky;top:0;z-index:9;padding-top:env(safe-area-inset-top);box-sizing:content-box}main{padding-top:12px;padding-bottom:calc(104px + env(safe-area-inset-bottom))}.appnav{z-index:10}.appnav button{flex:1;gap:5px}.premium-hero{border-radius:25px}.appview[data-view=home]{padding-bottom:8px}}
@media(prefers-reduced-motion:reduce){.appview{animation:none}}

/* V1.5 – premium individual module screens */
.feature-hero{position:relative;overflow:hidden;border-radius:27px;padding:25px 24px 21px;color:#fff;background:#16253d;box-shadow:0 15px 35px #1b2d4a20;margin:5px 0 18px;isolation:isolate}
.feature-hero:before{content:'';position:absolute;width:230px;height:230px;border-radius:50%;right:-95px;top:-95px;background:#ffffff12;box-shadow:0 0 0 42px #ffffff06;z-index:-1}.feature-hero:after{content:'';position:absolute;width:130px;height:130px;border:1px solid #ffffff18;border-radius:50%;right:30px;bottom:-100px;z-index:-1}
.sale-hero{background:linear-gradient(125deg,#152841,#264564 65%,#c66d35)}.kettle-hero{background:linear-gradient(120deg,#18314a,#136b69 105%)}.reports-hero{background:linear-gradient(125deg,#1b244a,#5950a0)}.products-hero{background:linear-gradient(120deg,#242944,#875c74 115%)}
.feature-eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:900;color:#ffd0a4}.feature-hero h1{font-size:clamp(26px,5vw,36px);letter-spacing:-1.1px;line-height:1.15;margin:17px 0 8px;font-weight:900}.feature-hero p{font-size:13px;color:#e1e8f1;margin:0;line-height:1.5}.hero-dot{color:#ffb675}.feature-hero-foot{border-top:1px solid #ffffff2b;margin-top:24px;padding-top:14px;display:flex;align-items:center;gap:9px;font-size:11px;color:#e5edf7}.hero-live-dot{width:8px;height:8px;border-radius:50%;background:#4df0b3;box-shadow:0 0 0 5px #4df0b322;animation:pulse 2s infinite}.hero-decor{margin-left:auto;font-size:23px;color:#ffd3aa}
.feature-tools{display:flex;gap:12px;align-items:center;margin:15px 0}.smart-search{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e6eaf1;border-radius:16px;padding:0 15px;min-height:52px;flex:1;box-shadow:0 5px 18px #18263d08}.smart-search span{font-size:28px;color:#ef762e;line-height:1}.smart-search input{border:0;outline:0;box-shadow:none!important;background:transparent;width:100%;min-width:0;font-size:14px;padding:12px 0}.counter-hint{font-size:11px;font-weight:700;color:#718198}
.appview[data-view=sales] .pos,.appview[data-view=kettles] .panel,.appview[data-view=reports] .panel,.product-manager{border:1px solid #e7ebf2;border-radius:23px;box-shadow:0 8px 30px #192b470b;padding:20px;background:#fff}
.appview[data-view=sales] .productgrid{gap:12px}.appview[data-view=sales] .product{border-radius:21px;border:1px solid #e9edf3;box-shadow:0 5px 18px #1b2e4c0a;min-height:166px;position:relative;overflow:hidden}.appview[data-view=sales] .product:after{content:'';position:absolute;top:-45px;right:-45px;width:100px;height:100px;background:color-mix(in srgb,var(--pc) 9%,transparent);border-radius:50%;pointer-events:none}.appview[data-view=sales] .product:active{box-shadow:0 0 0 3px #fa8a4b55;transform:scale(.95)}
.insight-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 18px}.insight-strip>div{border:1px solid #e9edf3;border-radius:18px;background:white;padding:16px 12px;box-shadow:0 5px 15px #18263d08}.insight-strip small{display:block;color:#8190a5;font-size:10px;line-height:1.4}.insight-strip strong{display:block;font-size:23px;margin-top:7px;letter-spacing:-.6px}.creative-kettle{border-radius:20px!important;border:1px solid #e9edf3!important;padding:18px!important;margin-bottom:12px;background:linear-gradient(160deg,#fff,#f9fbfe);transition:transform .2s,box-shadow .2s}.creative-kettle:active{transform:scale(.99)}.creative-kettle .progress{height:12px;border-radius:30px;overflow:hidden}.creative-kettle .progress span{background:linear-gradient(90deg,#ffb46e,#f4772d);transition:width .6s}
.report-hero-total{display:flex;align-items:baseline;gap:12px;margin-top:20px;flex-wrap:wrap}.report-hero-total small{width:100%;font-size:11px;color:#e3e2fa}.report-hero-total strong{font-size:35px;letter-spacing:-1px}.report-hero-total span{background:#ffffff20;border-radius:20px;padding:7px 10px;font-size:11px}
.chart-card{background:white;border:1px solid #e8ebf4;border-radius:23px;padding:20px 18px;margin:0 0 18px;box-shadow:0 8px 25px #18263d09}.chart-heading{display:flex;justify-content:space-between;align-items:center}.chart-heading b,.chart-heading small{display:block}.chart-heading b{font-size:17px}.chart-heading small{color:#8995a8;font-size:11px;margin-top:3px}.chart-tag{font-size:10px;font-weight:900;background:#e5faf0;color:#15976e;padding:7px 10px;border-radius:20px}.spark-bars{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;align-items:end;margin-top:20px}.spark-col{text-align:center;min-width:0}.spark-value{display:block;font-size:10px;color:#697a92;margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spark-track{height:115px;border-radius:11px;background:#f1f4fa;display:flex;align-items:end;overflow:hidden}.spark-track i{display:block;width:100%;border-radius:10px 10px 0 0;background:linear-gradient(180deg,#ffb070,#f47b35);animation:growBar .65s ease-out both;transform-origin:bottom}.spark-col small{font-size:10px;color:#8795a9;display:block;margin-top:8px}@keyframes growBar{from{transform:scaleY(.05)}to{transform:scaleY(1)}}
.product-heading{margin:0 0 14px}.product-heading .product-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.product-heading .product-actions button{min-height:47px;border-radius:14px;font-size:12px}.menu-count{border-radius:20px;background:#fff0e6;color:#df6b27;font-size:11px;padding:7px 10px;font-weight:800}.creative-manage{border:1px solid #ebedf4;border-radius:17px;padding:13px!important;margin:9px 0;display:flex;align-items:center;gap:8px;transition:box-shadow .2s}.creative-manage:hover{box-shadow:0 6px 18px #1c30410d}.creative-manage .manage-icon{flex-shrink:0}.creative-manage>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px;font-weight:700}.creative-manage>div{display:flex;gap:5px}.creative-manage button{border-radius:10px;min-height:35px}
@media(max-width:600px){.feature-hero{padding:23px 20px}.counter-hint{display:none}.appview[data-view=sales] .pos,.appview[data-view=kettles] .panel,.appview[data-view=reports] .panel,.product-manager{padding:14px}.insight-strip>div{padding:12px 9px}.insight-strip strong{font-size:20px}.spark-bars{gap:6px}.spark-track{height:95px}.spark-value{font-size:9px}.product-heading .product-actions{gap:8px}.creative-manage{flex-wrap:wrap}.creative-manage>div{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.spark-track i{animation:none}}


/* UltraTea-Lite V1.6 — cohesive mobile-first design system; no framework dependencies */
:root{--ink:#142036;--soft:#66758d;--canvas:#f4f6fb;--sun:#ffb44c;--ember:#f4773d;--night:#101a2b;--ring:0 0 0 4px #f8ad4d44;--elev:0 16px 45px #14274612}
html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent}body{background:var(--canvas);color:var(--ink);overscroll-behavior-y:contain}button,input,select{font:inherit}button{touch-action:manipulation}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #f28b40;outline-offset:3px}button:active{transform:scale(.97)}.appview:not([hidden]){animation:screenIn .33s cubic-bezier(.2,.8,.2,1) both}@keyframes screenIn{from{opacity:.5;transform:translateY(12px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
header{position:sticky;top:0;z-index:30;isolation:isolate;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 5px 25px #15203310}.header-glow{position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,#fff9f0 0%,#fff 54%,#f1f6ff 100%);opacity:.96}.headbrand{letter-spacing:-.65px}.brand-mark{display:inline-grid;place-items:center;width:35px;height:35px;background:linear-gradient(145deg,#ffb452,#fa713c);border-radius:13px;color:white;box-shadow:0 5px 14px #f8844d40}.shopname{max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.native-topline{border:1px solid #e8edf5;border-radius:14px;background:#fff;box-shadow:0 5px 22px #182a4b09;margin-bottom:16px;padding:10px 14px;display:flex;align-items:center;gap:8px}.topline-hello{font-size:9px;font-weight:900;letter-spacing:1.1px;color:#d86e3e;margin-right:auto}.native-topline #syncLabel{font-size:11px;color:#758397}.nt-indicator{box-shadow:0 0 0 3px #4fd0a42a}
.view-progress{display:flex;align-items:center;gap:10px;color:#8390a6;font-size:10px;font-weight:900;letter-spacing:2px;margin:2px 0 13px}.view-progress span{color:#f07842;font-size:12px}.view-progress i{height:1px;background:linear-gradient(90deg,#ffb04a,#dce5ef);width:30px}.feature-hero{position:relative;isolation:isolate;overflow:hidden;border-radius:25px!important;box-shadow:0 20px 45px #18233c18;min-height:190px}.feature-hero:before{content:'';position:absolute;width:260px;height:260px;border:1px solid #ffffff20;border-radius:50%;right:-80px;top:-110px;pointer-events:none}.feature-hero:after{content:'';position:absolute;width:180px;height:180px;border:1px solid #ffffff20;border-radius:50%;right:-50px;top:-60px;pointer-events:none}.feature-hero h1{letter-spacing:-1.3px;line-height:1.1}.feature-hero-foot{position:relative}.hero-decor{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#ffffff22}
.premium-hero{border-radius:26px!important;position:relative;overflow:hidden;box-shadow:0 20px 50px #192a4420}.premium-hero:after{content:'';position:absolute;right:-55px;bottom:-100px;width:250px;height:250px;border-radius:50%;border:36px solid #ffffff0b;pointer-events:none}.mini-stat,.home-kettle,.breakdown-card,.panel,.chart-card,.insight-strip,.kettleitem{box-shadow:var(--elev)!important;border:1px solid #e8edf5!important}.mini-stat{border-radius:19px!important;transition:transform .2s}.mini-stat:hover{transform:translateY(-3px)}.home-section-title h2,.sectiontitle h2{letter-spacing:-.6px}.home-products .quick-tile,.productgrid .product{position:relative;overflow:hidden;border:1px solid #e7ecf3!important;box-shadow:0 8px 24px #1a2a4310!important;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.home-products .quick-tile:active,.productgrid .product:active{transform:scale(.94)!important;box-shadow:0 2px 6px #1a2a4310!important}.producticon svg{filter:drop-shadow(0 5px 8px #15243c15)}.quick-add,.pplus{box-shadow:0 5px 12px #ec89452a}.hk-bar,.progress{overflow:hidden}.hk-bar span,.progress span{transition:width .45s ease}.hk-status{letter-spacing:.7px}.breakdown-row{transition:background .2s}.breakdown-row:hover{background:#f8faff}
.category-chips{display:flex;gap:8px;overflow-x:auto;padding:6px 2px 13px;scrollbar-width:none}.category-chips::-webkit-scrollbar{display:none}.category-chip{border:1px solid #e6eaf2;background:#fff;color:#53637c;padding:10px 15px;border-radius:999px;white-space:nowrap;font-size:12px;font-weight:800;box-shadow:0 4px 14px #1c304b09}.category-chip.active{color:#fff;border-color:#172b46;background:linear-gradient(130deg,#162a44,#2a4765);box-shadow:0 8px 20px #152b4930}.product[hidden],.quick-tile[hidden]{display:none!important}.productgrid{align-items:stretch}.productgrid .product{min-height:128px}.feature-tools{margin-top:14px}.smart-search{border:1px solid #e6eaf2!important;box-shadow:0 6px 20px #1a2a430c!important}.smart-search:focus-within{box-shadow:var(--ring)!important}.counter-hint{font-weight:700}.kselect{border-radius:16px!important}.kettleitem{border-radius:18px!important}.kettleitem .progress span{background:linear-gradient(90deg,#fcb84d,#f17640)!important}.chart-card{border-radius:22px!important}.spark-track i{background:linear-gradient(180deg,#ffbd62,#f37c40)!important;transition:height .6s ease}.spark-col:hover .spark-track i{filter:brightness(1.08)}.tablewrap{border-radius:14px;overflow:auto}.tablewrap tr:hover td{background:#fffaf4}.modal{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}.modal.visible .modalbox{animation:sheetUp .25s cubic-bezier(.2,.8,.2,1) both}@keyframes sheetUp{from{opacity:.5;transform:translateY(30px) scale(.98)}to{opacity:1;transform:none}}.modalbox{border-radius:24px!important;box-shadow:0 30px 80px #0b1b3440}.appnav{box-shadow:0 -8px 28px #1d2a4218!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.appnav button{transition:transform .18s ease,color .18s ease}.appnav button.active .nav-symbol{animation:navPop .25s ease}@keyframes navPop{50%{transform:translateY(-3px) scale(1.1)}}.auth{isolation:isolate;overflow:hidden}.auth-orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(1px);opacity:.6}.auth-orb-a{width:350px;height:350px;left:-180px;top:-140px;background:radial-gradient(circle,#ffb54b77,transparent 70%)}.auth-orb-b{width:420px;height:420px;right:-210px;bottom:-180px;background:radial-gradient(circle,#4b9eeb55,transparent 70%)}.authcard{position:relative;z-index:1;box-shadow:0 28px 75px #182c4c24!important;border:1px solid #ffffff90!important;border-radius:28px!important}.auth-kicker{font-size:10px;font-weight:900;letter-spacing:1.7px;color:#d77c40;margin-bottom:16px}.auth-kicker span{color:#48b991}.authcard h1{letter-spacing:-1.5px}.authcard input{border-radius:13px!important}.authcard input:focus{box-shadow:var(--ring)}#toast{z-index:100!important}.sale-confetti{position:fixed;inset:0;pointer-events:none;z-index:90}.sale-particle{position:absolute;width:8px;height:8px;border-radius:3px;background:#f5a34b;animation:particle .65s ease-out forwards}@keyframes particle{to{transform:translate(var(--dx),var(--dy)) rotate(140deg);opacity:0}}.empty{padding:25px!important;text-align:center;color:#7d8ca0}
@media(max-width:650px){main{padding-bottom:calc(100px + env(safe-area-inset-bottom))!important}.feature-hero{min-height:170px;padding:23px!important}.feature-hero h1{font-size:clamp(27px,8vw,37px)!important}.premium-hero{padding:22px!important}.mini-stats{gap:10px}.mini-stat{padding:14px 12px!important}.mini-stat strong{font-size:24px!important}.home-products{gap:10px}.quick-tile{min-height:124px!important}.productgrid{gap:10px!important}.productgrid .product{min-height:126px!important}.authcard{margin:14px!important;padding:26px 22px!important}.modal.visible{align-items:flex-end}.modalbox{border-radius:24px 24px 0 0!important;max-height:90dvh;overflow-y:auto;width:100%!important;margin:0!important;padding-bottom:calc(25px + env(safe-area-inset-bottom))!important}.appnav{padding-bottom:env(safe-area-inset-bottom)!important}.native-topline{padding:9px 11px}.topline-hello{font-size:8px}}
@media(min-width:900px){main{max-width:1100px;margin:0 auto}.home-products{grid-template-columns:repeat(3,minmax(0,1fr))}.productgrid{grid-template-columns:repeat(4,minmax(0,1fr))}.appnav{max-width:1100px;left:50%!important;transform:translateX(-50%)}}
@media print{.native-topline,.appnav,.feature-tools,.category-chips,.view-progress,.bottomnav{display:none!important}.appview[hidden]{display:none!important}.feature-hero{box-shadow:none!important}}

/* Official UltraTea-Lite logo */
.brand-logo-img{display:block;object-fit:cover;padding:0;background:transparent;border-radius:11px;box-shadow:none;flex-shrink:0}
.auth .brand{display:flex;align-items:center;gap:10px}
.auth-brand-logo{display:block;width:58px;height:58px;object-fit:cover;border-radius:15px;flex-shrink:0;box-shadow:0 8px 22px #e9713033}
@media(max-width:480px){.auth-brand-logo{width:49px;height:49px}.headbrand .brand-logo-img{width:34px;height:34px}}


/* V2.0 — Warm Premium theme, designed for mobile first; retains all existing backend actions */
:root{--bg:#fff5ec;--ink:#321a13;--muted:#856d63;--orange:#fa790e;--line:#f1dfd2}
html{background:#fff4ea}body{background:linear-gradient(180deg,#fff0e2 0,#fff8f1 420px,#fff7f0 100%);color:var(--ink)}
header{background:linear-gradient(125deg,#2b0d05 0%,#5e2007 52%,#9e3607 100%)!important;color:#fff!important;border-bottom:2px solid #f79a2a!important;box-shadow:0 10px 24px #6c250d29!important}
header .headbrand,header .headbrand b{color:#fff!important}header .headbrand .accent{color:#ff9a28!important}.shopname{color:#fff6ef!important}.shopname button{border:1px solid #ffffff55!important;background:#ffffff17!important;color:#fff!important}
.native-topline{background:#fffaf4!important;border:1px solid #f3dfc9!important;border-radius:22px!important;box-shadow:0 8px 25px #8c390b10!important;color:#73402a!important}
.topline-hello{color:#c94d0a!important}.premium-hero{background:radial-gradient(circle at 80% 48%,#9c3a08 0%,transparent 46%),linear-gradient(120deg,#3a1207 0%,#692307 54%,#b34007 100%)!important;color:#fff!important;border:1px solid #ed8b21!important;box-shadow:0 19px 36px #83330935!important;min-height:330px;isolation:isolate}
.premium-hero:before{content:'';position:absolute;inset:auto -15% -42% 15%;height:70%;border-top:4px solid #ff9b20;border-radius:50%;transform:rotate(-13deg);pointer-events:none;opacity:.95}
.premium-hero:after{border-color:#ffa63225!important;opacity:.25}.tea-hero-art{position:absolute;right:-4%;top:13%;height:72%;width:46%;pointer-events:none;z-index:-1;opacity:.94;filter:drop-shadow(0 9px 17px #20090066)}.tea-hero-art img{width:100%;height:100%;object-fit:contain}
.hero-top,.hero-greeting,.premium-hero>p,.hero-revenue,.hero-bottom{position:relative;z-index:1}.hero-greeting{max-width:72%;font-size:clamp(25px,5vw,34px)!important}.premium-hero>p{max-width:65%;color:#ffe4d0!important}.hero-revenue{margin-top:26px;max-width:66%}.hero-revenue span{color:#ffe2c9!important}.hero-revenue strong{font-size:clamp(35px,7vw,49px)!important;letter-spacing:-1.4px;text-shadow:0 2px 10px #36100466}.hero-bottom{color:#ffe5d2!important;border-color:#ffffff4a!important}.live-pill{color:#fff1e5!important}.live-pill i{background:#38df8e!important}
.mini-stat,.home-kettle,.breakdown-card,.panel,.chart-card,.insight-strip,.kettleitem,.quick-tile,.product{background:linear-gradient(145deg,#fff 50%,#fff5e9 100%)!important;border:1px solid #f4e2d5!important;box-shadow:0 10px 26px #78300b10!important}
.mini-stat{border-radius:24px!important;min-height:135px}.mini-stat strong{color:#29150f!important}.mini-stat small{color:#856c60!important}.mini-icon.orange{background:#ffdec1!important;color:#e65c08!important}.mini-icon.teal{background:#d7f4df!important;color:#128d4e!important}.home-section-title h2,.sectiontitle h2{color:#3d1b10!important}.see-all,.smallbtn,.start-brew{background:#fff0df!important;color:#b8490a!important}
.appnav{background:linear-gradient(115deg,#391305,#632309 65%,#441404)!important;border:1px solid #9b4c22!important;border-radius:28px!important;left:10px!important;right:10px!important;bottom:8px!important;box-shadow:0 10px 30px #55210b3d!important;padding:8px!important;gap:3px!important}.appnav button{color:#ffe9da!important;border-radius:20px!important;transition:background .2s,transform .2s!important}.appnav button.active{background:linear-gradient(145deg,#ffae24,#f36a05)!important;color:white!important;box-shadow:inset 0 0 0 1px #ffd18a,0 6px 12px #21090033!important}.appnav button:active{transform:scale(.94)}
.feature-hero,.sale-hero,.kettle-hero,.reports-hero,.products-hero{background:linear-gradient(120deg,#3c1508,#7c2a08 65%,#be570c)!important;border:1px solid #d47b27!important}.category-chip.active{background:#ef7818!important;color:white!important}.product:active,.quick-tile:active{transform:scale(.96)}
@media(max-width:650px){main{padding:12px 12px 125px!important}.premium-hero{min-height:345px;padding:22px!important}.hero-greeting{max-width:75%;font-size:27px!important}.hero-revenue{max-width:70%}.tea-hero-art{width:50%;height:63%;top:22%;right:-5%;opacity:.80}.hero-revenue strong{font-size:38px!important}.mini-stats{gap:10px}.mini-stat{min-height:130px}.appnav{left:5px!important;right:5px!important;bottom:5px!important}.appnav button{padding:10px 4px!important;min-width:0!important}}
@media(prefers-reduced-motion:reduce){.appnav button{transition:none!important}}