/* INSIDE WOHNRoom² · unified premium design system */
:root{
  color-scheme:dark;
  --font-ui:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-display:"Poiret One",sans-serif;
  --bg:#080706;--bg2:#0d0a08;--surface:#12100e;--surface2:#181411;--surface3:#211a16;--surface4:#2a211b;
  --text:#f8f2ec;--text2:#d5cbc2;--muted:#948980;--muted2:#756b63;
  --line:rgba(236,218,199,.10);--line2:rgba(236,218,199,.19);--line3:rgba(236,218,199,.28);
  --champ:#d9b890;--champ2:#b98863;--champ3:#8e6145;--champSoft:rgba(217,184,144,.095);--champGlow:rgba(217,184,144,.16);
  --green:#7bc59c;--green2:#4fae7c;--greenSoft:rgba(123,197,156,.10);--amber:#d7aa70;--amberSoft:rgba(215,170,112,.10);--red:#d98774;--redSoft:rgba(217,135,116,.10);
  --revenue:#73c496;--boost:#d2a87e;--brand:var(--champ);--brand-strong:var(--champ2);--brand-soft:var(--champSoft);--good:var(--green);
  --surface-2:var(--surface2);--surface-3:var(--surface3);--line-strong:var(--line2);--text-soft:var(--text2);
  --chart-grid:rgba(236,218,199,.07);--expected-line:rgba(217,184,144,.62);
  --shadow-lg:0 28px 80px rgba(0,0,0,.30),0 1px 0 rgba(255,255,255,.018) inset;
  --shadow-md:0 14px 42px rgba(0,0,0,.21),0 1px 0 rgba(255,255,255,.018) inset;
  --shadow-sm:0 7px 22px rgba(0,0,0,.15);
  --rx:28px;--rl:21px;--rm:15px;--rs:11px;--ease:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.2,.8,.2,1);--fast:150ms;--normal:260ms;
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f3f0eb;--bg2:#faf8f4;--surface:#fffefa;--surface2:#fbf8f4;--surface3:#f1ece6;--surface4:#e5ddd4;
  --text:#27211d;--text2:#514840;--muted:#746a62;--muted2:#968a80;
  --line:rgba(66,50,39,.095);--line2:rgba(66,50,39,.17);--line3:rgba(66,50,39,.25);
  --champ:#966a4d;--champ2:#7b533a;--champ3:#63412e;--champSoft:rgba(150,106,77,.075);--champGlow:rgba(150,106,77,.10);
  --green:#4d8d65;--green2:#397650;--greenSoft:rgba(77,141,101,.09);--amber:#95672e;--amberSoft:rgba(149,103,46,.09);--red:#a95b49;--redSoft:rgba(169,91,73,.09);
  --revenue:#4d8d65;--boost:#a67552;--chart-grid:rgba(66,50,39,.08);--expected-line:rgba(123,83,58,.62);
  --shadow-lg:0 22px 54px rgba(68,50,37,.085),0 1px 0 rgba(255,255,255,.9) inset;
  --shadow-md:0 9px 26px rgba(68,50,37,.055),0 1px 0 rgba(255,255,255,.9) inset;
  --shadow-sm:0 4px 14px rgba(68,50,37,.045);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{min-height:100%;background:var(--bg);scroll-behavior:smooth;text-rendering:optimizeLegibility}
body{margin:0;min-height:100%;font-family:var(--font-ui);font-size:15px;line-height:1.5;color:var(--text);background:radial-gradient(980px 600px at 52% -290px,var(--champGlow),transparent 70%),radial-gradient(680px 520px at 100% 28%,rgba(185,136,99,.035),transparent 72%),linear-gradient(180deg,var(--bg2),var(--bg) 42%,var(--bg));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"kern" 1,"liga" 1}
button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}button,input,select,textarea{-webkit-font-smoothing:antialiased}.hidden{display:none!important}
::selection{background:color-mix(in srgb,var(--champ) 28%,transparent);color:var(--text)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid color-mix(in srgb,var(--champ) 78%,white 6%);outline-offset:3px}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--muted) 82%,transparent)}
.value,.money,.todayKpis strong,.receiptTop strong,.bonusSplit b,.bonusTargetLine strong,.polishProgress strong,.polishAmounts b,.proScore{font-variant-numeric:tabular-nums lining-nums}
.wrap{width:min(1240px,calc(100% - 38px));margin:0 auto;padding:calc(13px + env(safe-area-inset-top)) 0 calc(118px + env(safe-area-inset-bottom))}

/* Header */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px;padding:9px 0 14px;background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 97%,transparent),color-mix(in srgb,var(--bg) 90%,transparent) 72%,transparent);backdrop-filter:blur(24px) saturate(1.08);-webkit-backdrop-filter:blur(24px) saturate(1.08)}
.top:after{content:"";position:absolute;left:0;right:0;bottom:10px;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--line2) 55%,transparent),transparent);opacity:.42;pointer-events:none}
.brandArea{display:flex;align-items:center;gap:20px;min-width:0}.brandStack{display:grid;justify-items:start;gap:3px;flex:0 0 auto}.insideWord{font-family:var(--font-ui);font-size:8px;line-height:1;font-weight:700;letter-spacing:.46em;color:var(--champ);padding-left:4px}.brandStack img{display:block;width:132px;height:auto;filter:drop-shadow(0 8px 20px rgba(0,0,0,.16))}.title{min-width:0;padding-left:2px}.title b{display:block;font-family:var(--font-display);font-weight:400;font-size:27px;line-height:1;letter-spacing:.018em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.title span{display:block;margin-top:6px;font-size:8.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
:root[data-theme="light"] .brandStack img{filter:brightness(0) saturate(100%) opacity(.84)}
.actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;min-width:0}.connector{display:inline-flex;align-items:center;min-height:34px;padding:0 11px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--muted);font-size:9px;font-weight:750;letter-spacing:.035em;white-space:nowrap;box-shadow:0 1px 0 rgba(255,255,255,.02) inset}.connector.live{color:var(--green);border-color:color-mix(in srgb,var(--green) 27%,var(--line));background:color-mix(in srgb,var(--greenSoft) 68%,var(--surface))}.connector.warn{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 30%,var(--line));background:color-mix(in srgb,var(--amberSoft) 72%,var(--surface))}
.iconBtn,.modeBtn,.profileBtn,.dateBtn{appearance:none;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 92%,transparent);color:var(--text);height:40px;border-radius:13px;display:inline-grid;place-items:center;padding:0 12px;transition:transform var(--fast) var(--ease),border-color var(--fast) ease,background var(--fast) ease,box-shadow var(--fast) ease;box-shadow:0 1px 0 rgba(255,255,255,.025) inset}.iconBtn{width:40px;padding:0;font-size:15px}.profileBtn{width:40px;padding:0;border-radius:50%;font-weight:800;background:linear-gradient(145deg,color-mix(in srgb,var(--champ) 16%,var(--surface2)),var(--surface));color:var(--champ);border-color:color-mix(in srgb,var(--champ) 24%,var(--line))}.modeBtn{font-size:10px;font-weight:800;letter-spacing:.02em}.modeBtn.active{background:linear-gradient(135deg,var(--champ),var(--champ2));border-color:transparent;color:#21170f;box-shadow:0 8px 24px color-mix(in srgb,var(--champ) 20%,transparent)}
.iconBtn:hover,.modeBtn:hover,.profileBtn:hover,.dateBtn:hover{border-color:var(--line2);background:color-mix(in srgb,var(--surface2) 94%,var(--champ) 3%)}.iconBtn:active,.modeBtn:active,.profileBtn:active,.dateBtn:active,.quick:active,.navBtn:active{transform:scale(.965)}
.miniSeg{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 1px 0 rgba(255,255,255,.02) inset}.miniSeg button{border:0;background:transparent;color:var(--muted);height:29px;padding:0 9px;border-radius:9px;font-size:9px;font-weight:800;transition:background var(--fast),color var(--fast),transform var(--fast)}.miniSeg button.active{background:linear-gradient(145deg,var(--surface3),color-mix(in srgb,var(--champ) 8%,var(--surface3)));color:var(--text);box-shadow:inset 0 0 0 1px var(--line),0 5px 14px rgba(0,0,0,.08)}

/* Personal welcome */
.hero{position:relative;isolation:isolate;overflow:hidden;margin:7px 0 17px;padding:27px 28px 26px;border:1px solid var(--line);border-radius:var(--rx);background:linear-gradient(145deg,color-mix(in srgb,var(--surface2) 96%,var(--champ) 4%),var(--surface));box-shadow:var(--shadow-lg)}.hero:before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(115deg,transparent 0,rgba(217,184,144,.035) 42%,transparent 70%);pointer-events:none}.hero:after{content:"";position:absolute;z-index:-1;width:340px;height:340px;border-radius:50%;right:-145px;top:-205px;background:radial-gradient(circle,var(--champGlow),transparent 69%);pointer-events:none}.eyebrow,.label{font-size:8.5px;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--champ)}.hero h1{position:relative;margin:7px 0 6px;font-family:var(--font-display);font-size:clamp(36px,4.6vw,50px);line-height:.98;font-weight:400;letter-spacing:.008em}.hero p{position:relative;margin:0;color:var(--text2);font-size:12.5px}.roleChip{display:inline-flex;align-items:center;margin-top:15px;padding:6px 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--champ) 23%,var(--line));background:var(--champSoft);color:var(--champ);font-size:9px;font-weight:800;letter-spacing:.03em}
.notice{margin:0 0 14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--amber) 30%,var(--line));border-radius:var(--rm);background:linear-gradient(145deg,color-mix(in srgb,var(--amberSoft) 72%,var(--surface)),var(--surface));color:var(--text2);font-size:11px;box-shadow:var(--shadow-sm)}.notice.good{border-color:color-mix(in srgb,var(--green) 28%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--greenSoft) 72%,var(--surface)),var(--surface))}
.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 14px}.dateInput,.searchInput,.filterSelect{height:42px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--surface) 95%,transparent);color:var(--text);padding:0 13px;box-shadow:0 1px 0 rgba(255,255,255,.02) inset;transition:border-color var(--fast),background var(--fast),box-shadow var(--fast)}.dateInput:hover,.searchInput:hover,.filterSelect:hover{border-color:var(--line2)}.dateInput:focus,.searchInput:focus,.filterSelect:focus{background:var(--surface2);border-color:color-mix(in srgb,var(--champ) 45%,var(--line));box-shadow:0 0 0 4px color-mix(in srgb,var(--champ) 8%,transparent);outline:none}.searchInput{min-width:250px}.filterSelect{min-width:158px}.dateBtn{font-size:10px;font-weight:800}

/* Page hierarchy */
.pageHead{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin:7px 2px 15px}.pageHead h2{margin:0;font-family:var(--font-display);font-size:34px;font-weight:400;line-height:1;letter-spacing:.005em}.pageHead p,.pageHead>span{margin:5px 0 0;color:var(--muted);font-size:10px;letter-spacing:.01em}.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}.card{grid-column:span 4;position:relative;isolation:isolate;overflow:hidden;min-height:108px;padding:18px;border:1px solid var(--line);border-radius:var(--rl);background:linear-gradient(145deg,color-mix(in srgb,var(--surface2) 97%,var(--champ) 3%),var(--surface));box-shadow:var(--shadow-md);transition:transform var(--normal) var(--ease),border-color var(--normal) ease,box-shadow var(--normal) var(--ease),background var(--normal) ease}.card:before{content:"";position:absolute;z-index:-1;left:18px;right:18px;top:0;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--champ) 26%,transparent),transparent);opacity:.72}.card.wide{grid-column:span 12}.card.half{grid-column:span 6}.card.quarter{grid-column:span 3}.card.soft{background:var(--surface)}.card>.label{color:var(--muted)}
@media(hover:hover){.card:hover{border-color:color-mix(in srgb,var(--champ) 18%,var(--line2));box-shadow:0 18px 52px rgba(0,0,0,.23),0 1px 0 rgba(255,255,255,.025) inset}}
.value{margin-top:8px;font-size:clamp(27px,3.6vw,35px);line-height:1;font-weight:750;letter-spacing:-.045em}.hint{margin-top:8px;color:var(--muted);font-size:10.5px;line-height:1.5}.subtle{color:var(--muted)}.sectionHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}.sectionHead h2{margin:0;font-size:15px;line-height:1.25;font-weight:750;letter-spacing:-.012em}.sectionHead .hint{margin:0}
.rows{display:grid}.row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);transition:background var(--fast),transform var(--fast)}.row:last-child{border-bottom:0}.row>div:first-child{min-width:0}.row b{display:block;font-size:12.5px;line-height:1.38;font-weight:700}.row span{display:block;margin-top:4px;color:var(--muted);font-size:10px;line-height:1.45}.money{flex:0 0 auto;white-space:nowrap;font-size:12.5px;font-weight:780;letter-spacing:-.018em}.empty{padding:27px 10px;text-align:center;color:var(--muted);font-size:11px;line-height:1.5}.progress{height:7px;margin:14px 0 11px;border-radius:999px;background:var(--surface3);overflow:hidden;border:1px solid color-mix(in srgb,var(--line) 70%,transparent)}.progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--champ2),var(--champ));box-shadow:0 0 16px color-mix(in srgb,var(--champ) 22%,transparent);transition:width .7s var(--ease)}
.statusBadge{display:inline-flex;align-items:center;min-height:25px;padding:5px 9px;border:1px solid color-mix(in srgb,var(--line) 82%,transparent);border-radius:999px;background:color-mix(in srgb,var(--surface3) 88%,transparent);color:var(--text2);font-size:8.5px;font-weight:800;letter-spacing:.045em;text-transform:uppercase;white-space:nowrap}.statusBadge.good{color:var(--green);background:color-mix(in srgb,var(--greenSoft) 76%,var(--surface));border-color:color-mix(in srgb,var(--green) 23%,var(--line))}.statusBadge.warn{color:var(--amber);background:color-mix(in srgb,var(--amberSoft) 76%,var(--surface));border-color:color-mix(in srgb,var(--amber) 25%,var(--line))}

/* Compact actions / segmented controls */
.quickGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:11px}.quick{appearance:none;min-height:106px;padding:16px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface2) 97%,var(--champ) 3%),var(--surface));color:var(--text);text-align:left;box-shadow:var(--shadow-md);transition:transform var(--normal) var(--ease),border-color var(--normal),box-shadow var(--normal)}.quick:hover{border-color:color-mix(in srgb,var(--champ) 20%,var(--line2));transform:translateY(-2px);box-shadow:0 17px 46px rgba(0,0,0,.22)}.quickIcon{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,color-mix(in srgb,var(--champ) 13%,var(--surface3)),var(--surface3));color:var(--champ);display:grid;place-items:center;font-size:16px;border:1px solid color-mix(in srgb,var(--champ) 15%,var(--line))}.quick b{display:block;margin:9px 0 4px;font-size:14px;font-weight:750}.quick span:not(.quickIcon){display:block;color:var(--muted);font-size:10px;line-height:1.45}.segSwitch{display:inline-flex;gap:3px;padding:4px;margin:0 0 15px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface) 95%,transparent)}.segSwitch button{appearance:none;min-height:36px;padding:0 15px;border:0;border-radius:10px;background:transparent;color:var(--muted);font-size:10px;font-weight:800;transition:background var(--fast),color var(--fast),transform var(--fast),box-shadow var(--fast)}.segSwitch button.active{background:linear-gradient(145deg,var(--surface3),color-mix(in srgb,var(--champ) 8%,var(--surface3)));color:var(--text);box-shadow:inset 0 0 0 1px var(--line),0 5px 16px rgba(0,0,0,.09)}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 13px}

/* Bottom navigation */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:35;display:flex;justify-content:center;padding:10px 12px calc(10px + env(safe-area-inset-bottom));pointer-events:none;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--bg) 83%,transparent) 28%,var(--bg) 100%)}.navInner{pointer-events:auto;width:min(700px,100%);display:grid;gap:4px;padding:5px;border:1px solid var(--line2);border-radius:22px;background:color-mix(in srgb,var(--surface) 89%,transparent);backdrop-filter:blur(26px) saturate(1.12);-webkit-backdrop-filter:blur(26px) saturate(1.12);box-shadow:0 18px 52px rgba(0,0,0,.30),0 1px 0 rgba(255,255,255,.035) inset}.navBtn{appearance:none;position:relative;overflow:hidden;min-height:55px;padding:7px 4px 6px;border:0;border-radius:16px;background:transparent;color:var(--muted);font-size:9px;font-weight:750;line-height:1.1;letter-spacing:.01em;transition:transform var(--fast) var(--ease),background var(--normal),color var(--normal)}.navBtn b{display:block;margin-bottom:5px;font-size:16px;line-height:1;font-weight:500;transition:transform var(--normal) var(--ease),color var(--normal)}.navBtn.active{background:linear-gradient(145deg,color-mix(in srgb,var(--champSoft) 90%,var(--surface2)),color-mix(in srgb,var(--champ) 4%,var(--surface)));color:var(--text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--champ) 20%,transparent)}.navBtn.active b{color:var(--champ);transform:translateY(-1px)}

/* Consistent vector navigation icons */
.navBtn b{width:19px;height:19px;margin:0 auto 5px;background:currentColor;font-size:0;line-height:0;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}
.navBtn[data-view="day"] b,.navBtn[data-view="employee"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5 12 4l9 7.5'/%3E%3Cpath d='M5.5 10.5V20h13v-9.5M9.5 20v-6h5v6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5 12 4l9 7.5'/%3E%3Cpath d='M5.5 10.5V20h13v-9.5M9.5 20v-6h5v6'/%3E%3C/svg%3E")}
.navBtn[data-view="sales"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-2-1.5L14 21l-2-1.5L10 21l-2-1.5L6 21z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-2-1.5L14 21l-2-1.5L10 21l-2-1.5L6 21z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E")}
.navBtn[data-view="analysis"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 18l5-6 4 3 7-9'/%3E%3Cpath d='M15 6h5v5'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 18l5-6 4 3 7-9'/%3E%3Cpath d='M15 6h5v5'/%3E%3C/svg%3E")}
.navBtn[data-view="team"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E")}
.navBtn[data-view="learning"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.25 3.75L17 8l-3.75 1.25L12 13l-1.25-3.75L7 8l3.75-1.25L12 3zM18.5 14l.75 2.25L21.5 17l-2.25.75L18.5 20l-.75-2.25L15.5 17l2.25-.75L18.5 14zM5.5 13l.6 1.9L8 15.5l-1.9.6L5.5 18l-.6-1.9L3 15.5l1.9-.6L5.5 13z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.25 3.75L17 8l-3.75 1.25L12 13l-1.25-3.75L7 8l3.75-1.25L12 3zM18.5 14l.75 2.25L21.5 17l-2.25.75L18.5 20l-.75-2.25L15.5 17l2.25-.75L18.5 14zM5.5 13l.6 1.9L8 15.5l-1.9.6L5.5 18l-.6-1.9L3 15.5l1.9-.6L5.5 13z'/%3E%3C/svg%3E")}
.navBtn[data-view="me"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 21a7.5 7.5 0 0 1 15 0'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 21a7.5 7.5 0 0 1 15 0'/%3E%3C/svg%3E")}
.navBtn[data-view="more"] b{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='5' cy='12' r='1.8'/%3E%3Ccircle cx='12' cy='12' r='1.8'/%3E%3Ccircle cx='19' cy='12' r='1.8'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='5' cy='12' r='1.8'/%3E%3Ccircle cx='12' cy='12' r='1.8'/%3E%3Ccircle cx='19' cy='12' r='1.8'/%3E%3C/svg%3E")}

/* Modal / sheet primitives shared by feature styles */
.insideModal{animation:veilIn .2s ease both}.insideSheet{animation:sheetIn .38s var(--ease) both}

/* Motion */
#content>.pageHead,#content>.todayHead,#content>.todayKpis,#content>.todayGrid,#content>.grid,#content>.quickGrid,#content>.academyHead,#content>.academyTabs,#content>#academyBody{animation:contentIn .34s var(--ease) both}.grid>.card,.todayKpis>article,.todayGrid>.todayCard,.academyGrid>.card,.academyGrid>.academyFeature{animation:cardIn .38s var(--ease) both}.grid>.card:nth-child(2),.todayKpis>article:nth-child(2){animation-delay:25ms}.grid>.card:nth-child(3),.todayKpis>article:nth-child(3){animation-delay:50ms}.grid>.card:nth-child(4),.todayKpis>article:nth-child(4){animation-delay:75ms}.grid>.card:nth-child(n+5){animation-delay:90ms}
@keyframes contentIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes cardIn{from{opacity:0;transform:translateY(9px) scale(.995)}to{opacity:1;transform:none}}@keyframes veilIn{from{opacity:0}to{opacity:1}}@keyframes sheetIn{from{opacity:0;transform:translateY(24px) scale(.985)}to{opacity:1;transform:none}}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* Light refinement */
:root[data-theme="light"] body{background:radial-gradient(900px 520px at 52% -330px,rgba(150,106,77,.065),transparent 72%),linear-gradient(180deg,#fbfaf7,var(--bg) 48%,#f0ece7)}
:root[data-theme="light"] .top{background:linear-gradient(180deg,rgba(250,248,244,.985),rgba(250,248,244,.93) 76%,transparent)}
:root[data-theme="light"] .navInner{background:rgba(255,254,250,.90);box-shadow:0 12px 34px rgba(66,50,39,.09),0 1px 0 rgba(255,255,255,.95) inset}
:root[data-theme="light"] .card,:root[data-theme="light"] .quick{background:linear-gradient(145deg,#fffefa,#fbf8f4)}
:root[data-theme="light"] .modeBtn.active{background:var(--surface);color:var(--champ2);border-color:color-mix(in srgb,var(--champ) 26%,var(--line));box-shadow:var(--shadow-sm)}

/* Tablet */
@media(max-width:1024px){.wrap{width:min(100% - 26px,1240px)}.brandArea{gap:14px}.brandStack img{width:116px}.title b{font-size:23px}.actions{gap:5px}.connector{max-width:118px;overflow:hidden;text-overflow:ellipsis}.miniSeg button{padding:0 7px}.modeBtn{padding:0 9px}.card{grid-column:span 6}.card.wide{grid-column:span 12}.card.quarter{grid-column:span 6}.quickGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Mobile — calibrated on Samsung/Android */
@media(max-width:700px){
  body{font-size:14px;background:radial-gradient(620px 380px at 50% -250px,var(--champGlow),transparent 72%),linear-gradient(180deg,var(--bg2),var(--bg) 42%)}
  :root[data-theme="light"] body{background:linear-gradient(180deg,#fbfaf7 0,#f4f1ec 44%,#f0ece7 100%)}
  .wrap{width:calc(100% - 22px);padding-top:calc(5px + env(safe-area-inset-top));padding-bottom:calc(94px + env(safe-area-inset-bottom))}
  .top{min-height:54px;gap:6px;padding:3px 0 8px}.top:after{bottom:3px;opacity:.26}.brandArea{gap:0;flex:0 1 auto}.brandStack{display:none}.title{padding-left:0}.title b{font-size:21px}.title span{font-size:7.5px;margin-top:3px;letter-spacing:.15em}.actions{gap:4px;margin-left:auto}.connector{display:none}
  .iconBtn,.profileBtn,.modeBtn{height:34px}.iconBtn,.profileBtn{width:34px}.modeBtn{padding:0 8px;font-size:8px;border-radius:11px;max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.modeBtn.active{background:var(--surface);color:var(--champ);border-color:color-mix(in srgb,var(--champ) 24%,var(--line));box-shadow:none}.miniSeg{padding:2px;border-radius:11px}.miniSeg button{height:27px;padding:0 7px;font-size:8px;border-radius:8px}
  .toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:7px 0 13px}.dateInput{width:100%;height:40px}.dateBtn{height:40px;padding:0 15px}.searchInput,.filterSelect{width:100%;min-width:0;height:40px}.filters{display:grid;grid-template-columns:1fr;width:100%}
  #shell:has(#toolbar:not(.hidden)) #content>.pageHead{display:none}
  .hero{padding:20px 18px;border-radius:21px}.hero h1{font-size:34px}.pageHead{margin:5px 0 12px}.pageHead h2{font-size:30px}.pageHead p{font-size:9.5px}
  .grid{gap:8px}.card,.card.half,.card.quarter{grid-column:span 12;padding:14px 15px;border-radius:18px;min-height:0}.card.wide{grid-column:span 12}.value{font-size:27px;margin-top:6px}.hint{margin-top:6px;font-size:10px}.sectionHead{margin-bottom:8px}.sectionHead h2{font-size:14px}.empty{padding:17px 7px;font-size:10.5px}.row{gap:10px;padding:10px 0}.row b{font-size:12px}.row span{font-size:9.5px}.money{font-size:12px}
  .quickGrid{grid-template-columns:1fr;gap:8px}.quick{min-height:86px;padding:14px}.segSwitch{display:grid;grid-auto-flow:column;width:100%}.segSwitch button{padding:0 9px}
  .nav{padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--bg) 72%,transparent) 34%,var(--bg) 100%)}.navInner{border-radius:18px;padding:3px 5px;gap:1px;border-color:var(--line);box-shadow:0 9px 28px rgba(0,0,0,.18),0 1px 0 rgba(255,255,255,.035) inset}.navBtn{min-height:47px;padding:5px 3px 6px;border-radius:12px;font-size:8.5px;overflow:visible}.navBtn b{width:18px;height:18px;margin-bottom:4px}.navBtn.active{background:transparent;box-shadow:none;color:var(--text)}.navBtn.active b{color:var(--champ);transform:translateY(-1px)}.navBtn.active:after{content:"";position:absolute;left:50%;bottom:2px;width:16px;height:2px;border-radius:99px;background:var(--champ);transform:translateX(-50%)}
  :root[data-theme="light"] .navInner{background:rgba(255,254,251,.94);box-shadow:0 8px 24px rgba(66,50,39,.075)}
}
@media(max-width:430px){.wrap{width:calc(100% - 18px)}.title b{font-size:20px}.modeBtn{max-width:84px}.miniSeg button{padding:0 6px}.pageHead h2{font-size:28px}.card{padding:13px 14px}.navBtn{font-size:8px}.profileBtn,.iconBtn{width:33px;height:33px}.modeBtn{height:33px}.navBtn b{width:17px;height:17px}}
@media(max-width:360px){.title b{font-size:19px}.actions{margin-left:auto}.miniSeg button{padding:0 5px}.modeBtn{max-width:72px}.wrap{width:calc(100% - 16px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}