/* TallyGrow app — styles shared with the TallyGrow demo hubs (merged), plus app-only pieces at the end. */
:root{
  --bg:#F3F6EC; --card:#FFFFFF; --ink:#071C20; --muted:#5B6E69; --line:#E0E7D8;
  --deep:#071C20; --on-deep:#F2F8EE; --lime:#C3F248; --on-lime:#071C20; --leaf:#4C7A0C;
  --lime-soft:#ECF9CC; --gold:#D9A431; --gold-soft:#FBEFD0; --blush:#EE7D70; --blush-soft:#FDE6E1;
  --teal:#1F8A84; --teal-soft:#DAF0EC; --lilac:#8E6BD1; --lilac-soft:#EEE7FA; --bad:#C2412F; --bad-soft:#FBE1DC;
  --display:'Fredoka','Nunito',system-ui,sans-serif; --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#061316; --card:#0E2125; --ink:#E9F3EC; --muted:#98ADA7; --line:#1C373C;
  --deep:#0B2A30; --on-deep:#F2F8EE; --leaf:#C3F248;
  --lime-soft:#1F3315; --gold:#F0C55E; --gold-soft:#372D16; --blush:#FF9A8C; --blush-soft:#3E231F;
  --teal:#5CCFC6; --teal-soft:#123532; --lilac:#BBA0F2; --lilac-soft:#2A2340; --bad:#FF9A88; --bad-soft:#40221D; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#061316; --card:#0E2125; --ink:#E9F3EC; --muted:#98ADA7; --line:#1C373C;
  --deep:#0B2A30; --on-deep:#F2F8EE; --leaf:#C3F248;
  --lime-soft:#1F3315; --gold:#F0C55E; --gold-soft:#372D16; --blush:#FF9A8C; --blush-soft:#3E231F;
  --teal:#5CCFC6; --teal-soft:#123532; --lilac:#BBA0F2; --lilac-soft:#2A2340; --bad:#FF9A88; --bad-soft:#40221D; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
@media (max-width:560px){.hero::before{background:linear-gradient(90deg,rgba(5,21,24,.92) 0%,rgba(5,21,24,.78) 60%,rgba(5,21,24,.2) 100%)}.biz,.hi,.big span{text-shadow:0 1px 8px rgba(0,0,0,.6)}}
.wrap{max-width:780px;margin:0 auto}
p{margin:0}
h2{font:600 19px/1.2 var(--display);margin:0 0 12px;text-wrap:balance}
.muted{color:var(--muted)}
.hero{position:relative;border-radius:26px;overflow:hidden;background:var(--deep);color:var(--on-deep);min-height:300px;isolation:isolate}
.hero .scene{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,21,24,.92) 0%,rgba(5,21,24,.7) 40%,rgba(5,21,24,0) 75%)}
.hero-in{position:relative;padding:18px 20px 22px;display:grid;gap:14px}
.hero-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.logo{height:26px;width:auto;display:block}
.cur{display:inline-flex;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:3px;backdrop-filter:blur(6px)}
.cur button{border:0;background:transparent;color:var(--on-deep);opacity:.75;font:700 13px var(--sans);padding:7px 14px;border-radius:999px;min-height:34px;cursor:pointer}
.cur button[aria-pressed="true"]{background:var(--lime);color:var(--on-lime);opacity:1}
.hi{font:600 26px/1.15 var(--display);margin:0}
.biz{font:700 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--lime);margin-top:4px}
.big span{font:700 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.8}
.big b{display:block;font:700 clamp(44px,11vw,64px)/1 var(--display);color:var(--lime);font-variant-numeric:tabular-nums;margin-top:4px;text-shadow:0 0 30px rgba(195,242,72,.35)}
.chip{display:inline-flex;align-items:center;gap:6px;margin-top:10px;background:rgba(195,242,72,.16);color:var(--lime);border-radius:999px;padding:4px 11px;font-weight:700;font-size:13px}
.chip.down{background:rgba(255,154,136,.18);color:#FFB4A6}
.tabs{display:flex;gap:6px;overflow-x:auto;margin:16px 0 14px;padding-bottom:2px;scrollbar-width:none}
.tabs button{flex:none;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:9px 16px;font:600 14px var(--display);cursor:pointer;transition:background .15s}
.tabs button[aria-selected="true"]{background:var(--lime);color:var(--on-lime);border-color:var(--lime)}
section.view{display:grid;gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:18px;min-width:0}
button.go{font:700 14px var(--sans);border-radius:999px;border:0;background:var(--lime);color:var(--on-lime);padding:10px 20px;cursor:pointer;min-height:42px}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
form{display:grid;gap:12px}
.row{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
label{display:grid;gap:4px;font-size:12.5px;font-weight:700;color:var(--muted)}
input,select{font:15px var(--sans);color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 12px;width:100%;min-width:0}
.hint{font-size:12px;color:var(--muted);font-weight:400}
.head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.head h2{margin:0}
.alerts{display:grid;gap:10px}
.alert{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 12px;align-items:start;padding:14px 16px;border-radius:20px;background:var(--blush-soft);border:1px solid var(--blush)}
.alert.soon{background:var(--gold-soft);border-color:var(--gold)}
.alert .ic{grid-row:1/4;font-size:26px;line-height:1}
.alert b{font:600 16px/1.3 var(--display)}
.alert .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.alert .acts button{font:700 13px var(--sans);border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:7px 14px;min-height:36px;cursor:pointer}
.alert .acts button.go{background:var(--lime);border-color:var(--lime);color:var(--on-lime)}
.kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:620px){.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
.kpi{border-radius:20px;padding:14px 16px}
.kpi span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.kpi b{display:block;font:600 24px/1.2 var(--display);font-variant-numeric:tabular-nums;margin-top:4px}
.kpi em{font-style:normal;font-size:12.5px;color:var(--muted)}
.k1{background:var(--lime-soft)}
.k2{background:var(--gold-soft)}
.k3{background:var(--teal-soft)}
.k4{background:var(--lilac-soft)}
.up{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.ev{border-radius:20px;overflow:hidden;background:var(--bg);border:1px solid var(--line)}
.ev .pic{position:relative;aspect-ratio:16/9;max-width:100%}
.ev .pic svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.date{position:absolute;left:10px;top:10px;background:rgba(255,255,255,.94);color:#071C20;border-radius:12px;padding:4px 9px;text-align:center;line-height:1.05;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.date b{display:block;font:700 19px var(--display)}
.date small{font:700 10px var(--sans);letter-spacing:.1em;text-transform:uppercase}
.ev .info{padding:12px 14px 14px;display:grid;gap:4px}
.ev .info b{font:600 16px var(--display)}
.ev .info small{color:var(--muted);font-size:13px}
.list{display:grid}
.item{display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.item:first-child{border-top:0}
.item.noimg{grid-template-columns:minmax(0,1fr) auto}
.item .r{text-align:right}
.item small{color:var(--muted);font-size:12.5px}
.item b{font-weight:700}
.thumb{width:54px;height:54px;border-radius:16px;overflow:hidden;display:block}
.pill{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--gold-soft);color:var(--ink);white-space:nowrap}
.pill.paid,.pill.won{background:var(--lime-soft);color:var(--leaf)}
.pill.owed,.pill.lost{background:var(--bad-soft);color:var(--bad)}
.ledger{display:grid;gap:2px;font-variant-numeric:tabular-nums}
.ledger div{display:flex;justify-content:space-between;gap:12px;padding:5px 0}
.ledger .sub{padding-left:14px;color:var(--muted);font-size:14px}
.ledger .line{border-top:2px dashed var(--line);margin-top:6px;padding-top:11px;font:600 19px var(--display)}
.pos{color:var(--leaf)}
.neg{color:var(--bad)}
.bars{display:grid;gap:14px}
.bars>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;font-size:14px;font-variant-numeric:tabular-nums}
.bar{grid-column:1/-1;height:12px;border-radius:999px;background:var(--line);overflow:hidden}
.bar i{display:block;height:100%;border-radius:999px}
.tips{display:grid;gap:10px}
.tip{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 12px;padding:14px 16px;border-radius:18px;font-size:14px}
.tip .ic{grid-row:1/3;font-size:24px;line-height:1}
.tip b{font:600 16px var(--display)}
.t1{background:var(--blush-soft)}
.t2{background:var(--gold-soft)}
.t3{background:var(--lime-soft)}
.t4{background:var(--lilac-soft)}
table{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums}
th,td{padding:10px 6px;text-align:right;border-top:1px solid var(--line);white-space:nowrap}
th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-top:0}
th:first-child,td:first-child{text-align:left}
.scroll{overflow-x:auto}
footer{margin-top:30px;display:flex;justify-content:center}
footer .pw{display:inline-flex;align-items:center;gap:10px;background:#071C20;border-radius:999px;padding:9px 16px;color:#C9D6D0;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
footer img{height:18px;width:auto}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:#071C20;color:#C3F248;padding:11px 18px;border-radius:999px;font-size:14px;font-weight:700;z-index:5;box-shadow:0 10px 30px rgba(0,0,0,.25)}
@media (prefers-reduced-motion:no-preference){
  .sway{transform-box:fill-box;transform-origin:50% 100%;animation:sway 4.5s ease-in-out infinite}
  .swayTop{transform-box:fill-box;transform-origin:50% 0;animation:sway 6s ease-in-out infinite}
  .bob{animation:bob 4s ease-in-out infinite}
  .flick{transform-box:fill-box;transform-origin:50% 100%;animation:flick .5s ease-in-out infinite alternate}
  .glow{animation:glow 1.3s ease-in-out infinite alternate}
  .tw{animation:tw 2.4s ease-in-out infinite alternate}
  .fall{transform-box:fill-box;transform-origin:center;animation:fall 7s linear infinite}
  .petal{transform-box:fill-box;transform-origin:center;animation:petal 9s linear infinite}
  .rise{animation:rise 2.2s ease-in infinite}
  .bk{animation:bk 7s ease-in-out infinite alternate}
  .drift{animation:drift 14s ease-in-out infinite alternate}
  .clinkL{transform-box:fill-box;transform-origin:50% 100%;animation:clinkL 3.2s ease-in-out infinite}
  .clinkR{transform-box:fill-box;transform-origin:50% 100%;animation:clinkR 3.2s ease-in-out infinite}
  .spark{transform-box:fill-box;transform-origin:center;animation:spark 3.2s ease-out infinite}
  .alert:first-child .ic{animation:ring 2.6s ease-in-out infinite;transform-origin:50% 10%}
  .tabs button:active,.go:active{transform:scale(.97)}
}
@keyframes sway{0%,100%{transform:rotate(-3.5deg)}50%{transform:rotate(3.5deg)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes flick{0%{transform:scale(1,1) skewX(0)}50%{transform:scale(.88,1.12) skewX(4deg)}100%{transform:scale(1.06,.92) skewX(-4deg)}}
@keyframes glow{from{opacity:.5}to{opacity:1}}
@keyframes tw{from{opacity:.3}to{opacity:1}}
@keyframes fall{from{transform:translateY(-150px) rotate(0)}to{transform:translateY(170px) rotate(620deg)}}
@keyframes petal{0%{transform:translate(0,-160px) rotate(0)}50%{transform:translate(14px,0) rotate(200deg)}100%{transform:translate(-6px,170px) rotate(400deg)}}
@keyframes rise{0%{transform:translateY(0);opacity:0}20%{opacity:.95}100%{transform:translateY(-32px);opacity:0}}
@keyframes bk{from{opacity:.25;transform:translateY(4px)}to{opacity:.8;transform:translateY(-6px)}}
@keyframes drift{from{transform:translateX(-14px)}to{transform:translateX(14px)}}
@keyframes clinkL{0%,55%,100%{transform:rotate(4deg)}72%{transform:rotate(9deg)}80%{transform:rotate(7deg)}}
@keyframes clinkR{0%,55%,100%{transform:rotate(-4deg)}72%{transform:rotate(-9deg)}80%{transform:rotate(-7deg)}}
@keyframes spark{0%,62%{transform:scale(0);opacity:0}74%{transform:scale(1.2);opacity:1}100%{transform:scale(.4);opacity:0}}
@keyframes ring{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(14deg)}85%{transform:rotate(-12deg)}92%{transform:rotate(6deg)}}
.logo{cursor:pointer}
.small{font-size:12.5px}
.hero-in{padding-bottom:64px!important}
@media (prefers-reduced-motion:no-preference){.pulse{animation:shad 3.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}}
.tile{flex:none;width:58px;height:58px;border-radius:16px;background:color-mix(in srgb,var(--tc) 14%,var(--bg));position:relative;display:grid;place-items:center;overflow:hidden}
.tile.big{width:76px;height:76px;border-radius:20px}
.tile .fl{width:104%;display:block;position:relative;z-index:1;margin-top:-8%}
.tile .fl svg{display:block;width:100%;height:auto}
.tile .sh{position:absolute;left:18%;right:18%;bottom:14%;height:8%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.28),transparent)}
.sellers{display:grid;gap:12px}
.seller{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:12px;align-items:center;font-variant-numeric:tabular-nums}
.seller .sd{display:grid;gap:3px;min-width:0}
.seller small{color:var(--muted);font-size:12.5px}
.seller .sv{font:600 17px var(--display)}
.seller .bar{height:9px}
.stock{display:grid}
.srow{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.srow:first-child{border-top:0}
.sinfo{display:grid;gap:4px;min-width:0}
.sinfo .st{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sinfo .st b{font:600 16px var(--display)}
.sinfo small{color:var(--muted);font-size:12.5px}
.sinfo .bar{height:7px;margin-top:2px}
.pricing{display:flex;gap:6px;align-items:baseline;flex-wrap:wrap;font-size:14px}
.pricing i{font-style:normal;color:var(--muted)}
.pricing .sell{font-weight:700}
.pricing .pp{font-size:12px;font-weight:700;color:var(--leaf);background:var(--lime-soft);border-radius:999px;padding:2px 8px}
.sq{display:grid;justify-items:center;gap:2px;text-align:center}
.sq .qty{font:600 26px/1 var(--display)}
.sq small{color:var(--muted);font-size:11.5px}
.rs{margin-top:4px;font:700 13px var(--sans);border-radius:999px;border:0;background:var(--lime);color:var(--on-lime);padding:6px 12px;min-height:32px;cursor:pointer}
.pill.slow{background:var(--lilac-soft);color:var(--lilac)}
.alert.slow{background:var(--lilac-soft);border-color:var(--lilac)}
.more{margin-top:10px;font:700 13.5px var(--sans);border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:9px 16px;cursor:pointer;min-height:38px}
.orderprev{display:flex;gap:12px;align-items:center;background:var(--lime-soft);border-radius:16px;padding:10px 14px}
.orderprev div{display:grid;gap:2px}
.orderprev b{font:600 16px var(--display)}
.orderprev small{color:var(--muted);font-size:12.5px}
.hero .scene .hover{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){
  .tile .fl{animation:float 3.2s ease-in-out infinite}
  .tile:nth-child(odd) .fl{animation-delay:-1.4s}
  .tile .sh{animation:shad 3.2s ease-in-out infinite}
  .hero .scene .hover{animation:hover 3.6s ease-in-out infinite}
  .rise2{animation:rise2 4s linear infinite}
  .beam{animation:beam 4s ease-in-out infinite alternate}
  .bump{animation:bump .5s ease-out}
}
@keyframes float{0%,100%{transform:translateY(2px) rotate(-3deg)}50%{transform:translateY(-4px) rotate(2deg)}}
@keyframes shad{0%,100%{transform:scaleX(1);opacity:1}50%{transform:scaleX(.75);opacity:.6}}
@keyframes hover{0%,100%{transform:translateY(3px) rotate(-2deg)}50%{transform:translateY(-6px) rotate(1.5deg)}}
@keyframes rise2{from{transform:translateY(0);opacity:0}20%{opacity:.9}to{transform:translateY(-120px);opacity:0}}
@keyframes beam{from{opacity:.55}to{opacity:1}}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.45);color:var(--leaf)}100%{transform:scale(1)}}
.ntile .fl{width:54%!important;margin-top:0!important}
.tile.big.ntile .fl{width:50%!important}
.ntile .sp{position:absolute;right:16%;top:12%;font-style:normal;font-size:11px;color:#fff;text-shadow:0 0 6px rgba(255,255,255,.9);z-index:2}
.btile .fl{width:46%!important;margin-top:0!important}
.pill.new{background:var(--teal-soft);color:var(--teal);font-size:10.5px;padding:1px 8px;vertical-align:1px}
.alert.info{background:var(--teal-soft);border-color:var(--teal)}
.split{display:grid;gap:12px}
.stack{display:flex;height:18px;border-radius:999px;overflow:hidden;background:var(--line)}
.stack i{display:block;height:100%}
.legend{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13.5px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
@media (prefers-reduced-motion:no-preference){.tw2{animation:tw 1.8s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.ntile .sp{animation:tw 1.6s ease-in-out infinite alternate}}
.htile .fl{width:62%!important;margin-top:4%!important}
.tile.big.htile .fl{width:58%!important}
.topstyle{display:flex;gap:16px;align-items:center;background:var(--lime-soft);border-color:transparent}
.topstyle>div{display:grid;gap:2px;min-width:0}
.topstyle .eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--leaf)}
.topstyle b{font:600 24px/1.15 var(--display)}
.topstyle small{color:var(--muted);font-size:13px}
.topstyle .tile{background:var(--card)}
.weeks{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.weeks button{flex:none;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 14px;font:600 13px var(--sans);cursor:pointer;min-height:36px}
.weeks button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:end}
.dcol{display:grid;justify-items:center;gap:6px}
.dcol b{font:600 16px var(--display);min-height:20px}
.dbar{width:100%;max-width:38px;height:120px;border-radius:12px;background:var(--line);display:flex;align-items:flex-end;overflow:hidden}
.dbar i{display:block;width:100%;background:var(--teal);border-radius:12px;transition:height .5s ease}
.dbar i.hot{background:var(--lime)}
.dcol small{color:var(--muted);font-size:12px;font-weight:700}
.dnote{grid-column:1/-1;margin-top:6px}
.kpi b.kpsm{font-size:17px;line-height:1.25}
@media (prefers-reduced-motion:no-preference){.sway2{animation:sway2 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 0}.air{animation:air 1.4s linear infinite}}
@keyframes sway2{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes air{0%{transform:translateX(-6px);opacity:0}30%{opacity:.8}100%{transform:translateX(14px);opacity:0}}
.ledger .mid{border-top:1px solid var(--line);margin-top:4px;padding-top:9px!important;font-weight:700;color:var(--leaf);font-size:15.5px}
.seller.dim{opacity:.55}
.topstyle .tile{width:84px;height:84px}
.dtile.phone .fl{width:34%!important;margin-top:0!important}
.dtile.laptop .fl{width:74%!important;margin-top:0!important}
.tile.big.dtile.phone .fl{width:30%!important}
.dbar.stackb{flex-direction:column;justify-content:flex-end}
.dbar.stackb i{border-radius:0}
.dbar.stackb i.ph{background:var(--teal)}
.dbar.stackb i.lp{background:var(--lime)}
.dbar.stackb i:last-child{border-radius:0 0 12px 12px}
.dbar.stackb i:first-child{border-radius:12px 12px 0 0}
.lg{display:inline-flex;align-items:center;gap:5px;font-weight:700}
.lg i{width:10px;height:10px;border-radius:3px;display:inline-block}
.lg i.ph{background:var(--teal)}
.lg i.lp{background:var(--lime)}
.eyebrow2{margin:6px 0 0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--muted)}
@media (prefers-reduced-motion:no-preference){.glow2{animation:scr 3s ease-in-out infinite}}
@keyframes scr{0%,100%{opacity:0}50%{opacity:.18}}
.dogtile .fl{width:78%!important;margin-top:0!important}
.tile.big.dogtile .fl{width:74%!important}
.ptile .fl{width:40%!important;margin-top:0!important}
.tile.big.ptile .fl{width:36%!important}
.tile.inc{background:color-mix(in srgb,var(--tc) 22%,var(--bg))}
.incic{font-size:24px;line-height:1}
#w-days{display:block}
.days.six{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;align-items:end}
.dbar i.bk2{background:repeating-linear-gradient(45deg,var(--teal-soft),var(--teal-soft) 4px,color-mix(in srgb,var(--teal) 45%,var(--teal-soft)) 4px,color-mix(in srgb,var(--teal) 45%,var(--teal-soft)) 8px)}
.cap{font-weight:700;color:var(--ink)}
.dchips{display:flex;gap:4px;margin-top:5px;flex-wrap:wrap}
.dch{font-size:10.5px;font-weight:700;min-width:22px;height:22px;padding:0 6px;border-radius:7px;display:inline-grid;place-items:center;background:var(--line);color:var(--muted)}
.dch.on{background:var(--lime);color:var(--on-lime)}
@media (prefers-reduced-motion:no-preference){
  .peek{animation:peek 3.4s ease-in-out infinite}
  .bounce{animation:bounce 1.6s cubic-bezier(.3,0,.7,1) infinite}
  .dogtile .earL,.dogtile .earR,.peek .earL,.peek .earR{transform-box:fill-box;animation:ear 2.4s ease-in-out infinite}
  .earL{transform-origin:80% 10%}.earR{transform-origin:20% 10%;animation-delay:-.4s!important}
  .tongue{animation:pant .6s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 0}
}
@keyframes peek{0%,100%{transform:translateY(6px)}40%,60%{transform:translateY(-6px)}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(70px)}}
@keyframes ear{0%,100%{transform:rotate(0)}50%{transform:rotate(-8deg)}}
@keyframes pant{from{transform:scaleY(.8)}to{transform:scaleY(1.15)}}
/* ───────── app-only ───────── */
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:15px/1.5 var(--sans);padding:max(12px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(110px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));-webkit-tap-highlight-color:transparent}
.boot{display:grid;place-items:center;min-height:80vh;text-align:center;color:var(--muted)}
.boot img{border-radius:20px}
.hero-top .tools{display:flex;gap:8px;align-items:center}
.iconbtn{width:38px;height:38px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);color:var(--on-deep);display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px)}
.iconbtn svg{width:20px;height:20px}
.big .lockchip{background:rgba(255,255,255,.12);color:#F2F8EE}
.fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));z-index:8;border:0;border-radius:999px;background:var(--lime);color:var(--on-lime);font:700 16px var(--display);padding:15px 22px;box-shadow:0 12px 30px rgba(7,28,32,.35);cursor:pointer;display:flex;gap:8px;align-items:center}
.fab:active{transform:scale(.97)}
.install{display:flex;gap:12px;align-items:center;background:var(--deep);color:var(--on-deep);border-radius:20px;padding:12px 14px;margin-bottom:12px}
.install img{width:42px;height:42px;border-radius:12px;flex:none}
.install div{flex:1;min-width:0}
.install b{font:600 15px var(--display);display:block}
.install small{opacity:.8;font-size:12.5px}
.install button{flex:none}
.install .x{background:none;border:0;color:var(--on-deep);opacity:.7;font-size:20px;cursor:pointer;padding:4px 6px}
.lockcard{text-align:center;padding:26px 18px}
.lockcard .pad{font-size:40px}
.lockcard h2{margin:8px 0}
.blurred{filter:blur(7px);pointer-events:none;user-select:none}
.ltile{flex:none;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font:700 22px var(--display);color:var(--ink)}
.topstyle .ltile{width:76px;height:76px;border-radius:20px;font-size:30px;background:var(--card)}
.item .del{border:0;background:none;color:var(--muted);font-size:20px;cursor:pointer;padding:2px 6px}
.pending{font-size:11.5px;font-weight:700;color:var(--gold)}
.empty{color:var(--muted);padding:6px 0}
/* forms & sheets */
.auth{min-height:88vh;display:flex;flex-direction:column;justify-content:center;max-width:460px;margin:0 auto}
.auth .logo-in{background:var(--deep);border-radius:26px;padding:26px 22px;color:var(--on-deep);position:relative;overflow:hidden;isolation:isolate;margin-bottom:16px}
.auth .logo-in .scene{position:absolute;inset:0;width:100%;height:100%;z-index:-2;opacity:.75}
.auth .logo-in::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,21,24,.94),rgba(5,21,24,.55))}
.auth .logo-in img{height:30px}
.auth h1{font:600 28px/1.15 var(--display);margin:14px 0 4px}
.auth .card{display:grid;gap:12px}
.err{color:var(--bad);font-size:14px;min-height:1em}
.ok{color:var(--leaf);font-size:14px}
.linkbtn{background:none;border:0;color:var(--leaf);font:700 14px var(--sans);cursor:pointer;padding:6px 0}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px;gap:3px}
.seg button{border:0;background:none;border-radius:999px;padding:9px;font:700 14px var(--sans);color:var(--ink);cursor:pointer}
.seg button.on{background:var(--ink);color:var(--bg)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 13px;font:600 14px var(--sans);cursor:pointer}
.chips button.on{background:var(--lime);border-color:var(--lime);color:var(--on-lime)}
.sheet-bg{position:fixed;inset:0;background:rgba(7,28,32,.5);z-index:20;display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--bg);width:100%;max-width:560px;border-radius:24px 24px 0 0;padding:16px 16px calc(22px + env(safe-area-inset-bottom));max-height:92vh;overflow:auto}
.sheet .grab{width:44px;height:5px;background:var(--line);border-radius:9px;margin:0 auto 12px}
.sheet h2{margin:4px 0 10px}
.btnrow{display:grid;gap:8px}
button.ghost{font:700 14px var(--sans);border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:11px 18px;cursor:pointer;min-height:44px}
button.go.wide,button.ghost.wide{width:100%}
.steps{display:grid;gap:10px;margin:6px 0 4px;padding:0;list-style:none;counter-reset:s}
.steps li{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:start;counter-increment:s}
.steps li::before{content:counter(s);width:30px;height:30px;border-radius:999px;background:var(--lime);color:var(--on-lime);display:grid;place-items:center;font:700 14px var(--display)}
.toast{max-width:90vw;text-align:center}
.settings .card{display:grid;gap:10px}
.settings .row2{display:flex;justify-content:space-between;align-items:center;gap:12px}
.alert.good{background:var(--lime-soft);border-color:var(--lime)}
.alert.info{background:var(--teal-soft);border-color:var(--teal)}
.cur button{min-height:34px}
@media (max-width:420px){.hero-top .cur button{padding:7px 10px}}
.toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}

/* Hide the host's floating badge (temporary, until the paid plan) */
#nl-badge-frame,#nl-hud-frame,iframe[id^="nl-"],iframe[title="Powered by Netlify"],iframe[title="Netlify block"]{display:none!important;visibility:hidden!important}

/* Hero: week / month switch, per-hub custom tabs */
.per{display:flex;width:max-content;margin-bottom:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:2px}
.per button{border:0;background:transparent;color:var(--on-deep);opacity:.75;font:700 12px var(--sans);padding:5px 12px;border-radius:999px;min-height:30px;cursor:pointer}
.per button[aria-pressed="true"]{background:rgba(195,242,72,.2);color:var(--lime);opacity:1}
.goal .goalnum{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:6px 0 12px}
.goal .goalnum b{font:700 40px/1 var(--display);font-variant-numeric:tabular-nums}
.goal .goalnum span{color:var(--muted,#4E625C);font-weight:600}
.goal .bar{display:block;height:16px}
.goal .bar i{background:var(--lime)}
.owbtns{display:inline-flex;gap:6px;margin-top:6px}
.sm{padding:6px 11px!important;font-size:12.5px!important;min-height:30px!important;border-radius:999px;text-decoration:none;display:inline-flex;align-items:center}
a.ghost{font:700 14px var(--sans);border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer}

/* Per-business brand colours (see applyTheme in app.js) */
.themed-hue .hero > svg{filter:hue-rotate(var(--scene-hue,0deg))}
.hero .scene .scene-bg{fill:var(--deep)}
.themed .hero::before{background:linear-gradient(90deg,color-mix(in srgb,var(--deep) 94%,transparent) 0%,color-mix(in srgb,var(--deep) 72%,transparent) 40%,transparent 75%)}
@media (max-width:560px){.themed .hero::before{background:linear-gradient(90deg,color-mix(in srgb,var(--deep) 94%,transparent) 0%,color-mix(in srgb,var(--deep) 80%,transparent) 60%,color-mix(in srgb,var(--deep) 20%,transparent) 100%)}}
.themed .big b{text-shadow:0 0 30px color-mix(in srgb,var(--lime) 35%,transparent)}
.themed .chip:not(.down){background:color-mix(in srgb,var(--lime) 18%,transparent)}
.themed .per button[aria-pressed="true"]{background:color-mix(in srgb,var(--lime) 22%,transparent)}
@keyframes stitch{from{transform:translateY(-5px)}to{transform:translateY(2px)}}
@keyframes feed{to{stroke-dashoffset:22}}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:no-preference){
  .stitch{animation:stitch .3s ease-in-out infinite alternate}
  .feed{animation:feed 1.1s linear infinite}
  .spin{transform-box:fill-box;transform-origin:center;animation:spin 1.6s linear infinite}
}
@keyframes grow{0%,100%{transform:scaleY(.82)}50%{transform:scaleY(1)}}
@keyframes peck{0%,55%,100%{transform:rotate(0)}70%{transform:rotate(34deg)}82%{transform:rotate(8deg)}90%{transform:rotate(30deg)}}
@media (prefers-reduced-motion:no-preference){
  .grow{transform-box:fill-box;transform-origin:50% 100%;animation:grow 2.6s ease-in-out infinite}
  .peck{transform-box:fill-box;transform-origin:10% 90%;animation:peck 2.4s ease-in-out infinite}
}