:root{--ink: #141a17; --mut: #9aa09d; --mut2: #6f7773; --line: #e9ecea; --panel: #f4f5f4; --card: #fff; --g1: #0c4b2d; --g2: #1c7c4c; --g3: #2f9d68; --g4: #6fc79b; --gsoft: #e3f4ea; --gsoft2: #ecf8f1; --gline: #cfeadb; --btn1: #1d7d4d; --btn2: #0c4b2d; --h1: #1f8a57; --h2: #0f5c37; --h3: #0b4a2c; --htxt: #d3f0e1; --d1: #0f5d38; --d2: #062c19; --ink2: #3b4a44; --soft: #f6f8f7; --bd: #dfe4e1; --hatch: #f1f3f2; --hatchline: #9aa6a0; --track: #eef0ef; --chipbg: #eceeed; --shell: #fff; --glow: 111,199,155; --shadow: 12,75,45; --bg: #e4e6e5; --pos: #1c7c4c; --possoft: #e3f4ea; --red: #e5484d; --red-soft: #fdeceb; --amber: #c98a0b; --amber-soft: #fff3d6; --blue: #3b6ef5; --blue-soft: #e8eefe; --font: "Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;}
:root[data-theme="orange"]{--ink: #141414; --mut: #a3a19c; --mut2: #716f6a; --line: #ebe9e5; --panel: #f5f4f1; --bg: #ecebe8; --g1: #171717; --g2: #f26a21; --g3: #ff7f3f; --g4: #ffb48a; --gsoft: #fff0e6; --gsoft2: #fff6ef; --gline: #ffd9c2; --btn1: #2e2e2e; --btn2: #101010; --h1: #ff9150; --h2: #f26a21; --h3: #df4f0e; --htxt: #ffe6d4; --d1: #2d2d2d; --d2: #0d0d0d; --glow: 255,140,70; --shadow: 17,17,17; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="blue"]{--panel: #f3f5f8; --bg: #e4e8ee; --g1: #0f2a5c; --g2: #2563eb; --g3: #3b82f6; --g4: #93c5fd; --gsoft: #e6efff; --gsoft2: #f1f6ff; --gline: #cfe0ff; --btn1: #2f6df0; --btn2: #0f2a5c; --h1: #4f8bff; --h2: #2563eb; --h3: #1b3fa8; --htxt: #dbe8ff; --d1: #17356f; --d2: #08152f; --glow: 96,150,255; --shadow: 15,42,92; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="purple"]{--panel: #f6f4f8; --bg: #e9e6ee; --g1: #2b1458; --g2: #7c3aed; --g3: #8b5cf6; --g4: #c4b5fd; --gsoft: #f0eaff; --gsoft2: #f6f2ff; --gline: #ddd0ff; --btn1: #7c3aed; --btn2: #2b1458; --h1: #9b6cff; --h2: #7c3aed; --h3: #5b21b6; --htxt: #eadfff; --d1: #3a1c78; --d2: #150a2e; --glow: 167,139,250; --shadow: 43,20,88; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="rose"]{--panel: #f8f4f5; --bg: #eee6e9; --g1: #5a0f2b; --g2: #e11d62; --g3: #f43f7a; --g4: #fda4bf; --gsoft: #ffe9f0; --gsoft2: #fff3f7; --gline: #ffd0df; --btn1: #e11d62; --btn2: #5a0f2b; --h1: #fb4f86; --h2: #e11d62; --h3: #a3123f; --htxt: #ffe0ea; --d1: #6b1433; --d2: #2a0713; --glow: 251,113,155; --shadow: 90,15,43; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="teal"]{--panel: #f3f6f6; --bg: #e3e8e8; --g1: #0b3b3f; --g2: #0d9488; --g3: #14b8a6; --g4: #7fdcd0; --gsoft: #e0f7f4; --gsoft2: #effbf9; --gline: #c5eee8; --btn1: #0f9d8e; --btn2: #0b3b3f; --h1: #19b3a3; --h2: #0d9488; --h3: #0a6b63; --htxt: #d5f5f0; --d1: #0f4a4e; --d2: #05201f; --glow: 94,214,200; --shadow: 11,59,63; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="ocean"]{--panel: #f5f7f7; --bg: #e3e7e8; --g1: #082b3b; --g2: #0d719c; --g3: #129dd9; --g4: #6fc6ec; --gsoft: #dcf4fe; --gsoft2: #eef9ff; --gline: #c3e5f4; --btn1: #0f85b8; --btn2: #082b3b; --h1: #13a7e7; --h2: #0e7baa; --h3: #0a597b; --htxt: #d9f2fc; --d1: #0f3a4d; --d2: #08202b; --glow: 76,191,240; --shadow: 11,60,81; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="indigo"]{--panel: #f5f5f7; --bg: #e3e3e8; --g1: #131344; --g2: #242499; --g3: #3030cf; --g4: #9090df; --gsoft: #e0e0fa; --gsoft2: #f0f0fd; --gline: #cacaed; --btn1: #2a2ab2; --btn2: #131344; --h1: #3d3dd1; --h2: #2727a5; --h3: #1d1d7c; --htxt: #d9d9fc; --d1: #1c1c54; --d2: #0d0d26; --glow: 98,98,218; --shadow: 20,20,72; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="lavender"]{--panel: #f6f5f7; --bg: #e6e3e8; --g1: #341e43; --g2: #6a3a8d; --g3: #8d51b8; --g4: #c1a4d6; --gsoft: #efe4f6; --gsoft2: #f7f1fb; --gline: #ddcfe7; --btn1: #7b43a3; --btn2: #341e43; --h1: #945cbc; --h2: #733e98; --h3: #572f74; --htxt: #edd9fc; --d1: #412952; --d2: #1b1122; --glow: 165,117,199; --shadow: 49,29,63; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="magenta"]{--panel: #f7f5f6; --bg: #e8e3e6; --g1: #470f35; --g2: #a21a75; --g3: #db249e; --g4: #e689c7; --gsoft: #fcdff2; --gsoft2: #fdeff9; --gline: #f0c7e2; --btn1: #bd1f88; --btn2: #470f35; --h1: #dd31a4; --h2: #af1d7e; --h3: #84155f; --htxt: #fcd9f0; --d1: #581843; --d2: #280b1e; --glow: 228,88,181; --shadow: 76,16,56; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="cherry"]{--panel: #f7f5f5; --bg: #e8e3e3; --g1: #440e13; --g2: #a01825; --g3: #d92033; --g4: #e6848e; --gsoft: #fcdee1; --gsoft2: #feeff0; --gline: #f0c6ca; --btn1: #ba1c2c; --btn2: #440e13; --h1: #df2a3c; --h2: #ad1a29; --h3: #81131e; --htxt: #fcd9dd; --d1: #55161c; --d2: #290a0d; --glow: 230,86,101; --shadow: 76,15,21; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="coral"]{--panel: #f7f5f5; --bg: #e8e4e3; --g1: #4f1a0d; --g2: #ae3213; --g3: #e6461e; --g4: #ec9c89; --gsoft: #fde4dd; --gsoft2: #fef1ee; --gline: #f2cec4; --btn1: #ca3a16; --btn2: #4f1a0d; --h1: #e8512c; --h2: #bc3615; --h3: #8e2910; --htxt: #fce0d9; --d1: #602415; --d2: #2a1009; --glow: 236,112,81; --shadow: 79,26,13; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="copper"]{--panel: #f7f6f5; --bg: #e8e5e3; --g1: #362011; --g2: #894d24; --g3: #bd6a32; --g4: #d9a887; --gsoft: #f9ebe1; --gsoft2: #fcf5f0; --gline: #ecd8cb; --btn1: #a15a2b; --btn2: #362011; --h1: #c97136; --h2: #955328; --h3: #6d3d1d; --htxt: #fce7d9; --d1: #472c1a; --d2: #25170e; --glow: 214,147,102; --shadow: 70,41,22; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="gold"]{--panel: #f7f7f5; --bg: #e8e7e3; --g1: #251b04; --g2: #866109; --g3: #c58d0d; --g4: #ebbf56; --gsoft: #fff4dc; --gsoft2: #fffaed; --gline: #f4e5c2; --btn1: #a3750a; --btn2: #251b04; --h1: #d3980d; --h2: #956b09; --h3: #654806; --htxt: #fcf2d9; --d1: #382a0a; --d2: #2b2108; --glow: 243,192,73; --shadow: 82,60,10; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="olive"]{--panel: #f7f7f5; --bg: #e7e8e3; --g1: #181b09; --g2: #616b1f; --g3: #8f9e2e; --g4: #c1ce6e; --gsoft: #f6f9e2; --gsoft2: #fafcf0; --gline: #e7ebcc; --btn1: #768226; --btn2: #181b09; --h1: #9aaa31; --h2: #6b7722; --h3: #484f17; --htxt: #f7fcd9; --d1: #282c11; --d2: #22250e; --glow: 197,211,105; --shadow: 63,69,23; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="lime"]{--panel: #f6f7f5; --bg: #e5e8e3; --g1: #0c1406; --g2: #3d6619; --g3: #5d9b27; --g4: #95d062; --gsoft: #ecfae1; --gsoft2: #f6fcf0; --gline: #daecca; --btn1: #4c7e20; --btn2: #0c1406; --h1: #64a72a; --h2: #45721d; --h3: #2c4912; --htxt: #e9fcd9; --d1: #19260d; --d2: #19260d; --glow: 154,216,100; --shadow: 44,71,21; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="emerald"]{--panel: #f5f7f6; --bg: #e3e8e6; --g1: #072215; --g2: #147b4b; --g3: #1db46e; --g4: #64dea5; --gsoft: #dffcee; --gsoft2: #effdf7; --gline: #c7f0dd; --btn1: #18955b; --btn2: #072215; --h1: #1fc176; --h2: #168853; --h3: #0f5c38; --htxt: #d9fcec; --d1: #0e3422; --d2: #0b281a; --glow: 88,228,163; --shadow: 16,76,48; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="mint"]{--panel: #f5f7f7; --bg: #e3e8e7; --g1: #0d211c; --g2: #256f5e; --g3: #36a188; --g4: #7acdb9; --gsoft: #e2f8f3; --gsoft2: #f1fbf9; --gline: #cdeae3; --btn1: #2d8671; --btn2: #0d211c; --h1: #39ac91; --h2: #297a67; --h3: #1c5447; --htxt: #d9fcf4; --d1: #15322b; --d2: #0f241f; --glow: 110,207,184; --shadow: 25,67,57; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="forest"]{--panel: #f5f7f6; --bg: #e3e8e5; --g1: #0f2918; --g2: #267841; --g3: #36ab5d; --g4: #80d19b; --gsoft: #e2f8e9; --gsoft2: #f1fcf4; --gline: #ccead6; --btn1: #2d8f4e; --btn2: #0f2918; --h1: #3ab663; --h2: #2a8448; --h3: #1d5d33; --htxt: #d9fce5; --d1: #183a23; --d2: #0f2416; --glow: 108,208,141; --shadow: 24,67,39; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="aqua"]{--panel: #f5f7f7; --bg: #e3e8e8; --g1: #04191a; --g2: #0d7077; --g3: #14a8b3; --g4: #54dae3; --gsoft: #ddfbfd; --gsoft2: #eefdfe; --gline: #c4eff2; --btn1: #108a93; --btn2: #04191a; --h1: #15b5c1; --h2: #0f7d85; --h3: #0a5257; --htxt: #d9fafc; --d1: #0a2c2e; --d2: #09282a; --glow: 81,225,236; --shadow: 13,75,79; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="slate"]{--panel: #f5f6f7; --bg: #e3e5e8; --g1: #1f252d; --g2: #47576b; --g3: #627793; --g4: #a5b1c0; --gsoft: #e8ecf3; --gsoft2: #f3f6f9; --gline: #d6dbe1; --btn1: #54667d; --btn2: #1f252d; --h1: #697f9b; --h2: #4e5e74; --h3: #394556; --htxt: #d9e8fc; --d1: #2b323b; --d2: #15191e; --glow: 139,156,177; --shadow: 38,45,54; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="graphite"]{--panel: #f6f6f6; --bg: #e5e6e6; --g1: #252827; --g2: #565d5a; --g3: #767f7c; --g4: #b0b5b3; --gsoft: #ebf0ee; --gsoft2: #f5f7f6; --gline: #dadcdc; --btn1: #646d6a; --btn2: #252827; --h1: #7d8784; --h2: #5d6562; --h3: #454a48; --htxt: #d9fcf0; --d1: #313534; --d2: #191a1a; --glow: 154,162,159; --shadow: 44,48,46; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="mocha"]{--panel: #f7f6f5; --bg: #e8e5e3; --g1: #271c16; --g2: #6c4b37; --g3: #97694e; --g4: #c3a493; --gsoft: #f5ebe6; --gsoft2: #faf5f2; --gline: #e4d9d2; --btn1: #805942; --btn2: #271c16; --h1: #a27053; --h2: #76523d; --h3: #543a2b; --htxt: #fce6d9; --d1: #362820; --d2: #201813; --glow: 189,150,127; --shadow: 59,42,33; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="plum"]{--panel: #f7f5f7; --bg: #e8e3e8; --g1: #311630; --g2: #7b3279; --g3: #aa46a7; --g4: #ce92cc; --gsoft: #f6e4f6; --gsoft2: #fbf1fa; --gline: #e7cfe6; --btn1: #913b8e; --btn2: #311630; --h1: #b54ab1; --h2: #863783; --h3: #622860; --htxt: #fcd9fb; --d1: #412040; --d2: #221121; --glow: 199,117,196; --shadow: 63,29,62; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="navy"]{--panel: #f5f6f7; --bg: #e3e4e8; --g1: #0d1835; --g2: #1b398d; --g3: #2650c5; --g4: #7b96df; --gsoft: #dfe7fb; --gsoft2: #eff3fd; --gline: #c8d2ef; --btn1: #2044a7; --btn2: #0d1835; --h1: #2855d2; --h2: #1d3f9a; --h3: #152d6f; --htxt: #d9e3fc; --d1: #152247; --d2: #0c1327; --glow: 92,127,224; --shadow: 18,33,74; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-theme="peach"]{--panel: #f7f6f5; --bg: #e8e4e3; --g1: #441909; --g2: #a5360d; --g3: #e24a12; --g4: #ed9778; --gsoft: #fee5dc; --gsoft2: #fff2ee; --gline: #f4d0c3; --btn1: #c13f10; --btn2: #441909; --h1: #ec5018; --h2: #b33a0f; --h3: #842b0b; --htxt: #fce3d9; --d1: #562310; --d2: #2b1108; --glow: 240,120,76; --shadow: 81,30,11; --pos: #17a35a; --possoft: #e5f6ec;}
:root[data-mode="dark"]{color-scheme: dark; --ink: #eef2f0; --ink2: #c9d3ce; --mut: #8a948f; --mut2: #a7b0ab; --line: #2b3430; --panel: #171c1a; --bg: #0b0e0d; --shell: #111513; --card: #212825; --soft: #1c2220; --bd: #333c38; --hatch: #2c3531; --hatchline: #6d7a74; --track: #2c3531; --chipbg: #2f3733; --g1: var(--g4); --gsoft: color-mix(in srgb,var(--g3) 22%,transparent); --gsoft2: color-mix(in srgb,var(--g3) 14%,transparent); --gline: color-mix(in srgb,var(--g3) 40%,transparent); --possoft: rgba(23,163,90,.2); --red-soft: rgba(229,72,77,.2); --amber-soft: rgba(201,138,11,.22); --blue-soft: rgba(59,110,245,.22);}
:root[data-skin]{--card: rgba(255,255,255,.72); --panel: rgba(255,255,255,.5); --line: rgba(20,26,23,.08); --bd: rgba(20,26,23,.1); --soft: rgba(255,255,255,.55); --track: rgba(20,26,23,.07); --chipbg: rgba(20,26,23,.06); --ink: #17191a; --ink2: #3a3f40; --mut: #8e9293; --mut2: #686d6e; --g1: #1b1d1e; --g2: #8a6500; --btn1: #f6c744; --btn2: #1b1d1e; --h1: #2c2e2f; --h2: #1d1f20; --h3: #101112; --htxt: #f2eedf; --d1: #2c2e2f; --d2: #101112; --glow: 246,199,68; --shadow: 40,36,10; --hatch: rgba(20,26,23,.05); --hatchline: #b9a86a;}
:root[data-skin="soft"]{--bg: #e8e7ea; --shell: linear-gradient(135deg,#ececf0 0%,#f5f2e6 52%,#f7e8a0 100%); --g3: #f6c744; --g4: #f6c744; --gsoft: #fff1bd; --gsoft2: #fff8dc; --gline: #f1de98;}
:root[data-skin][data-mode="dark"]{--card: rgba(40,40,46,.66); --panel: rgba(30,30,34,.55); --line: rgba(255,255,255,.08); --bd: rgba(255,255,255,.12); --soft: rgba(255,255,255,.06); --track: rgba(255,255,255,.1); --chipbg: rgba(255,255,255,.1); --ink: #f3f1ea; --ink2: #d6d4cc; --mut: #9a9a96; --mut2: #b3b2ac; --g1: #f6c744; --g2: #f6c744; --bg: #0d0d0f; --h1: #3a3b3d; --h2: #2a2b2d; --h3: #1b1c1d; --d1: #3a3b3d; --d2: #1b1c1d;}
:root[data-skin="soft"][data-mode="dark"]{--shell: linear-gradient(135deg,#17181b 0%,#1d1c18 55%,#3b3411 100%); --gsoft: rgba(246,199,68,.2); --gsoft2: rgba(246,199,68,.12); --gline: rgba(246,199,68,.35);}
:root[data-skin] .shell{border-radius: 36px; box-shadow: rgba(30, 26, 5, 0.14) 0px 24px 70px;}
:root[data-skin] .side{border-radius: 30px; backdrop-filter: blur(16px);}
:root[data-skin] :is(.kpi, .card, .panel, .apanel, .sc, .coach, .aichat, .today > div){border-radius: 28px; box-shadow: rgba(255, 255, 255, 0.6) 0px 1px 0px inset, rgba(30, 26, 5, 0.05) 0px 8px 24px;}
:root[data-skin] .today > div{border-radius: 20px;}
:root[data-skin] .nav{border-radius: 999px; transition: background 0.25s, color 0.25s, transform 0.2s;}
:root[data-skin] .nav.on{background: rgb(27, 29, 30); color: rgb(255, 255, 255);}
:root[data-skin] .nav.on svg{color: rgb(246, 199, 68);}
:root[data-skin] .nav.on::before{display: none;}
:root[data-skin][data-mode="dark"] .nav.on{background: rgba(255, 255, 255, 0.14);}
:root[data-skin] :is(.btn.p, .btn.primary){color: rgb(23, 25, 26);}
:root[data-skin] :is(.pill, .rb, .gsearch){background: rgba(255, 255, 255, 0.7);}
:root[data-skin][data-mode="dark"] :is(.pill, .rb, .gsearch){background: rgba(255, 255, 255, 0.1);}
:root[data-skin] .bar,:root[data-skin] .dline{border-radius: 999px;}
:root[data-skin] :is(.appop, .upop, .dlg, .auth .box, dialog){--card: #fff; backdrop-filter: none;}
:root[data-skin][data-mode="dark"] :is(.appop, .upop, .dlg, .auth .box, dialog){--card: #26262b;}
:root[data-skin="night"],:root[data-skin="night"][data-mode="dark"]{--bg: #0c0c0e; --shell: linear-gradient(160deg,#1b1b1f 0%,#121214 100%); --card: rgba(34,34,39,.92); --panel: rgba(26,26,30,.9); --g3: #f2d34f; --g4: #f2d34f; --gsoft: rgba(242,211,79,.18); --gsoft2: rgba(242,211,79,.1); --gline: rgba(242,211,79,.35); --h1: #f7e27f; --h2: #f1d34e; --h3: #d9b52b; --htxt: #2a2410; --lvtx: #1c1a10; --pos: #5ee0a0; --blue: #9a8cf8;}
:root[data-skin="night"] .shell{box-shadow: rgba(0, 0, 0, 0.5) 0px 24px 70px;}
:root[data-skin="night"] .nav.on svg{color: rgb(242, 211, 79);}
:root[data-skin="violet"],:root[data-skin="violet"][data-mode="dark"]{--bg: #0a0618; --shell: radial-gradient(90% 60% at 85% 0%,rgba(124,58,237,.28),transparent 60%),linear-gradient(160deg,#160b33 0%,#0c0620 100%); --card: rgba(30,20,62,.72); --panel: rgba(22,14,48,.72); --line: rgba(167,139,250,.14); --bd: rgba(167,139,250,.24); --soft: rgba(167,139,250,.09); --track: rgba(167,139,250,.16); --chipbg: rgba(167,139,250,.14); --ink: #f5f2ff; --ink2: #d8d0f6; --mut: #9a8fc6; --mut2: #b7aedc; --g1: #c4b5fd; --g2: #a78bfa; --g3: #8b5cf6; --g4: #c4b5fd; --gsoft: rgba(139,92,246,.22); --gsoft2: rgba(139,92,246,.12); --gline: rgba(139,92,246,.42); --btn1: #8b5cf6; --btn2: #5b21b6; --h1: #8b5cf6; --h2: #6d28d9; --h3: #4c1d95; --htxt: #fff; --lvtx: #fff; --d1: #8b5cf6; --d2: #4c1d95; --glow: 139,92,246; --shadow: 80,40,200; --pos: #4ade80; --red: #fb7185; --blue: #818cf8; --amber: #fbbf24;}
:root[data-skin="violet"] .shell{box-shadow: rgba(88, 40, 220, 0.35) 0px 24px 80px;}
:root[data-skin="violet"] :is(.kpi, .card, .panel, .apanel, .sc, .coach, .aichat, .today > div){border: 1px solid rgba(167, 139, 250, 0.16); box-shadow: rgba(255, 255, 255, 0.05) 0px 1px 0px inset, rgba(10, 4, 40, 0.45) 0px 10px 30px;}
:root[data-skin="violet"] .nav.on{background: linear-gradient(135deg, rgba(139, 92, 246, 0.55), rgba(91, 33, 182, 0.55)); color: rgb(255, 255, 255); box-shadow: rgba(167, 139, 250, 0.4) 0px 0px 0px 1px inset, rgba(88, 40, 220, 0.35) 0px 6px 18px;}
:root[data-skin="violet"] .nav.on svg{color: rgb(233, 221, 255);}
:root[data-skin="violet"] :is(.btn.p, .btn.primary, .dplus){color: rgb(255, 255, 255); box-shadow: rgba(139, 92, 246, 0.7) 0px 8px 22px -6px; background: linear-gradient(135deg, rgb(139, 92, 246), rgb(109, 40, 217)) !important;}
:root[data-skin="violet"] :is(.pill, .rb, .gsearch){background: rgba(167, 139, 250, 0.1); border-color: rgba(167, 139, 250, 0.2);}
:root[data-skin="violet"] :is(.appop, .upop, .dlg, .auth .box, dialog){--card: #1b1140;}
:root[data-skin="airy"],:root[data-skin="airy"][data-mode="dark"]{color-scheme: light; --bg: #eef1f6; --shell: linear-gradient(180deg,#f8fafc 0%,#f1f4f9 100%); --card: #ffffff; --panel: #f6f8fb; --line: #e9edf4; --bd: #e2e7ef; --soft: #f3f6fa; --track: #e8edf4; --chipbg: #eef2f7; --ink: #131a24; --ink2: #394353; --mut: #8a94a4; --mut2: #667085; --g1: #168a4d; --g2: #1f9d57; --g3: #34c77b; --g4: #86e0b0; --gsoft: #e5f7ed; --gsoft2: #f0fbf5; --gline: #c4ecd5; --btn1: #27ae68; --btn2: #168a4d; --h1: #e9f9f0; --h2: #f3fbf7; --h3: #ffffff; --htxt: #131a24; --lvtx: #131a24; --d1: #e9f9f0; --d2: #ffffff; --glow: 52,199,123; --shadow: 30,50,90; --pos: #1f9d57; --red: #e5484d; --blue: #6f5af6; --amber: #f5a524;}
:root[data-skin="airy"] .shell{box-shadow: rgba(30, 50, 90, 0.12) 0px 20px 60px;}
:root[data-skin="airy"] :is(.kpi, .card, .panel, .apanel, .sc, .coach, .aichat, .today > div){background: rgb(255, 255, 255); border: 1px solid rgb(237, 240, 246); border-radius: 24px; backdrop-filter: none; box-shadow: rgba(30, 50, 90, 0.06) 0px 10px 28px;}
:root[data-skin="airy"] .nav{border-radius: 14px;}
:root[data-skin="airy"] .nav.on{background: rgb(229, 247, 237); color: rgb(22, 138, 77); box-shadow: none;}
:root[data-skin="airy"] .nav.on svg{color: rgb(31, 157, 87);}
:root[data-skin="airy"] :is(.btn.p, .btn.primary, .dplus){color: rgb(255, 255, 255); box-shadow: rgba(31, 157, 87, 0.6) 0px 8px 20px -8px; background: linear-gradient(135deg, rgb(52, 199, 123), rgb(31, 157, 87)) !important;}
:root[data-skin="airy"] :is(.pill, .rb, .gsearch){background: rgb(255, 255, 255); border: 1px solid rgb(230, 234, 241);}
:root[data-skin="airy"] :is(.appop, .upop, .dlg, .auth .box, dialog){--card: #fff;}
html[data-dash="airy"] #view-dash > :not(.airy){display: none !important;}
:root[data-skin="kova"],:root[data-skin="kova"][data-mode="dark"]{color-scheme: light; --bg: #e4e4e1; --shell: #ecece9; --card: #ffffff; --panel: #ffffff; --line: #ebebe8; --bd: #e3e3df; --soft: #f1f1ee; --track: #ececE8; --chipbg: #f1f1ee; --ink: #111111; --ink2: #3a3a3a; --mut: #8d8d88; --mut2: #6b6b66; --g1: #d84a17; --g2: #ee5a24; --g3: #ee5a24; --g4: #ee5a24; --gsoft: #f1f1ee; --gsoft2: #fafaf8; --gline: #e8e8e4; --btn1: #ee5a24; --btn2: #d84a17; --h1: #f1f1ee; --h2: #fafaf8; --h3: #fff; --htxt: #111111; --lvtx: #111111; --d1: #f1f1ee; --d2: #fff; --glow: 238,90,36; --shadow: 30,30,20; --pos: #1f9d57; --red: #e5484d; --blue: #6f5af6; --amber: #f5a524;}
:root[data-skin="glass"],:root[data-skin="glass"][data-mode="dark"]{color-scheme: light; --bg: #ececea; --shell: linear-gradient(140deg,#eeeeee 0%,#f6efc4 55%,#fbe27a 100%); --card: rgba(255,255,255,.72); --panel: rgba(255,255,255,.55); --line: #ebebe8; --bd: #e3e3df; --soft: rgba(255,255,255,.7); --track: #ececE8; --chipbg: rgba(255,255,255,.7); --ink: #1d1d1d; --ink2: #3a3a3a; --mut: #8d8d88; --mut2: #6b6b66; --g1: #b88f00; --g2: #e8b800; --g3: #e8b800; --g4: #e8b800; --gsoft: rgba(255,255,255,.7); --gsoft2: #fafaf8; --gline: #e8e8e4; --btn1: #e8b800; --btn2: #b88f00; --h1: rgba(255,255,255,.7); --h2: #fafaf8; --h3: #fff; --htxt: #1d1d1d; --lvtx: #1d1d1d; --d1: rgba(255,255,255,.7); --d2: #fff; --glow: 251,212,76; --shadow: 30,30,20; --pos: #1f9d57; --red: #e5484d; --blue: #6f5af6; --amber: #f5a524;}
:root[data-skin="coral"],:root[data-skin="coral"][data-mode="dark"]{color-scheme: light; --bg: #e6e6e4; --shell: #f6f6f4; --card: #ffffff; --panel: #fbfbf9; --line: #ebebe8; --bd: #e3e3df; --soft: #f3f3f0; --track: #ececE8; --chipbg: #f3f3f0; --ink: #151515; --ink2: #3a3a3a; --mut: #8d8d88; --mut2: #6b6b66; --g1: #d2512a; --g2: #e8643a; --g3: #e8643a; --g4: #e8643a; --gsoft: #f3f3f0; --gsoft2: #fafaf8; --gline: #e8e8e4; --btn1: #e8643a; --btn2: #d2512a; --h1: #f3f3f0; --h2: #fafaf8; --h3: #fff; --htxt: #151515; --lvtx: #151515; --d1: #f3f3f0; --d2: #fff; --glow: 232,100,58; --shadow: 30,30,20; --pos: #1f9d57; --red: #e5484d; --blue: #6f5af6; --amber: #f5a524;}
:root[data-skin="kova"] .shell{border-radius: 34px; box-shadow: rgba(0, 0, 0, 0.08) 0px 18px 50px;}
@media (min-width: 641px){
:root[data-skin="coral"] .shell{border-radius: 36px; box-shadow: rgba(0, 0, 0, 0.08) 0px 18px 50px; grid-template-columns: 78px minmax(0px, 1fr);}
}
:root[data-skin="glass"] .shell{border-radius: 38px; box-shadow: rgba(120, 100, 0, 0.2) 0px 24px 70px;}
@media (max-width: 640px){
:root:is([data-skin="coral"], [data-skin="kova"], [data-skin="glass"]) .side .nav{min-width: 0px; overflow: hidden;}
:root:is([data-skin="coral"], [data-skin="kova"], [data-skin="glass"]) .side .nav span{display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; text-align: center;}
}
@media (min-width: 641px){
:root[data-skin="coral"] .side{padding: 14px 8px; align-items: center; border-radius: 30px; background: rgb(255, 255, 255);}
:root[data-skin="coral"] .side :is(.brand b, .sec, .nav span, .ngh span, .ngc, .sidetools .lbl, .menu-label){display: none !important;}
:root[data-skin="coral"] .nav,:root[data-skin="coral"] .ngh{width: 44px; height: 44px; padding: 0px; justify-content: center; border-radius: 50%;}
:root[data-skin="coral"] .nav.on{background: rgb(17, 17, 17); color: rgb(255, 255, 255);}
:root[data-skin="coral"] .nav.on{background: rgb(232, 100, 58);}
}
:root[data-skin="glass"] .side{background: rgba(255, 255, 255, 0.6); border-radius: 30px;}
:root[data-skin="glass"] .nav.on{background: rgb(43, 43, 43); color: rgb(255, 255, 255); border-radius: 999px;}
:root:is([data-skin="kova"], [data-skin="coral"], [data-skin="glass"]) :is(.kpi, .card, .panel, .apanel, .sc, .coach, .aichat, .today > div){border: 0px; border-radius: 26px; box-shadow: none;}
:root[data-skin="glass"] :is(.kpi, .card, .panel, .apanel, .sc, .coach, .aichat, .today > div){border: 1px solid rgba(255, 255, 255, 0.7);}
:root:is([data-skin="kova"], [data-skin="coral"], [data-skin="glass"]) :is(.btn.p, .btn.primary, .dplus){color: rgb(255, 255, 255); box-shadow: none; background: rgb(17, 17, 17) !important; border-color: rgb(17, 17, 17) !important;}
:root[data-skin="coral"] :is(.btn.p, .btn.primary, .dplus){background: rgb(232, 100, 58) !important; border-color: rgb(232, 100, 58) !important;}
:root[data-skin="kova"] :is(.btn.p, .btn.primary, .dplus){background: rgb(238, 90, 36) !important; border-color: rgb(238, 90, 36) !important;}
:root:is([data-skin="kova"], [data-skin="coral"], [data-skin="glass"]) :is(.pill, .rb, .gsearch, input, select, textarea){border-radius: 999px; background: rgb(241, 241, 238);}
:root:is([data-skin="kova"], [data-skin="coral"], [data-skin="glass"]) textarea{border-radius: 18px;}
:root:is([data-skin="kova"], [data-skin="coral"], [data-skin="glass"]) :is(.tbl, table) th{text-transform: none; font-weight: 500; color: var(--mut);}
:root:is([data-skin="kova"], [data-skin="coral"], [data-skin="glass"]) :is(.tbl, table) tr:nth-child(2n) td{background: rgba(0, 0, 0, 0.02);}
html:is([data-dash="kova"], [data-dash="glass"], [data-dash="coral"]) #view-dash > :not(.thm){display: none !important;}
@media (min-width: 641px){
:root:is([data-skin="glass"], [data-skin="kova"]) .shell{grid-template-columns: minmax(0px, 1fr) !important; grid-template-rows: auto minmax(0px, 1fr);}
:root:is([data-skin="glass"], [data-skin="kova"]) .side{position: static; height: auto; flex-flow: row; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 999px; overflow: visible; margin: 0px auto; max-width: 100%;}
:root:is([data-skin="glass"], [data-skin="kova"]) .side :is(.sec, .sep, .menu-label, .sidetools .sigw){display: none !important;}
:root:is([data-skin="glass"], [data-skin="kova"]) .brand{padding: 0px 12px 0px 4px; flex: 0 0 auto;}
:root:is([data-skin="glass"], [data-skin="kova"]) .brand b{font-size: 15px; white-space: nowrap;}
:root:is([data-skin="glass"], [data-skin="kova"]) #menuMain{display: flex; flex-direction: row; gap: 2px; align-items: center; background: rgba(255, 255, 255, 0.6); border-radius: 999px; padding: 4px;}
:root:is([data-skin="glass"], [data-skin="kova"]) .nav,:root:is([data-skin="glass"], [data-skin="kova"]) .ngh{width: auto; height: 38px; padding: 0px 14px; border-radius: 999px; white-space: nowrap; gap: 7px; font-size: 13px;}
:root:is([data-skin="glass"], [data-skin="kova"]) .nav .i,:root:is([data-skin="glass"], [data-skin="kova"]) .ngh > .i:first-child{display: none;}
:root:is([data-skin="glass"], [data-skin="kova"]) .nav b{margin-left: 4px;}
:root:is([data-skin="glass"], [data-skin="kova"]) .ng{position: relative; width: auto;}
:root:is([data-skin="glass"], [data-skin="kova"]) .ngb{position: absolute; top: calc(100% + 8px); left: 0px; z-index: 60; background: rgb(255, 255, 255); border-radius: 22px; padding: 8px; min-width: 230px; box-shadow: rgba(0, 0, 0, 0.18) 0px 18px 50px;}
:root:is([data-skin="glass"], [data-skin="kova"]) .ngb .nav{width: 100%; justify-content: flex-start;}
:root:is([data-skin="glass"], [data-skin="kova"]) .sidetools{display: flex; flex-direction: row; gap: 6px; margin-left: auto; align-items: center;}
:root:is([data-skin="glass"], [data-skin="kova"]) .brand b{display: none;}
:root:is([data-skin="glass"], [data-skin="kova"]) .brand{padding: 0px 6px 0px 2px;}
:root:is([data-skin="glass"], [data-skin="kova"]) .nav,:root:is([data-skin="glass"], [data-skin="kova"]) .ngh{padding: 0px 10px; font-size: 12.5px;}
:root:is([data-skin="glass"], [data-skin="kova"]) .side{overflow: auto visible;}
:root:is([data-skin="glass"], [data-skin="kova"]) .nrow{margin-left: auto; gap: 2px;}
}
:root[data-skin="glass"],:root[data-skin="glass"][data-mode="dark"]{--g1: #2b2b2b; --g2: #2b2b2b; --g3: #fbd44c; --g4: #fde58a; --gsoft: rgba(251,212,76,.38); --gsoft2: rgba(255,255,255,.6); --gline: rgba(43,43,43,.14); --btn1: #2b2b2b; --btn2: #111; --h1: rgba(251,212,76,.3);}
:root[data-skin="glass"] :is(.asum, .dsum, .ctsum, .psum, .tsum, .bsum) > *{background: rgba(255, 255, 255, 0.7) !important; border: 1px solid rgba(255, 255, 255, 0.85) !important; box-shadow: none !important;}
:root[data-skin="glass"] :is(.tab.on, .chip.on, .pill.on, .seg .on, [class*="tab"].on, [class*="chip"].on){background: rgb(43, 43, 43) !important; color: rgb(255, 255, 255) !important; border-color: rgb(43, 43, 43) !important;}
:root[data-skin="glass"] :is(h1, h2){font-weight: 400; letter-spacing: -0.8px;}
:root[data-skin="glass"] .btn:not(.p):not(.primary){border-color: rgb(43, 43, 43); color: rgb(43, 43, 43); background: transparent;}
:root[data-skin="kova"] :is(.tab.on, .chip.on, .pill.on, .seg .on, [class*="tab"].on, [class*="chip"].on){background: rgb(17, 17, 17) !important; color: rgb(255, 255, 255) !important; border-color: rgb(17, 17, 17) !important;}
:root[data-skin="coral"] :is(.tab.on, .chip.on, .pill.on, .seg .on, [class*="tab"].on, [class*="chip"].on){background: rgb(232, 100, 58) !important; color: rgb(255, 255, 255) !important; border-color: rgb(232, 100, 58) !important;}
:root[data-skin="kova"] :is(h1, h2),:root[data-skin="coral"] :is(h1, h2){font-weight: 600; letter-spacing: -0.8px;}
:root[data-skin="kova"] .side{background: rgb(255, 255, 255); backdrop-filter: none;}
@media (min-width: 641px){
:root[data-skin="kova"] .nav.on{background: rgb(17, 17, 17); color: rgb(255, 255, 255);}
:root[data-skin="coral"] header.top{gap: 10px; align-items: center;}
:root[data-skin="coral"] header.top::before{content: "CloudBasket 360"; order: 1; font-weight: 700; font-size: 15px; white-space: nowrap; margin-right: 10px;}
:root[data-skin="coral"] header.top #btnMenu{order: 0; width: 46px; height: 46px; border-radius: 50%; background: rgb(255, 255, 255); border: 0px;}
:root[data-skin="coral"] header.top .rb,:root[data-skin="coral"] header.top .pill{background: rgb(255, 255, 255); border: 0px; border-radius: 50%; min-width: 44px; height: 44px; justify-content: center;}
:root[data-skin="coral"] .side :is(.sup, .gtx, .side-ai .aitx2, .side-ai .lvh){display: none !important;}
:root[data-skin="coral"] header.top > *{order: 10;}
:root[data-skin="coral"] header.top > #btnMenu{order: 0;}
:root[data-skin="coral"] header.top .gsearch{background: rgb(255, 255, 255); border-radius: 999px; height: 44px; min-width: 230px; order: 30;}
:root[data-skin="coral"] header.top .topmonth{order: 2;}
:root[data-skin="coral"] header.top .sp{flex: 1 1 0%; order: 3;}
}
:root:is([data-skin="kova"], [data-skin="glass"], [data-skin="coral"]) *{backdrop-filter: none !important;}
:root:is([data-skin="kova"], [data-skin="glass"], [data-skin="coral"]) :is(.thm *, .card, .kpi, .panel){transition: none;}
.asum{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 10px; margin-bottom: 10px;}
.asum > div{border-radius: 20px; padding: 14px 16px; min-width: 0px;}
.asum small{font-size: 12px; font-weight: 600; color: var(--mut2);}
.asum b{display: block; font-size: 20px; font-weight: 700; letter-spacing: -0.4px; margin: 2px 0px;}
.asum .sb{font-size: 11px; color: var(--mut2);}
.asum .a1{background: var(--blue-soft);}
.asum .a2{background: var(--gsoft);}
.asum .a3{background: var(--red-soft);}
.asum .a4{background: var(--possoft);}
.anet{display: flex; gap: 14px; align-items: center; flex-wrap: wrap; background: var(--card); border-radius: 20px; padding: 12px 16px; margin-bottom: 10px;}
.anet b{font-size: 22px; letter-spacing: -0.5px;}
.anet small{color: var(--mut2); font-size: 12px; flex: 1 1 0%; min-width: 200px; line-height: 1.45;}
.atabs{display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0px 12px;}
.atabs button{height: 32px; padding: 0px 14px; border-radius: 99px; border: 1px solid var(--bd); background: var(--card); color: var(--ink2); font-size: 12.5px; font-weight: 600;}
.atabs button.on{background: var(--g2); border-color: var(--g2); color: rgb(255, 255, 255);}
.alist{display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 12px;}
.asc{background: var(--card); border-radius: 22px; overflow: hidden; display: flex; flex-direction: column; min-width: 0px;}
.asp{position: relative; height: 128px; display: grid; place-items: center; color: rgb(255, 255, 255); background: linear-gradient(135deg,var(--c1,#1f8a57),var(--c2,#0b4a2c)); overflow: hidden;}
.asp > svg{width: 44px; height: 44px; opacity: 0.9;}
.asp img.ph{width: 100%; height: 100%; object-fit: cover; display: block;}
.asp .tag{position: absolute; left: 10px; top: 10px; background: rgba(255, 255, 255, 0.92); color: rgb(23, 25, 26); font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 99px; display: inline-flex; gap: 5px; align-items: center;}
.asp .tag svg{width: 12px; height: 12px;}
.asb{padding: 12px 14px; display: grid; gap: 8px; flex: 1 1 0%;}
.asb h3{margin: 0px; font-size: 15.5px; font-weight: 700;}
.asb .ow{font-size: 12px; color: var(--mut2); margin-top: -5px;}
.asv{background: var(--gsoft2); border-radius: 14px; padding: 9px 12px; position: relative;}
.asv small{font-size: 10.5px; font-weight: 700; color: var(--mut2); letter-spacing: 0.3px;}
.asv b{display: block; font-size: 21px; font-weight: 700; letter-spacing: -0.4px; color: var(--g2);}
.asv em{position: absolute; right: 10px; top: 9px; font-style: normal; font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 99px; background: var(--amber-soft); color: rgb(169, 111, 0);}
.asr{display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--mut2);}
.asr b{color: var(--ink); font-weight: 600;}
.asr .up{color: var(--pos); font-weight: 600;}
.asr .dn{color: var(--red); font-weight: 600;}
.asl{font-size: 11.5px; color: var(--mut2); display: flex; gap: 6px; align-items: center;}
.asl svg{width: 13px; height: 13px; flex: 0 0 auto;}
.asl a{color: var(--g2); font-weight: 600; text-decoration: none; margin-left: auto; white-space: nowrap;}
.asf{display: flex; gap: 6px; margin-top: auto;}
.asf .uv{flex: 1 1 0%; height: 36px; border-radius: 12px; border: 0px; background: var(--gsoft); color: var(--g2); font-weight: 700; font-size: 12.5px;}
.asf .ib{flex: 0 0 auto;}
.ashist{border-top: 1px dashed var(--line); padding-top: 6px; display: grid; gap: 3px; font-size: 11.5px; color: var(--mut2);}
.ashist div{display: flex; justify-content: space-between;}
@media (max-width: 1000px){
.asum{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
.wchip{display: inline-block; margin-left: 8px; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--gsoft); color: var(--g2); vertical-align: middle;}
.pav{border-radius: 50%; object-fit: cover; display: inline-grid; place-items: center; color: rgb(255, 255, 255); font-weight: 700; flex: 0 0 auto;}
.pprof{display: flex; align-items: center; gap: 16px; background: var(--card); border-radius: 22px; padding: 16px 20px; margin-bottom: 10px; flex-wrap: wrap;}
.pprof .big{box-shadow: 0 0 0 3px var(--g3);}
.pprof .tx{flex: 1 1 0%; min-width: 180px;}
.pprof small{color: var(--mut2); font-size: 12.5px;}
.pprof h2{margin: 0px; font-size: 26px; letter-spacing: -0.4px;}
.pstrip{display: flex; gap: 12px; align-items: center;}
.pstrip button{border: 0px; background: none; display: grid; justify-items: center; gap: 3px; font-size: 11px; font-weight: 600; color: var(--mut2); padding: 0px;}
.pstrip button.on .pav{box-shadow: 0 0 0 3px var(--g3);}
.pstrip .plus{width: 40px; height: 40px; border-radius: 50%; border: 1.5px dashed var(--bd); display: grid; place-items: center; color: var(--mut2);}
.pstrip .plus svg{width: 16px; height: 16px;}
.pgrid{display: grid; grid-template-columns: 1.2fr 1.1fr 0.9fr; gap: 10px; margin-bottom: 10px;}
.pcard{background: var(--card); border-radius: 22px; padding: 14px 16px; min-width: 0px;}
.pcard h3{margin: 0px; font-size: 15px;}
.pcard .sub{font-size: 12px; color: var(--mut2); margin: 1px 0px 8px;}
.pact{display: flex; align-items: center; gap: 10px; padding: 7px 0px; border-top: 1px solid var(--line);}
.pact:first-of-type{border-top: 0px;}
.pact .bd{width: 34px; height: 34px; border-radius: 11px; background: var(--gsoft); color: var(--g2); display: grid; place-items: center; font-weight: 700; font-size: 13px; flex: 0 0 auto;}
.pact .tx{flex: 1 1 0%; min-width: 0px;}
.pact b{display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.pact small{color: var(--mut2); font-size: 11px;}
.pact .v{font-weight: 700; font-size: 13px; white-space: nowrap;}
.pgl{margin: 8px 0px;}
.pgl .r{display: flex; justify-content: space-between; font-size: 12.5px; font-weight: 600;}
.pgl .tr{height: 7px; border-radius: 99px; background: var(--track); margin: 5px 0px 3px; overflow: hidden;}
.pgl .tr i{display: block; height: 100%; background: var(--g3); border-radius: 99px;}
.pgl small{font-size: 11px; color: var(--mut2);}
.pstack{display: flex;}
.pstack .pav{margin-right: -8px; box-shadow: 0 0 0 2px var(--card);}
.pdet{background: var(--card); border-radius: 22px; padding: 16px 18px; display: grid; gap: 12px;}
.pdh{display: flex; align-items: center; gap: 12px; flex-wrap: wrap;}
.pdh .t{flex: 1 1 0%; min-width: 120px;}
.pdh .t b{font-size: 16px; display: block;}
.pdh .t small{color: var(--mut2);}
.pdn{display: flex; gap: 22px; flex-wrap: wrap;}
.pdn div{text-align: right;}
.pdn small{display: block; font-size: 10px; font-weight: 700; color: var(--mut2); letter-spacing: 0.4px;}
.pdn b{font-size: 17px;}
.pcols{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px;}
.pcols h4{margin: 0px 0px 6px; font-size: 13px;}
.pcols h4 span{font-weight: 400; color: var(--mut2);}
.pcols .row{display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; padding: 6px 0px; border-bottom: 1px solid var(--line);}
.pcols .row:last-child{border: 0px;}
.pcols .em{font-size: 12.5px; color: var(--mut2);}
.ppos{color: var(--pos);}
.pneg{color: var(--red);}
.ptool{display: flex; gap: 8px; align-items: center; flex-wrap: wrap;}
.ptool select{height: 38px; border: 1px solid var(--bd); border-radius: 12px; background: var(--card); color: var(--ink); padding: 0px 10px; font-size: 13px;}
.pseg{display: flex; border: 1px solid var(--bd); border-radius: 12px; overflow: hidden; background: var(--card);}
.pseg button{height: 36px; padding: 0px 14px; border: 0px; background: none; color: var(--ink2); font-weight: 600; font-size: 12.5px;}
.pseg button.on{background: var(--g2); color: rgb(255, 255, 255);}
.ptab{width: 100%; border-collapse: collapse;}
.ptab th{font-size: 11px; color: var(--mut2); text-align: right; padding: 6px 8px; font-weight: 700;}
.ptab th:first-child,.ptab td:first-child{text-align: left;}
.ptab td{padding: 10px 8px; text-align: right; border-top: 1px solid var(--line); font-size: 13px; font-weight: 600;}
.ptab td:first-child{display: flex; gap: 10px; align-items: center;}
@media (max-width: 1000px){
.pgrid{grid-template-columns: 1fr;}
.pcols{grid-template-columns: 1fr;}
}
#insDlg{border: 0px; border-radius: 22px; padding: 0px; width: min(560px, -24px + 100vw); max-height: calc(100dvh - 24px); background: var(--card); color: var(--ink);}
#insDlg::backdrop{background: rgba(0, 0, 0, 0.45);}
#insDlg .dlg{max-height: calc(100dvh - 24px); overflow: auto;}
.ctl{display: grid; gap: 8px;}
#dlg{width: min(640px, -24px + 100vw);}
#dlg .dlg{max-height: calc(100dvh - 24px); overflow: auto;}
#dlg .row2:has(#nAcc){grid-template-columns: 1fr;}
#dlg .row2:has(#nAcc):has(#toWrap:not([hidden])){grid-template-columns: 1fr 1fr;}
@media (max-width: 560px){
#dlg .row2:has(.damt){grid-template-columns: 1fr;}
#dlg .row2:has(#nAcc):has(#toWrap:not([hidden])){grid-template-columns: 1fr;}
}
*{box-sizing: border-box; -webkit-tap-highlight-color: transparent;}
html,body{margin: 0px;}
body{font-family: var(--font); color: var(--ink); background: var(--bg); font-size: 13px; line-height: 1.35; text-size-adjust: 100%;}
button,input,select{font: inherit; color: inherit;}
html,body{touch-action: pan-x pan-y;}
button{cursor: pointer;}
svg.i{width: 20px; height: 20px; fill: none; stroke: currentcolor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto;}
[hidden]{display: none !important;}
.shell{margin: 6px auto; max-width: 1760px; background: var(--shell); border-radius: 24px; padding: 8px; display: grid; grid-template-columns: 196px minmax(0px, 1fr); gap: 8px; min-height: calc(100dvh - 12px); box-shadow: rgba(0, 0, 0, 0.06) 0px 12px 40px;}
.col{display: flex; flex-direction: column; gap: 8px; min-width: 0px;}
.side{background: var(--panel); border-radius: 22px; padding: 18px 14px; display: flex; flex-direction: column; position: sticky; top: 14px; height: calc(100dvh - 28px); overflow: auto;}
.brand{display: flex; align-items: center; gap: 9px; padding: 0px 6px 6px;}
.logo{width: 34px; height: 34px; color: var(--g2); display: grid; place-items: center; flex: 0 0 auto;}
.logo svg{width: 34px; height: 34px; stroke-width: 1.9;}
.brand b{font-size: 16px; font-weight: 600; letter-spacing: -0.3px; white-space: nowrap;}
.sec{font-size: 11px; color: rgb(163, 169, 165); letter-spacing: 0.6px; margin: 22px 8px 8px;}
.nav{height: 42px; display: flex; align-items: center; gap: 12px; padding: 0px 10px; border: 0px; background: none; color: rgb(121, 128, 124); font-weight: 500; font-size: 13.5px; position: relative; border-radius: 10px; width: 100%; text-align: left;}
.nav:active{background: var(--bd);}
.nav.on{color: var(--ink); font-weight: 600;}
.nav.on svg{color: var(--g2);}
.nav.on::before{content: ""; position: absolute; left: -14px; top: 5px; bottom: 5px; width: 4px; border-radius: 0px 4px 4px 0px; background: var(--g2);}
.top{background: var(--panel); border-radius: 22px; padding: 10px 14px; display: flex; align-items: center; gap: 10px; min-height: 64px;}
.gsearch{display: flex; align-items: center; gap: 8px; background: var(--card); border-radius: 999px; height: 42px; padding: 0px 8px 0px 14px; flex: 1 1 120px; max-width: 300px; min-width: 0px; color: var(--ink2);}
.gsearch input{flex: 1 1 0%; min-width: 0px; border: 0px; outline: 0px; background: none; font-size: 13px;}
.gsearch input::placeholder{color: rgb(176, 181, 178);}
.sp{flex: 1 1 0%;}
.rb{width: 42px; height: 42px; border-radius: 50%; background: var(--card); border: 0px; display: grid; place-items: center; color: var(--ink2);}
.user{display: flex; align-items: center; gap: 10px; padding-left: 4px; min-width: 0px;}
.avatar{width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg,var(--g4),var(--g2)); color: rgb(255, 255, 255); display: grid; place-items: center; font-weight: 700; font-size: 15px; flex: 0 0 auto;}
.user b{display: block; font-size: 13px; font-weight: 600; white-space: nowrap;}
.user small{display: block; color: var(--mut); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px;}
.content{background: var(--panel); border-radius: 20px; padding: 14px 14px 12px; flex: 1 1 0%;}
.head{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px;}
h1{margin: 0px; font-size: 32px; font-weight: 500; letter-spacing: -0.8px; line-height: 1.1;}
.head p{margin: 5px 0px 0px; color: var(--mut); font-size: 13px;}
.actions{display: flex; gap: 10px; flex-wrap: wrap;}
.btn{height: 42px; padding: 0px 20px; border-radius: 999px; display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; font-weight: 500; font-size: 13.5px; border: 1.5px solid var(--g1); color: var(--g1); background: transparent;}
.btn.p{background: linear-gradient(180deg,var(--btn1),var(--btn2)); color: rgb(255, 255, 255); border-color: transparent; box-shadow: 0 6px 14px rgba(var(--shadow),.25);}
.btn:active{transform: scale(0.98);}
.pc{width: 20px; height: 20px; border: 1.5px solid; border-radius: 50%; display: grid; place-items: center;}
.pc svg{width: 11px; height: 11px; stroke-width: 2.6;}
.card{background: var(--card); border-radius: 18px; padding: 14px 16px; min-width: 0px; min-height: 0px; display: flex; flex-direction: column; overflow: hidden;}
.card h3{margin: 0px 0px 10px; font-size: 14px; font-weight: 500; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 30px;}
.mini{height: 30px; padding: 0px 12px; border-radius: 999px; border: 1.2px solid var(--g1); background: transparent; color: var(--g1); font-weight: 500; font-size: 11.5px; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;}
.mini svg{width: 12px; height: 12px; stroke-width: 2.4;}
.bars{flex: 1 1 0%; display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; min-height: 0px;}
.bar{width: 100%; max-width: 42px; border-radius: 999px; position: relative;}
.bar.r1{background: var(--g1);}
.bar.r2{background: var(--g2);}
.bar em{position: absolute; top: -17px; left: 50%; transform: translateX(-50%); background: var(--card); border: 1px solid var(--line); border-radius: 6px; font-style: normal; font-size: 9.5px; padding: 1px 5px; color: var(--mut2); white-space: nowrap; box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 6px;}
.list{display: flex; flex-direction: column; gap: 2px; overflow: auto; min-height: 0px;}
.li{display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 3px 0px; border: 0px; background: none; text-align: left; width: 100%; min-width: 0px; flex: 0 0 auto;}
.li .av{width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex: 0 0 auto; font-weight: 700; font-size: 12px;}
.li .av svg{width: 16px; height: 16px;}
.li .tx{flex: 1 1 0%; min-width: 0px; overflow: hidden;}
.li .tx b{display: block; font-size: 12.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.li .tx small{display: block; color: rgb(170, 176, 173); font-size: 10.5px;}
.li .v{font-weight: 600; font-size: 11.5px; white-space: nowrap;}
.av.income{background: var(--possoft); color: var(--pos);}
.av.expense{background: var(--red-soft); color: var(--red);}
.av.transfer{background: var(--blue-soft); color: var(--blue);}
.li.acc{min-height: 52px;}
.li.acc .av{width: 36px; height: 36px; border-radius: 50%; font-size: 14px;}
.li.acc .tx b{font-size: 13px;}
.li.acc .tx small{font-size: 11px;}
.empty-s{color: var(--mut); font-size: 12px; padding: 10px 0px;}
.legend{display: flex; justify-content: center; gap: 12px; color: var(--mut2); font-size: 10.5px; margin-top: 6px; flex: 0 0 auto;}
.legend i{display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: -0.5px;}
.legend i.h{background: repeating-linear-gradient(135deg,var(--hatchline) 0 1.2px,var(--hatch) 1.2px 3px);}
.card.goal{color: rgb(255, 255, 255); align-items: flex-start; background: radial-gradient(circle at 90% 120%,rgba(var(--glow),.5),transparent 55%),repeating-radial-gradient(circle at 80% 130%,rgba(255,255,255,.09) 0 2px,transparent 2px 12px),linear-gradient(150deg,var(--d1),var(--d2));}
.goal h3{color: rgb(255, 255, 255); width: 100%; min-height: 24px; margin-bottom: 6px; white-space: nowrap;}
.goal h3 small{flex: 1 1 0%; min-width: 0px; text-align: right; overflow: hidden; text-overflow: ellipsis;}
.stats{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 12px;}
.stat{display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 18px; min-width: 0px;}
.stat .ic{width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; background: var(--card);}
.stat small{color: var(--ink2); font-weight: 500; font-size: 12.5px;}
.stat b{display: block; font-size: 21px; font-weight: 600; letter-spacing: -0.5px; margin: 1px 0px 2px; white-space: nowrap;}
.stat .d{font-size: 11.5px; font-weight: 600; white-space: nowrap; display: inline-flex; align-items: center; gap: 3px; color: var(--pos);}
.stat .d.bad{color: var(--red);}
.stat .d.mut{color: var(--mut2); font-weight: 500;}
.stat .d svg{width: 12px; height: 12px;}
.stat.inc{background: var(--possoft);}
.stat.inc .ic{color: var(--pos);}
.stat.exp{background: var(--red-soft);}
.stat.exp .ic{color: var(--red);}
.stat.trf{background: var(--blue-soft);}
.stat.trf .ic{color: var(--blue);}
.stat.net{background: var(--possoft);}
.stat.net .ic{color: var(--pos);}
.note{display: flex; align-items: center; gap: 8px; color: var(--mut2); font-size: 12px; margin: 12px 4px 14px;}
.note svg{width: 15px; height: 15px;}
.banner{display: flex; align-items: center; gap: 12px; background: var(--gsoft); border: 1px solid var(--gline); color: var(--g1); border-radius: 14px; padding: 0px 6px 0px 14px; min-height: 44px; margin-bottom: 12px;}
.banner span{flex: 1 1 0%;}
.iconbtn{width: 44px; height: 44px; border: 0px; background: none; border-radius: 10px; display: grid; place-items: center; color: inherit;}
.panel{background: var(--card); border-radius: 18px; padding: 4px 16px 14px; container: panel / inline-size;}
.tabs{display: flex; gap: 6px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none;}
.tabs::-webkit-scrollbar{display: none;}
.tab{border: 0px; background: none; padding: 0px 14px; height: 50px; font-weight: 500; color: var(--mut2); position: relative; white-space: nowrap;}
.tab.on{color: var(--g1); font-weight: 600;}
.tab.on::after{content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 3px; border-radius: 3px; background: var(--g2);}
.filters{display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0px 12px;}
.field{display: flex; align-items: center; gap: 8px; height: 44px; border: 1px solid var(--line); border-radius: 12px; padding: 0px 12px; background: var(--card); color: var(--mut);}
.field.search{flex: 2 1 220px;}
.field input{border: 0px; outline: 0px; flex: 1 1 0%; min-width: 0px; background: none; color: var(--ink);}
.sel{flex: 1 1 150px; position: relative; padding: 0px;}
.sel select{appearance: none; border: 0px; background: none; height: 100%; width: 100%; padding: 0px 34px 0px 14px; font-size: 13px; color: rgb(38, 51, 45); outline: 0px;}
.sel svg{position: absolute; right: 12px; pointer-events: none; width: 16px; height: 16px;}
.chips{display: flex; gap: 8px; overflow-x: auto; padding: 2px 0px 12px; scrollbar-width: none;}
.chips::-webkit-scrollbar{display: none;}
.chip{flex: 0 0 auto; height: 38px; padding: 0px 16px; border-radius: 999px; border: 1px solid var(--line); background: var(--soft); color: var(--ink2); font-size: 12.5px;}
.chip.on{background: var(--g1); border-color: var(--g1); color: rgb(255, 255, 255); font-weight: 600;}
.tw{overflow-x: auto;}
table{width: 100%; border-collapse: collapse; min-width: 640px;}
th{background: var(--soft); color: var(--mut2); font-weight: 600; font-size: 11.5px; text-align: left; padding: 0px 10px; height: 40px; white-space: nowrap;}
td{padding: 0px 10px; height: 58px; border-bottom: 1px solid var(--soft); white-space: nowrap; font-size: 13px;}
tr.r:active td{background: var(--soft);}
td.chk,th.chk{width: 44px; padding-left: 8px;}
input[type="checkbox"]{width: 20px; height: 20px; accent-color: var(--g2);}
.date b{font-weight: 500; display: block;}
.date small{color: rgb(163, 169, 165); font-size: 11px;}
.desc{display: flex; align-items: center; gap: 6px; font-weight: 500; white-space: normal; min-width: 130px;}
.desc svg{width: 15px; height: 15px; color: rgb(139, 149, 143);}
.tag{display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0px 11px; border-radius: 999px; font-size: 11.5px; font-weight: 600;}
.tag svg{width: 13px; height: 13px; stroke-width: 2.4;}
.t-transfer{background: var(--blue-soft); color: var(--blue);}
.s-Accounts{background: var(--blue-soft); color: var(--blue);}
.cat,.acct{display: flex; align-items: center; gap: 8px;}
.cat > svg{color: var(--g2);}
.acct svg{color: var(--ink2); width: 18px; height: 18px;}
.amt{font-weight: 700;}
.amt.p{color: var(--pos);}
.amt.n{color: var(--red);}
.amt.t{color: var(--blue);}
.st{background: var(--possoft); color: var(--pos);}
tr.r{cursor: pointer;}
.more{width: 40px; height: 40px; border: 0px; background: none; border-radius: 10px; color: var(--ink2);}
.empty{text-align: center; color: var(--mut); padding: 40px 0px;}
.sub{display: none;}
.foot{display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 14px; color: var(--mut2); font-size: 12.5px;}
.pager{display: flex; align-items: center; gap: 6px;}
.pg{min-width: 40px; height: 40px; border-radius: 10px; border: 0px; background: none; color: var(--ink2); font-weight: 600;}
.pg.on{background: var(--gsoft); color: var(--g1);}
.pg:disabled{opacity: 0.35;}
.asum{display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 12px; margin-bottom: 12px;}
.sc{background: var(--card); border-radius: 18px; padding: 12px 14px; display: flex; align-items: center; gap: 11px; min-width: 0px;}
.sc .ic{width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto;}
.sc .ic svg{width: 18px; height: 18px;}
.sc small{display: block; color: var(--mut2); font-size: 11.5px; font-weight: 500; white-space: nowrap;}
.sc b{display: block; font-size: 17px; font-weight: 600; letter-spacing: -0.4px; white-space: nowrap; margin: 1px 0px;}
.sc em{font-style: normal; color: var(--mut); font-size: 10.5px;}
.ic.g{background: var(--gsoft); color: var(--g2);}
.ic.b{background: var(--blue-soft); color: var(--blue);}
.ic.r{background: var(--red-soft); color: var(--red);}
.ic.a{background: var(--amber-soft); color: var(--amber);}
.apanel{background: var(--card); border-radius: 18px; padding: 14px 16px; min-width: 0px;}
.atabs{display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; flex: 1 1 440px; min-width: 0px;}
.atabs::-webkit-scrollbar{display: none;}
.at{height: 34px; padding: 0px 13px; border-radius: 999px; border: 1px solid transparent; background: none; color: var(--mut2); font-weight: 500; font-size: 12.5px; white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto;}
.at i{font-style: normal; font-size: 10.5px; background: var(--chipbg); border-radius: 999px; padding: 1px 7px; color: var(--mut2);}
.at.on{background: var(--gsoft); color: var(--g1); border-color: var(--gline);}
.at.on i{background: var(--g2); color: rgb(255, 255, 255);}
.atop{display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px;}
.ac{aspect-ratio: 1.586 / 1; width: 100%; border-radius: 14px; padding: 13px 15px 12px; color: rgb(255, 255, 255); display: flex; flex-direction: column; position: relative; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 22px, rgba(255, 255, 255, 0.12) 0px 0px 0px 1px inset;}
.ac::before{content: ""; position: absolute; inset: 0px; background: radial-gradient(circle at 85% -10%, rgba(255, 255, 255, 0.28), transparent 55%), radial-gradient(circle at -10% 110%, rgba(0, 0, 0, 0.25), transparent 55%);}
.ac::after{content: ""; position: absolute; right: -50px; bottom: -60px; width: 170px; height: 170px; border-radius: 50%; border: 26px solid rgba(255, 255, 255, 0.07);}
.ac > *{position: relative; z-index: 1;}
.ac-top{display: flex; align-items: center; justify-content: space-between; gap: 8px;}
.ac-bank{font-size: 14px; font-weight: 800; letter-spacing: 0.2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: rgba(0, 0, 0, 0.25) 0px 1px 2px;}
.ac-cn{display: block; font-style: normal; font-size: 11px; font-weight: 600; opacity: 0.85; letter-spacing: 0.3px; text-overflow: ellipsis; overflow: hidden;}
.ac-mid{display: flex; align-items: center; gap: 10px; margin-top: auto; min-height: 28px;}
.ac-chip{width: 36px; height: 27px; border-radius: 6px; background: linear-gradient(135deg, rgb(246, 220, 143), rgb(201, 162, 75)); position: relative; box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;}
.ac-chip::before{content: ""; position: absolute; inset: 5px 0px; border-top: 1px solid rgba(0, 0, 0, 0.25); border-bottom: 1px solid rgba(0, 0, 0, 0.25);}
.ac-chip::after{content: ""; position: absolute; inset: 0px 12px; border-left: 1px solid rgba(0, 0, 0, 0.25); border-right: 1px solid rgba(0, 0, 0, 0.25);}
.ac .wv{width: 20px; height: 20px; opacity: 0.85;}
.ac-num{font-size: 15.5px; font-weight: 600; letter-spacing: 2px; margin-top: 7px; white-space: nowrap; text-shadow: rgba(0, 0, 0, 0.25) 0px 1px 2px;}
.ac-num.sm{font-size: 12px; letter-spacing: 1.5px; opacity: 0.9;}
.ac-bot{display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 8px;}
.ac-hold{font-size: 11px; font-weight: 600; letter-spacing: 0.8px; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0.92;}
.ac-cty{font-size: 9px; font-weight: 700; letter-spacing: 1px; opacity: 0.75; flex: 0 0 auto;}
.nw{flex: 0 0 auto; font-weight: 800; line-height: 1;}
.nw.visa{font-style: italic; font-size: 17px; letter-spacing: -0.5px;}
.nw.rupay{font-size: 13px; letter-spacing: -0.2px;}
.nw.mc{display: flex;}
.nw.mc i{width: 20px; height: 20px; border-radius: 50%; background: rgb(235, 0, 27);}
.nw.mc i + i{background: rgb(247, 158, 27); margin-left: -8px; opacity: 0.92;}
.acf{display: flex; flex-direction: column; gap: 8px;}
.arow{display: flex; align-items: center; gap: 12px; padding: 10px 4px; border-bottom: 1px solid var(--line);}
.arow:last-of-type{border-bottom: 0px;}
.arow .av{width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; font-weight: 700;}
.arow .nm{flex: 1 1 0%; min-width: 0px;}
.arow .nm b{display: block; font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.arow .nm small{color: var(--mut); font-size: 11px;}
.arow .ra{display: flex; gap: 6px; flex: 0 0 auto;}
.ib{width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--line); background: var(--card); color: var(--mut2); display: grid; place-items: center;}
.ib svg{width: 15px; height: 15px;}
.ib.star.on{color: rgb(201, 138, 11); border-color: rgb(241, 220, 166); background: var(--amber-soft);}
.ib.star.on svg{fill: currentcolor;}
.flow{display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px;}
.flow div{border-radius: 12px; padding: 9px 11px;}
.flow small{display: block; font-size: 10.5px; color: var(--mut2);}
.flow b{font-size: 14px; font-weight: 600; white-space: nowrap;}
.flow .in{background: var(--possoft);}
.flow .in b{color: var(--pos);}
.flow .out{background: var(--red-soft);}
.flow .out b{color: var(--red);}
@media (max-width: 1100px){
.asum{grid-template-columns: repeat(3, minmax(0px, 1fr));}
}
@media (max-width: 640px){
.asum{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
.asum.c4{grid-template-columns: repeat(4, minmax(0px, 1fr));}
.bs{font-size: 10.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; flex: 0 0 auto;}
.bs.over{background: var(--red-soft); color: var(--red);}
.bs.soon{background: var(--amber-soft); color: var(--amber);}
.bs.up{background: var(--gsoft); color: var(--g2);}
.bs.paid{background: var(--chipbg); color: var(--mut2);}
.rgrid{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; margin-bottom: 12px;}
.rgrid h3,.sgrid h3{margin: 0px 0px 12px; font-size: 14px; font-weight: 500; display: flex; align-items: center; justify-content: space-between; gap: 8px;}
.mnav{display: flex; align-items: center; gap: 8px;}
.mnav b{min-width: 120px; text-align: center; font-weight: 600; font-size: 14px;}
.cb{display: grid; gap: 4px; margin-bottom: 11px;}
.cb .t{display: flex; justify-content: space-between; gap: 8px; font-size: 12px;}
.cb .t b{font-weight: 600; white-space: nowrap;}
.cb .t span{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cb .tr{height: 8px; border-radius: 99px; background: var(--track); overflow: hidden;}
.cb .tr i{display: block; height: 100%; border-radius: 99px; background: var(--g3);}
.cb.inc .tr i{background: var(--g1);}
.trend{display: flex; align-items: flex-end; gap: 10px; height: 170px;}
.tcol{flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; justify-content: flex-end;}
.tbars{flex: 1 1 0%; width: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 4px; min-height: 0px;}
.tbars i{display: block; width: 44%; max-width: 22px; border-radius: 6px 6px 3px 3px; min-height: 3px;}
.tbars .i1{background: var(--pos);}
.tbars .i2{background: rgb(240, 163, 165);}
.tcol small{font-size: 10.5px; color: var(--mut);}
.tcol.on small{color: var(--ink); font-weight: 600;}
.tleg{display: flex; gap: 14px; font-size: 11px; color: var(--mut2); margin-top: 8px;}
.tleg i{display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px;}
.tbl{width: 100%; border-collapse: collapse; font-size: 12.5px;}
.tbl th{text-align: left; color: var(--mut); font-weight: 500; font-size: 11px; padding: 6px 8px;}
.tbl td{padding: 9px 8px; border-top: 1px solid var(--line);}
.tbl .n{text-align: right; white-space: nowrap;}
.tblw{overflow-x: auto;}
.sgrid{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; align-items: start;}
.shub{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 14px; margin: 6px 0px 16px;}
@media (max-width: 560px){
.shub{grid-template-columns: minmax(0px, 1fr);}
}
.shub button{display: flex; align-items: center; gap: 14px; text-align: left; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: var(--card); color: inherit; font: inherit; cursor: pointer; transition: transform 0.12s, box-shadow 0.15s;}
.shub button:active{transform: scale(0.985);}
.shub .si{width: 46px; height: 46px; border-radius: 14px; background: var(--possoft,#e6f4ea); display: grid; place-items: center; font-size: 22px; flex: 0 0 auto;}
.shub b{display: block; font-size: 15.5px;}
.shub small{display: block; color: var(--mut2); font-size: 12.5px; margin-top: 2px; line-height: 1.35;}
.sgtop{display: flex; align-items: center; gap: 10px; margin: 2px 0px 14px;}
.sgtop button{display: flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--card); color: inherit; border-radius: 999px; padding: 9px 16px 9px 12px; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; font-weight: 600; cursor: pointer;}
.sgtop h2{margin: 0px; font-size: 19px;}
#view-settings[data-sgv="hub"] .sgrid,#view-settings[data-sgv="hub"] .sgtop,#view-settings:not([data-sgv="hub"]) .shub{display: none;}
#view-settings .sgrid{gap: 16px;}
.prog{height: 9px; border-radius: 99px; background: var(--track); overflow: hidden; margin: 10px 0px;}
.prog i{display: block; height: 100%; background: linear-gradient(90deg,var(--g3),var(--g1)); border-radius: 99px;}
.brow{display: flex; gap: 8px; flex-wrap: wrap;}
@media (max-width: 900px){
.rgrid,.sgrid{grid-template-columns: minmax(0px, 1fr);}
.asum.c4{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
@media (min-width: 641px){
html.rail .shell{grid-template-columns: 72px minmax(0px, 1fr);}
html.rail .side{padding: 12px 6px; align-items: center;}
html.rail .brand{padding: 0px 0px 6px; justify-content: center;}
html.rail .brand b{display: none;}
html.rail .sec{display: none;}
html.rail .side .sep{height: 1px; background: var(--bd); width: 36px; margin: 10px 0px;}
html.rail .nav{justify-content: center; padding: 0px; height: 46px; width: 48px; gap: 0px;}
html.rail .nav span{display: none;}
html.rail .nav.on::before{left: -6px;}
}
.side .sep{height: 1px; background: var(--bd); margin: 8px 6px;}
.ac-lb{display: flex; align-items: center; gap: 8px; min-width: 0px;}
.ac-logo{flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; background: rgb(255, 255, 255); border: 0px; padding: 3px; display: grid; place-items: center; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.18) 0px 2px 6px; cursor: pointer; position: relative;}
.ac-logo img{width: 100%; height: 100%; object-fit: contain; border-radius: 6px; position: relative; z-index: 1;}
.ac-logo span{position: absolute; inset: 0px; display: grid; place-items: center; font-weight: 800; font-size: 13px; color: rgb(51, 51, 51);}
.ac-logo:not(.nol) img + span{visibility: hidden;}
.ac.wm .ac-bank{font-size: 21px; font-weight: 800; letter-spacing: -0.6px; text-transform: lowercase;}
.ac.wm .ac-hold,.ac.wm .ac-cty,.ac.wm .ac-num{color: inherit; opacity: 0.85;}
@media (min-width: 641px){
.side > .nav,.side > .ng,.side > .nrow,.side > .sec,.side > .sep,.ngb > .nav{flex: 0 0 auto;}
.side .nav{min-height: 40px;}
}
.ng{display: grid;}
.ngh{display: flex; align-items: center; gap: 12px; height: 40px; padding: 0px 12px; border: 0px; background: none; color: var(--mut2); font-size: 13.5px; font-weight: 600; border-radius: 12px; cursor: pointer; width: 100%; text-align: left;}
.ngh > svg:first-child{width: 18px; height: 18px;}
.ngh span{flex: 1 1 0%;}
.ngh:hover{background: var(--soft);}
.ngc{transition: transform 0.25s; transform: rotate(0deg); width: 14px !important; height: 14px !important;}
.ng.open .ngc{transform: rotate(90deg);}
.ng.has .ngh{color: var(--ink);}
.ngb{display: grid; overflow: hidden; max-height: 0px; transition: max-height 0.3s; padding-left: 8px;}
.ng.open .ngb{max-height: 420px;}
.nrow{display: flex; gap: 6px; justify-content: space-between; padding: 0px 4px;}
.nrow .nav{flex: 1 1 0%; justify-content: center; padding: 0px; gap: 0px; height: 44px;}
.nrow .nav span{display: none;}
@media (min-width: 641px){
html.rail .ngh{display: none;}
html.rail .ngb{max-height: none; padding-left: 0px;}
html.rail .nrow{flex-direction: column;}
}
@media (max-width: 640px){
.ng,.ngb,.nrow{display: contents;}
.ngh{display: none;}
.nrow .nav span{display: block;}
}
.nav svg.i{width: 19px; height: 19px; stroke-width: 1.5;}
.mini[disabled]{opacity: 0.4; pointer-events: none;}
.th{border: 2px solid var(--line); border-radius: 16px; background: var(--card); padding: 10px; text-align: left; display: grid; gap: 8px;}
.th.on{border-color: var(--g2);}
.th .sw{height: 54px; border-radius: 10px; display: flex; overflow: hidden;}
.th .sw i{flex: 1 1 0%;}
.th b{font-size: 13px; font-weight: 600; display: flex; justify-content: space-between; align-items: center;}
.th b svg{width: 16px; height: 16px; color: var(--g2);}
.th small{color: var(--mut); font-size: 11px;}
.d2{display: grid; grid-template-columns: repeat(12, minmax(0px, 1fr)); grid-template-rows: 252px 150px 196px; gap: 10px; margin-bottom: 10px;}
.d2 > .card{min-width: 0px;}
.rem{grid-area: 1 / 7 / auto / 10;}
.rec{grid-area: 2 / 1 / 4 / 6;}
.card h3 small{color: var(--mut); font-weight: 400; font-size: 11px;}
.card .sub{color: var(--mut); font-size: 11px; margin: -6px 0px 6px;}
.rem .big{color: var(--g2); font-size: 21px; font-weight: 600; line-height: 1.2; letter-spacing: -0.4px; margin: 4px 0px 6px;}
.rem .due{color: var(--mut); font-size: 11.5px; margin-bottom: auto;}
.fx{display: grid; grid-template-columns: auto auto minmax(80px, 1fr) auto; align-items: center; gap: 8px 22px; padding: 12px 16px; margin-bottom: 6px;}
.fx .t b{display: block; font-size: 14px; font-weight: 600;}
.fx .t small{color: var(--mut); font-size: 11px;}
.fx .r b{font-size: 19px; font-weight: 600; letter-spacing: -0.4px;}
.fx .r small{display: block; font-size: 11px; font-weight: 600;}
.fx .r small.up{color: var(--pos);}
.fx .r small.dn{color: var(--red);}
.fx .r small.mut{color: var(--mut);}
.fx .e{text-align: right; font-size: 11px; color: var(--mut);}
.fx .e b{display: block; color: var(--ink); font-size: 12.5px; margin: 2px 0px 6px;}
.ldot{width: 8px; height: 8px; border-radius: 50%; background: var(--pos); box-shadow: rgba(23, 163, 90, 0.2) 0px 0px 0px 3px; flex: 0 0 auto;}
.ldot.off{background: var(--mut); box-shadow: none;}
.pill{height: 42px; padding: 0px 14px; border-radius: 999px; background: var(--card); border: 0px; display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; color: var(--ink2); white-space: nowrap;}
.pill small{display: block; color: var(--mut); font-size: 10.5px; line-height: 1.1;}
.pill b{display: block; font-size: 12.5px; font-weight: 700; color: var(--ink); line-height: 1.1;}
.rb{position: relative;}
.rb .dot{position: absolute; top: 9px; right: 10px; width: 8px; height: 8px; border-radius: 50%; background: rgb(229, 72, 77); box-shadow: 0 0 0 2px var(--card);}
.rb[aria-pressed="true"]{background: var(--g1); color: rgb(255, 255, 255);}
@media (max-width: 1100px){
.d2{grid-template-columns: repeat(2, minmax(0px, 1fr)); grid-template-rows: auto;}
.d2 > .card{grid-area: auto !important;}
.rem{min-height: 170px;}
.rec{min-height: 260px;}
.fx{grid-template-columns: 1fr 1fr;}
.fx .e{text-align: left;}
.pill.dt{display: none;}
}
@media (max-width: 1420px){
.pill.dt{display: none;}
}
@media (max-width: 640px){
.d2{grid-template-columns: minmax(0px, 1fr);}
}
dialog{border: 0px; border-radius: 22px; padding: 0px; width: min(520px, -32px + 100vw); box-shadow: rgba(10, 30, 20, 0.3) 0px 20px 60px; color: var(--ink);}
dialog::backdrop{background: rgba(10, 30, 20, 0.45);}
.dlg{padding: 22px; display: grid; gap: 14px;}
.dlg h2{margin: 0px; font-size: 21px; font-weight: 600;}
.dlg label,.auth label{display: grid; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ink2);}
.dlg input,.dlg select,.auth input{height: 46px; border: 1px solid var(--bd); border-radius: 12px; padding: 0px 12px; font-size: 16px; background: var(--card); color: var(--ink); width: 100%;}
.row2{display: grid; grid-template-columns: 1fr 1fr; gap: 12px;}
.dlg .actions{justify-content: flex-end; margin-top: 4px;}
.emgapb{color-scheme: unset; forced-color-adjust: unset; math-depth: unset; position: unset; position-anchor: unset; text-size-adjust: unset; appearance: unset; font-family: unset; font-feature-settings: unset; font-kerning: unset; font-language-override: unset; font-optical-sizing: unset; font-palette: unset; font-size-adjust: unset; font-stretch: unset; font-style: unset; font-synthesis: unset; font-variant: unset; font-variation-settings: unset; font-weight: unset; position-area: unset; text-orientation: unset; text-rendering: unset; text-spacing-trim: unset; -webkit-font-smoothing: unset; -webkit-locale: unset; -webkit-text-orientation: unset; -webkit-writing-mode: unset; writing-mode: unset; zoom: unset; accent-color: unset; place-content: unset; place-self: unset; alignment-baseline: unset; anchor-name: unset; anchor-scope: unset; animation-composition: unset; animation: unset; animation-trigger: unset; app-region: unset; aspect-ratio: unset; backdrop-filter: unset; backface-visibility: unset; background-blend-mode: unset; baseline-shift: unset; baseline-source: unset; block-size: unset; border-block: unset; border-collapse: unset; border-end-end-radius: unset; border-end-start-radius: unset; border-inline: unset; border-shape: unset; border-start-end-radius: unset; border-start-start-radius: unset; inset: unset; box-decoration-break: unset; box-shadow: unset; break-after: unset; break-before: unset; break-inside: unset; buffered-rendering: unset; caption-side: unset; caret-animation: unset; caret-color: unset; caret-shape: unset; clear: unset; clip: unset; clip-path: unset; clip-rule: unset; color-interpolation: unset; color-interpolation-filters: unset; color-rendering: unset; columns: unset; column-fill: unset; rule-break: unset; rule: unset; rule-inset: unset; rule-visibility-items: unset; column-span: unset; contain: unset; contain-intrinsic-block-size: unset; contain-intrinsic-size: unset; contain-intrinsic-inline-size: unset; container: unset; content: unset; content-visibility: unset; corner-shape: unset; corner-block-end-shape: unset; corner-block-start-shape: unset; counter-increment: unset; counter-reset: unset; counter-set: unset; cx: unset; cy: unset; d: unset; dominant-baseline: unset; dynamic-range-limit: unset; empty-cells: unset; field-sizing: unset; fill: unset; fill-opacity: unset; fill-rule: unset; filter: unset; flex: unset; flex-flow: unset; flex-line-count: unset; float: unset; flood-color: unset; flood-opacity: unset; grid: unset; grid-area: unset; height: unset; hyphenate-character: unset; hyphenate-limit-chars: unset; hyphens: unset; image-orientation: unset; image-rendering: unset; initial-letter: unset; inline-size: unset; inset-block: unset; inset-inline: unset; interactivity: unset; interest-delay: unset; interpolate-size: unset; isolation: unset; justify-items: unset; letter-spacing: unset; lighting-color: unset; line-break: unset; line-height: unset; list-style: unset; margin-block: unset; margin-inline: unset; margin-left: unset; margin-right: unset; margin-top: unset; marker: unset; mask: unset; mask-type: unset; math-shift: unset; math-style: unset; max-block-size: unset; max-height: unset; max-inline-size: unset; max-width: unset; min-block-size: unset; min-height: unset; min-inline-size: unset; min-width: unset; mix-blend-mode: unset; object-fit: unset; object-position: unset; object-view-box: unset; offset: unset; opacity: unset; order: unset; orphans: unset; outline: unset; outline-offset: unset; overflow-anchor: unset; overflow-block: unset; overflow-clip-margin: unset; overflow-inline: unset; overflow-wrap: unset; overflow: unset; overlay: unset; overscroll-behavior-block: unset; overscroll-behavior-inline: unset; overscroll-behavior: unset; padding-block: unset; padding-inline: unset; page: unset; page-margin-safety: unset; page-orientation: unset; paint-order: unset; perspective: unset; perspective-origin: unset; pointer-events: unset; position-try: unset; position-visibility: unset; print-color-adjust: unset; quotes: unset; r: unset; reading-flow: unset; reading-order: unset; resize: unset; rotate: unset; ruby-align: unset; ruby-overhang: unset; ruby-position: unset; rule-overlap: unset; rx: unset; ry: unset; scale: unset; scroll-axis-lock: unset; scroll-behavior: unset; scroll-initial-target: unset; scroll-margin-block: unset; scroll-margin: unset; scroll-margin-inline: unset; scroll-marker-group: unset; scroll-padding-block: unset; scroll-padding: unset; scroll-padding-inline: unset; scroll-snap-align: unset; scroll-snap-stop: unset; scroll-snap-type: unset; scroll-target-group: unset; scroll-timeline: unset; scrollbar-color: unset; scrollbar-gutter: unset; scrollbar-width: unset; shape-image-threshold: unset; shape-margin: unset; shape-outside: unset; shape-rendering: unset; size: unset; speak: unset; stop-color: unset; stop-opacity: unset; stroke: unset; stroke-dasharray: unset; stroke-dashoffset: unset; stroke-linecap: unset; stroke-linejoin: unset; stroke-miterlimit: unset; stroke-opacity: unset; stroke-width: unset; tab-size: unset; table-layout: unset; text-align: unset; text-align-last: unset; text-anchor: unset; text-autospace: unset; text-box: unset; text-combine-upright: unset; text-decoration: unset; text-decoration-skip-ink: unset; text-emphasis: unset; text-emphasis-position: unset; text-fit: unset; text-indent: unset; text-justify: unset; text-overflow: unset; text-shadow: unset; text-transform: unset; text-underline-offset: unset; text-underline-position: unset; text-wrap: unset; timeline-scope: unset; timeline-trigger: unset; touch-action: unset; transform: unset; transform-box: unset; transform-origin: unset; transform-style: unset; transition: unset; translate: unset; trigger-scope: unset; user-select: unset; vector-effect: unset; vertical-align: unset; view-timeline: unset; view-transition-class: unset; view-transition-group: unset; view-transition-name: unset; view-transition-scope: unset; visibility: unset; border-spacing: unset; -webkit-box-align: unset; -webkit-box-decoration-break: unset; -webkit-box-direction: unset; -webkit-box-flex: unset; -webkit-box-ordinal-group: unset; -webkit-box-orient: unset; -webkit-box-pack: unset; -webkit-box-reflect: unset; -webkit-line-break: unset; -webkit-line-clamp: unset; -webkit-mask-box-image: unset; -webkit-rtl-ordering: unset; -webkit-ruby-position: unset; -webkit-tap-highlight-color: unset; -webkit-text-combine: unset; -webkit-text-decorations-in-effect: unset; -webkit-text-fill-color: unset; -webkit-text-security: unset; -webkit-text-stroke: unset; -webkit-user-drag: unset; white-space-collapse: unset; widows: unset; will-change: unset; window-drag: unset; word-break: unset; word-spacing: unset; x: unset; y: unset; z-index: unset; box-sizing: border-box; display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; border-radius: 12px; background: color-mix(in srgb,var(--amber) 16%,var(--card)); border: 1px solid color-mix(in srgb,var(--amber) 45%,transparent); font-size: 12px; cursor: pointer; margin-bottom: 8px; color: var(--ink);}
.emgapb svg{width: 16px; height: 16px; color: var(--amber); flex: 0 0 auto;}
.emgapb span{flex: 1 1 0%; min-width: 0px;}
.emgapb small{display: block; color: var(--mut); font-size: 11px;}
.emgapb em{font-style: normal; font-weight: 700; color: var(--g1); white-space: nowrap;}
.emgapb.big{padding: 12px 14px; margin: 0px 0px 10px; font-size: 13px;}
.svg{border-top: 1px solid var(--bd);}
.svg summary{display: flex; justify-content: space-between; align-items: center; padding: 9px 0px; cursor: pointer; list-style: none; font-size: 13px;}
.svg summary::-webkit-details-marker{display: none;}
.svg summary .ok{color: var(--pos); font-size: 12px; font-weight: 600;}
.svg summary .bad{color: var(--red); font-size: 12px; font-weight: 600;}
html.locked body > :not(#lockScr){visibility: hidden;}
.pend{display: inline-block; font-size: 10.5px; font-weight: 700; color: var(--amber); background: color-mix(in srgb,var(--amber) 14%,transparent); border-radius: 6px; padding: 1px 6px; margin-left: 4px;}
dialog{max-height: calc(100dvh - 24px); overflow: auto; overscroll-behavior: contain; background: var(--card);}
dialog .dlg > .actions{position: sticky; bottom: -22px; z-index: 3; background: var(--card); margin: 4px -22px -22px; padding: 12px 22px calc(16px + env(safe-area-inset-bottom)); box-shadow: rgba(0, 0, 0, 0.35) 0px -12px 16px -14px;}
.toast{position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); background: var(--d2); color: rgb(255, 255, 255); padding: 12px 18px; border-radius: 12px; opacity: 0; pointer-events: none; transition: 0.25s; z-index: 60; max-width: calc(-32px + 100vw); text-align: center;}
.toast.show{opacity: 1; transform: translateX(-50%);}
.land{position: fixed; inset: 0px; z-index: 55; overflow: hidden auto; background: rgb(243, 244, 248); color: rgb(18, 20, 36); font-family: inherit; display: flex; flex-direction: column; padding: max(14px,env(safe-area-inset-top)) 22px max(10px,env(safe-area-inset-bottom)); color-scheme: light;}
.lbg{position: fixed; inset: 0px; pointer-events: none; overflow: hidden;}
.lbg i{position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.55;}
.lbg i:first-child{width: 46vmax; height: 46vmax; right: -14vmax; top: -12vmax; background: radial-gradient(circle, rgb(207, 224, 255), transparent 70%);}
.lbg i:last-child{width: 40vmax; height: 40vmax; left: -16vmax; bottom: -18vmax; background: radial-gradient(circle, rgb(229, 220, 255), transparent 70%);}
.lnav{position: relative; z-index: 2; display: flex; align-items: center; gap: 12px; justify-content: space-between;}
.lbrand{display: flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, 0.75); border: 1px solid rgba(20, 24, 60, 0.08); box-shadow: rgba(20, 30, 80, 0.35) 0px 6px 20px -12px; border-radius: 999px; padding: 6px 14px 6px 6px;}
.lbrand img{width: 30px; height: 30px; border-radius: 0px; object-fit: contain; background: transparent;}
.lbrand b{font-size: 15px; font-weight: 700; letter-spacing: -0.2px;}
.lbadge{font-size: 11px; line-height: 1.2; font-weight: 800; color: rgb(255, 255, 255); background: linear-gradient(135deg, rgb(30, 136, 255), rgb(123, 63, 242)); border-radius: 7px; padding: 2px 6px;}
.lnow{display: flex; align-items: center; gap: 8px; background: rgb(17, 19, 34); color: rgb(255, 255, 255); border-radius: 999px; padding: 6px 16px 6px 6px; min-width: 250px; box-shadow: rgba(10, 10, 40, 0.7) 0px 10px 30px -14px;}
.lnow .lnl{width: 26px; height: 26px; border-radius: 50%; background: rgb(255, 255, 255); object-fit: cover;}
.lnow small{font-size: 9.5px; letter-spacing: 0.12em; color: rgb(139, 144, 176);}
.lnow b{font-size: 13px; font-weight: 500; flex: 1 1 0%; transition: opacity 0.3s;}
.lnow .lwv{margin-left: auto;}
.lnr{display: flex; gap: 8px; align-items: center;}
.lsign{height: 42px; border-radius: 999px; padding: 0px 20px; font-size: 12.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; transition: transform 0.15s, box-shadow 0.2s;}
.lsign{background: rgb(17, 19, 34); color: rgb(255, 255, 255); border: 0px; box-shadow: rgba(10, 10, 40, 0.8) 0px 10px 24px -12px;}
.lsign:active,.ls:active{transform: scale(0.97);}
.lhero{overflow-x: clip; position: relative; z-index: 1; flex: 1 1 0%; display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 24px; align-items: center; max-width: 1180px; width: 100%; margin: 0px auto; padding: 20px 0px;}
.lcopy{animation: 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal both running lin; max-width: 560px;}
.leye{font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11.5px; letter-spacing: 0.14em; color: rgb(107, 112, 144); text-transform: uppercase;}
.lcopy h1{font-size: clamp(34px, 4.4vw, 56px); line-height: 1.08; letter-spacing: -1.6px; font-weight: 500; margin: 18px 0px;}
.lcopy h1 em{font-style: normal; background: linear-gradient(90deg, rgb(30, 136, 255), rgb(91, 91, 255), rgb(139, 63, 242), rgb(30, 136, 255)) 0% 0% / 300% 100% text; color: transparent; animation: 8s linear 0s infinite normal none running aush;}
.lcopy p{font-size: 15.5px; line-height: 1.65; color: rgb(79, 84, 108); margin: 0px; max-width: 480px;}
.ls{height: 48px; border-radius: 999px; padding: 0px 20px; font-size: 14px; font-weight: 600; color: rgb(18, 20, 36); background: rgba(255, 255, 255, 0.85); border: 1px solid rgba(20, 24, 60, 0.1); box-shadow: rgba(20, 30, 80, 0.5) 0px 8px 20px -14px; display: inline-flex; align-items: center; gap: 8px; cursor: pointer;}
.lstage{position: relative; aspect-ratio: 1 / 1; width: min(100%, 520px); justify-self: center; animation: 1s cubic-bezier(0.2, 0.8, 0.2, 1) 0.1s 1 normal both running lin;}
.lr1,.lr2{position: absolute; border-radius: 50%; inset: 7%; border: 1px dashed rgba(60, 80, 160, 0.18);}
.lr2{inset: -2%; border-style: solid; border-color: rgba(60, 80, 160, 0.08);}
.ldot{position: absolute; left: 4%; top: 50%; width: 8px; height: 8px; border-radius: 50%; background: rgb(74, 108, 255); box-shadow: rgba(74, 108, 255, 0.15) 0px 0px 0px 6px; animation: 2.4s ease 0s infinite normal none running aupl;}
.lticks{position: absolute; left: 0px; top: 0px; display: block; overflow: visible; animation: 60s linear 0s infinite normal none running lspin; width: 100% !important; height: 100% !important; max-height: none !important;}
.lglass{position: absolute; inset: 26%; border-radius: 50%; padding: 7%; background: radial-gradient(circle, rgba(170, 205, 255, 0.35), rgba(170, 205, 255, 0.1) 70%); box-shadow: rgba(150, 190, 255, 0.18) 0px 0px 0px 10px, rgba(150, 190, 255, 0.08) 0px 0px 0px 22px, rgba(40, 60, 160, 0.5) 0px 30px 60px -20px;}
.lorb{width: 100%; height: 100%; border-radius: 50%; position: relative; overflow: hidden; background: radial-gradient(circle at 35% 30%, rgb(185, 224, 255) 0%, rgb(61, 139, 255) 32%, rgb(74, 59, 216) 66%, rgb(36, 18, 95) 100%); box-shadow: rgba(20, 10, 70, 0.55) -14px -18px 40px inset, rgba(255, 255, 255, 0.35) 10px 12px 30px inset;}
.lorb i{position: absolute; border-radius: 50%; filter: blur(18px); mix-blend-mode: screen; opacity: 0.75;}
.lorb i:nth-child(1){width: 70%; height: 60%; left: -10%; top: 10%; background: rgb(87, 195, 255); animation: 9s ease-in-out 0s infinite alternate none running lblob;}
.lorb i:nth-child(2){width: 60%; height: 60%; right: -15%; bottom: -5%; background: rgb(155, 92, 255); animation: 11s ease-in-out 0s infinite alternate-reverse none running lblob;}
.lorb i:nth-child(3){width: 35%; height: 35%; left: 40%; top: 45%; background: rgb(56, 243, 193); opacity: 0.35; animation: 7s ease-in-out 0s infinite alternate none running lblob;}
.ltry{position: absolute; left: 50%; top: 34%; transform: translateX(-50%); border: 0px; background: linear-gradient(135deg, rgb(30, 136, 255), rgb(123, 63, 242)); color: rgb(255, 255, 255); font-family: ui-monospace, Menlo, monospace; font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; padding: 6px 12px; border-radius: 8px; box-shadow: rgba(60, 60, 200, 0.9) 0px 8px 20px -8px; cursor: pointer; pointer-events: auto; white-space: nowrap;}
.lchip{position: absolute; background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(10px); border-radius: 12px; padding: 8px 12px; box-shadow: rgba(20, 30, 80, 0.45) 0px 12px 30px -16px; max-width: 190px; animation: 6s ease-in-out 0s infinite normal none running lfloat;}
.lchip small{display: block; font-family: ui-monospace, Menlo, monospace; font-size: 9px; letter-spacing: 0.12em; color: rgb(138, 143, 168); text-transform: uppercase;}
.lchip b{display: block; font-size: 12.5px; font-weight: 500; line-height: 1.35; margin-top: 2px;}
.lchip.c1{left: 2%; top: 4%;}
.lchip.c2{right: -2%; top: 12%; animation-delay: -2s;}
.lchip.c3{right: 0px; bottom: 12%; animation-delay: -4s;}
.lhi{position: absolute; left: 50%; bottom: 2%; transform: translateX(-50%); display: flex; align-items: center; gap: 8px; background: rgb(17, 19, 34); color: rgb(255, 255, 255); border-radius: 999px; padding: 8px 16px; font-family: ui-monospace, Menlo, monospace; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap; box-shadow: rgba(10, 10, 40, 0.8) 0px 10px 24px -12px;}
.lwv{display: inline-flex; align-items: center; gap: 2px; height: 14px;}
.lwv i{width: 2.5px; height: 100%; border-radius: 2px; background: currentcolor; animation: 1s ease-in-out 0s infinite normal none running lwave;}
.lwv i:nth-child(2){animation-delay: -0.2s;}
.lwv i:nth-child(3){animation-delay: -0.4s;}
.lwv i:nth-child(4){animation-delay: -0.6s;}
.ltick{position: relative; z-index: 1; overflow: hidden; border-top: 1px solid rgba(20, 24, 60, 0.08); padding: 14px 0px 4px; mask-image: linear-gradient(90deg, transparent, rgb(0, 0, 0) 8%, rgb(0, 0, 0) 92%, transparent);}
.ltrack{display: flex; gap: 44px; width: max-content; animation: 38s linear 0s infinite normal none running lmarq;}
.ltrack span{display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; color: rgb(79, 84, 108); white-space: nowrap;}
.ltrack span::before{content: ""; width: 6px; height: 6px; border-radius: 50%; background: linear-gradient(135deg, rgb(30, 136, 255), rgb(123, 63, 242));}
@media (max-width: 900px){
.lhero{grid-template-columns: minmax(0px, 1fr); text-align: center; gap: 8px; padding-top: 10px;}
.lcopy{max-width: none; margin: 0px auto;}
.lcopy p{margin: 0px auto;}
.lstage{width: min(100%, 420px); order: -1;}
.lnow{min-width: 0px;}
.lchip{max-width: 150px;}
.lchip.c2{right: 0px;}
}
@media (max-width: 640px){
.land{padding-left: 14px; padding-right: 14px;}
.lnow{display: none;}
.lsign{height: 38px; padding: 0px 16px; font-size: 11.5px;}
.lcopy h1{font-size: 32px; letter-spacing: -1px; margin: 12px 0px;}
.lcopy p{font-size: 14.5px;}
.lstage{width: min(100%, 340px);}
.lchip{padding: 6px 9px; max-width: 128px;}
.lchip b{font-size: 11px;}
.lhero{padding-top: 34px;}
.lchip.c1{left: -2%; top: 2%;}
.lchip.c3{bottom: 16%;}
.lhi{font-size: 10px; padding: 7px 12px;}
.ls{height: 46px;}
}
.aubg{background: radial-gradient(120% 90% at 10% 0%, rgb(28, 58, 168) 0%, rgb(13, 18, 64) 55%, rgb(7, 10, 36) 100%) !important;}
.aubg .o1{background: rgb(47, 123, 255) !important;}
.aubg .o2{background: rgb(139, 63, 242) !important; opacity: 0.5 !important;}
.aubg .o3{background: rgb(24, 180, 255) !important;}
.aubg .o4{background: rgb(192, 75, 255) !important;}
.auhero h1 em{background-image: linear-gradient(90deg, rgb(143, 208, 255), rgb(185, 164, 255), rgb(124, 200, 255), rgb(143, 208, 255)) !important;}
.auchips span svg{stroke: rgb(159, 208, 255) !important;}
.auth .augo{background: linear-gradient(135deg, rgb(30, 107, 255), rgb(123, 63, 242)) !important; box-shadow: rgba(80, 90, 255, 0.8) 0px 14px 30px -12px !important;}
.auth .auin input:focus{border-color: rgb(61, 123, 255) !important; box-shadow: rgba(61, 123, 255, 0.16) 0px 0px 0px 4px !important;}
.auin:focus-within > svg{stroke: rgb(61, 123, 255) !important;}
.augreet{color: rgb(61, 107, 255) !important;}
.augreet::before{background: rgb(61, 107, 255) !important;}
.aueye.on{color: rgb(61, 107, 255) !important;}
.auth .box::before{background: linear-gradient(140deg, rgba(130, 180, 255, 0.95), rgba(255, 255, 255, 0.1) 40%, rgba(170, 120, 255, 0.85)) !important;}
.auth .brand .logo{background: transparent;}
.auback{justify-self: start; border: 0px; background: none; color: rgb(91, 97, 128); font-weight: 600; font-size: 13px; padding: 0px; margin: -6px 0px -4px; cursor: pointer;}
.neg{color: var(--red);}
.pos{color: var(--pos);}
@media (max-width: 640px){
.aichat{height: calc(100dvh - 290px); min-height: 420px;}
}
.splash{position: fixed; inset: 0px; z-index: 70; display: grid; place-items: center; background: rgb(7, 10, 36); color: rgb(255, 255, 255); transition: opacity 0.45s, transform 0.45s; overflow: hidden;}
.splash.out{opacity: 0; transform: scale(1.04); pointer-events: none;}
.spbg{position: absolute; inset: 0px; pointer-events: none;}
.spbg i{position: absolute; border-radius: 50%; filter: blur(70px); opacity: 0.6; animation: 12s ease-in-out 0s infinite alternate none running auf;}
.spbg i:nth-child(1){width: 60vmax; height: 60vmax; left: -20vmax; top: -25vmax; background: rgb(47, 107, 255);}
.spbg i:nth-child(2){width: 50vmax; height: 50vmax; right: -18vmax; bottom: -20vmax; background: rgb(139, 63, 242); animation-delay: -4s;}
.spbg i:nth-child(3){width: 28vmax; height: 28vmax; left: 40%; top: 55%; background: rgb(24, 180, 255); opacity: 0.35; animation-delay: -8s;}
.spc{position: relative; display: grid; justify-items: center; gap: 14px; text-align: center; animation: 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal both running lin;}
.splogo{position: relative; width: 112px; height: 112px; display: grid; place-items: center; margin-bottom: 6px;}
.splogo img{width: 76px; height: 76px; border-radius: 22px; background: rgb(255, 255, 255); box-shadow: rgba(30, 60, 255, 0.8) 0px 18px 40px -12px; animation: 2.4s ease-in-out 0s infinite normal none running sppulse; position: relative; z-index: 1;}
.spring{position: absolute; inset: 0px; border-radius: 50%; background: conic-gradient(transparent 0deg, transparent 55%, rgb(90, 168, 255) 75%, rgb(164, 107, 255) 92%, transparent); mask: radial-gradient(farthest-side, transparent calc(100% - 3px), rgb(0, 0, 0) calc(100% - 2px)); animation: 1.4s linear 0s infinite normal none running lspin;}
.spring.r2{inset: -12px; opacity: 0.45; animation-duration: 2.6s; animation-direction: reverse;}
.spname{font-size: 22px; font-weight: 700; letter-spacing: -0.4px;}
.spname span{font-size: 12px; font-weight: 800; background: linear-gradient(135deg, rgb(30, 136, 255), rgb(123, 63, 242)); border-radius: 7px; padding: 2px 6px; vertical-align: 3px; margin-left: 4px;}
.sphi{font-size: 15px; color: rgba(255, 255, 255, 0.8);}
.spstep{height: 18px; overflow: hidden; font-size: 12.5px; color: rgb(159, 194, 255); letter-spacing: 0.02em;}
.spstep span{display: inline-block; animation: 0.4s ease 0s 1 normal both running spin2;}
.spbar{width: 180px; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, 0.12); overflow: hidden; margin-top: 4px;}
.spbar i{display: block; height: 100%; width: 45%; border-radius: 3px; background: linear-gradient(90deg, rgb(79, 155, 255), rgb(164, 107, 255)); animation: 1.1s ease-in-out 0s infinite normal none running aulo;}
.auth{position: fixed; inset: 0px; z-index: 50; background: rgb(6, 40, 26); display: grid; place-items: center; padding-right: 20px; padding-left: 20px; padding-top: max(20px,env(safe-area-inset-top)); padding-bottom: max(20px,env(safe-area-inset-bottom)); overflow: auto; color-scheme: light;}
.aubg{position: fixed; inset: 0px; overflow: hidden; background: radial-gradient(120% 90% at 10% 0%, rgb(15, 90, 55) 0%, rgb(6, 40, 26) 55%, rgb(4, 20, 14) 100%);}
.aubg i{position: absolute; border-radius: 50%; filter: blur(60px); opacity: 0.75; animation: 16s ease-in-out 0s infinite alternate none running auf;}
.aubg .o1{width: 46vmax; height: 46vmax; left: -12vmax; top: -14vmax; background: rgb(31, 191, 106);}
.aubg .o2{width: 38vmax; height: 38vmax; right: -10vmax; top: 8vh; background: rgb(22, 119, 255); opacity: 0.45; animation-duration: 19s; animation-delay: -5s;}
.aubg .o3{width: 34vmax; height: 34vmax; left: 28vw; bottom: -18vmax; background: rgb(0, 194, 168); opacity: 0.5; animation-duration: 22s; animation-delay: -9s;}
.aubg .o4{width: 18vmax; height: 18vmax; right: 22vw; bottom: 10vh; background: rgb(245, 200, 76); opacity: 0.28; animation-duration: 14s; animation-delay: -3s;}
.augrid{position: absolute; inset: 0px; background-image: linear-gradient(rgba(255, 255, 255, 0.043) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.043) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(at 50% 40%, rgb(0, 0, 0) 20%, transparent 75%);}
.auwrap{position: relative; z-index: 1; width: min(1040px, 100%); display: grid; grid-template-columns: minmax(0px, 1.1fr) minmax(0px, 420px); gap: 56px; align-items: center;}
.auhero{color: rgb(255, 255, 255); animation: 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal both running auin;}
.aulogo{width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center; background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.25); backdrop-filter: blur(10px); box-shadow: rgba(0, 0, 0, 0.5) 0px 10px 30px -10px;}
.aulogo{overflow: hidden; background: transparent !important;}
.aulogo img{width: 100%; height: 100%; object-fit: cover;}
.auhero h1{font-size: clamp(34px, 4.6vw, 54px); line-height: 1.04; letter-spacing: -1.6px; margin: 22px 0px 14px; font-weight: 600;}
.auhero h1 em{font-style: normal; background: linear-gradient(90deg, rgb(127, 242, 176), rgb(124, 200, 255), rgb(255, 224, 138), rgb(127, 242, 176)) 0% 0% / 300% 100% text; color: transparent; animation: 8s linear 0s infinite normal none running aush;}
.auhero p{color: rgba(255, 255, 255, 0.72); font-size: 15px; line-height: 1.6; max-width: 440px; margin: 0px;}
.auchips{display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px;}
.auchips span{display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 500; color: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); animation: 5s ease-in-out 0s infinite normal none running aubob;}
.auchips span svg{width: 15px; height: 15px; stroke: rgb(127, 242, 176);}
.auchips .c2{animation-delay: -1.6s;}
.auchips .c3{animation-delay: -3.2s;}
.auth .box{position: relative; background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(24px) saturate(1.4); border: 1px solid rgba(255, 255, 255, 0.6); border-radius: 30px; padding: 30px; width: 100%; box-shadow: rgba(0, 0, 0, 0.55) 0px 30px 80px -20px, rgba(255, 255, 255, 0.08) 0px 0px 0px 1px; display: grid; gap: 14px; animation: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.12s 1 normal both running auin; --card: #fff; --ink: #141a17; --ink2: #3b4a44; --mut: #7a827e; --bd: #dfe4e1;}
.auth .box::before{content: ""; position: absolute; inset: -1px; border-radius: 31px; padding: 1px; background: linear-gradient(140deg, rgba(127, 242, 176, 0.9), rgba(255, 255, 255, 0.1) 40%, rgba(124, 200, 255, 0.8)); mask: linear-gradient(rgb(0, 0, 0) 0px, rgb(0, 0, 0) 0px) content-box exclude, linear-gradient(rgb(0, 0, 0) 0px, rgb(0, 0, 0) 0px); pointer-events: none;}
.augreet{display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgb(23, 163, 90);}
.augreet::before{content: ""; width: 7px; height: 7px; border-radius: 50%; background: rgb(23, 163, 90); box-shadow: rgba(23, 163, 90, 0.6) 0px 0px 0px 0px; animation: 2s ease 0s infinite normal none running aupl;}
.aufields{display: grid; gap: 14px; margin-top: 16px;}
.auin{position: relative; display: block;}
.auin > svg{position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; stroke: rgb(154, 160, 157); pointer-events: none; transition: stroke 0.2s;}
.auth .auin input{height: 52px; padding-left: 44px; border-radius: 14px; background: rgb(244, 247, 245); border: 1.5px solid transparent; transition: border-color 0.2s, box-shadow 0.2s, background 0.2s; font-weight: 500;}
.auth .auin input:focus{outline: none; background: rgb(255, 255, 255); border-color: rgb(23, 163, 90); box-shadow: rgba(23, 163, 90, 0.14) 0px 0px 0px 4px;}
.auin:focus-within > svg{stroke: rgb(23, 163, 90);}
.aueye{position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border: 0px; background: none; border-radius: 10px; display: grid; place-items: center; color: rgb(154, 160, 157);}
.aueye svg{width: 19px; height: 19px;}
.aueye.on{color: rgb(23, 163, 90);}
.auth .augo{height: 52px; border-radius: 14px; font-size: 15px; font-weight: 600; background: linear-gradient(135deg, rgb(12, 75, 45), rgb(23, 163, 90)); border: 0px; color: rgb(255, 255, 255); position: relative; overflow: hidden; box-shadow: rgba(23, 163, 90, 0.8) 0px 14px 30px -12px; transition: transform 0.15s, box-shadow 0.2s;}
.auth .augo::after{content: ""; position: absolute; top: 0px; left: -60%; width: 45%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent); transform: skewX(-20deg); animation: 3.6s ease-in-out 0s infinite normal none running aushine;}
.auth .augo:active{transform: scale(0.98);}
.auth .augo:disabled{opacity: 0.75;}
.ausafe{display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 14px; font-size: 11px; color: rgb(138, 145, 141);}
.ausafe svg{width: 13px; height: 13px; stroke: currentcolor;}
@media (max-width: 860px){
.auwrap{grid-template-columns: minmax(0px, 1fr); gap: 22px; max-width: 440px;}
.auhero{text-align: center;}
.auhero .aulogo{margin: 0px auto 14px; width: 52px; height: 52px;}
.auhero p,.auchips{display: none;}
.auhero h1{font-size: 30px; margin: 0px; letter-spacing: -1px;}
.auth{place-items: center;}
}
@media (max-width: 860px) and (max-height: 700px){
.auhero{display: none;}
}
:root[data-mode="dark"] .auth .box{background: rgba(22, 26, 24, 0.86); border-color: rgba(255, 255, 255, 0.1); --card: #1c211e; --ink: #eef2ef; --ink2: #cfd6d2; --mut: #98a19c; --bd: #2c332f;}
:root[data-mode="dark"] .auth .auin input{background: rgb(17, 21, 19); color: rgb(238, 242, 239);}
:root[data-mode="dark"] .auth .auin input:focus{background: rgb(22, 27, 24);}
.auth .brand{padding: 0px;}
.auth h2{margin: 6px 0px 0px; font-size: 24px; font-weight: 500; letter-spacing: -0.5px;}
.auth p{margin: 0px; color: var(--mut); font-size: 13px;}
.auth .err{color: var(--red); font-size: 12.5px; min-height: 16px;}
.auth .btn{width: 100%; justify-content: center; height: 46px;}
.auth .link{border: 0px; background: none; color: var(--g2); font-weight: 600; font-size: 13px; height: 40px;}
@media (max-width: 1100px){
.shell{margin: 4px auto; padding: 6px; grid-template-columns: 182px minmax(0px, 1fr); gap: 6px; min-height: calc(100dvh - 8px); border-radius: 22px;}
.side{top: 10px; height: calc(100dvh - 20px); padding: 14px 10px;}
.content{padding: 12px;}
.user > div:nth-child(2){display: none;}
h1{font-size: 30px;}
.stats{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
@container panel (max-width: 1000px){
.col-source,.col-type,.col-acct,.col-more{display: none;}
.sub{display: block; color: rgb(163, 169, 165); font-size: 11px; margin-top: 1px;}
table{min-width: 0px;}
th,td{padding: 0px 8px;}
td.chk,th.chk{width: 38px; padding-left: 6px;}
.tag.st{padding: 0px 10px;}
}
@container panel (max-width: 700px){
th,td{padding: 0px 6px;}
.desc{min-width: 100px;}
.tag.st svg{display: none;}
.sel{flex: 1 1 130px;}
}
@media (max-width: 640px){
.shell{margin: 0px auto; border-radius: 0px; padding: 6px; grid-template-columns: minmax(0px, 1fr);}
.side{position: fixed; inset: auto 8px 8px; height: 62px; flex-direction: row; padding: 4px 6px; z-index: 30; overflow-x: auto; justify-content: flex-start; border-radius: 20px; box-shadow: rgba(0, 0, 0, 0.12) 0px 8px 30px;}
.brand,.side .sep,.sec{display: none;}
.nav{min-width: 60px; height: 52px; flex-direction: column; justify-content: center; gap: 3px; padding: 0px; text-align: center; width: auto;}
.nav.on::before{display: none;}
.nav span{font-size: 9.5px; font-weight: 600; line-height: 1; display: block;}
.shell{padding-bottom: 84px;}
.stat{padding: 12px; gap: 8px;}
.stat .ic{width: 32px; height: 32px;}
.stat .ic svg{width: 16px; height: 16px;}
.stat b{font-size: 17px;}
.stat .d{font-size: 10.5px;}
.top{padding: 8px 10px; gap: 8px;}
.gsearch{width: auto; flex: 1 1 0%; min-width: 0px;}
.sp{display: none;}
.rb{width: 38px; height: 38px;}
.avatar{width: 38px; height: 38px;}
}
.bacc{display: flex; align-items: center; gap: 5px; color: var(--mut2) !important;}
.bacc svg{width: 12px; height: 12px; fill: none; stroke: currentcolor; stroke-width: 2;}
.bacc.off{color: var(--amber) !important;}
@media (min-width: 641px){
html,body{height: 100%; overflow: hidden; overscroll-behavior: none;}
.shell{height: calc(100dvh - 12px); min-height: 0px; overflow: hidden;}
.col{height: 100%; min-height: 0px;}
.top{flex: 0 0 auto; position: relative; z-index: 3; transition: box-shadow 0.25s;}
.top.sh{box-shadow: rgba(0, 0, 0, 0.09) 0px 8px 22px;}
.side{position: relative; top: auto; height: 100%;}
.content{min-height: 0px; overflow: hidden auto; overscroll-behavior-y: contain; scrollbar-width: none;}
.content::-webkit-scrollbar{display: none;}
}
@media (min-width: 641px) and (max-width: 1100px){
.shell{height: calc(100dvh - 8px);}
}
.gi{display: flex; gap: 10px; align-items: flex-start; background: var(--card); border-radius: 12px; padding: 9px 11px;}
.gi i{width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; flex: 0 0 auto; background: var(--amber);}
.gi.err i{background: var(--red);}
.gi.info i{background: var(--mut);}
.gi .tx{flex: 1 1 0%; min-width: 0px;}
.gi .tx b{display: block; font-size: 13px;}
.gi .tx small{display: block; color: var(--mut); font-size: 11.5px; overflow-wrap: anywhere;}
.gi button{height: 28px; padding: 0px 12px; border-radius: 99px; border: 0px; background: var(--g2); color: rgb(255, 255, 255); font-size: 12px; font-weight: 700; flex: 0 0 auto;}
.orb{position: relative; width: 18px; height: 18px; border-radius: 50%; flex: 0 0 auto; overflow: hidden; background: rgb(10, 15, 31); box-shadow: rgba(255, 255, 255, 0.55) 0px 0px 0px 1px, rgba(167, 139, 250, 0.55) 0px 0px 7px, rgba(56, 189, 248, 0.3) 0px 0px 12px; animation: 2.6s ease-in-out 0s infinite alternate none running orbglow;}
.orb i{position: absolute; width: 13px; height: 13px; border-radius: 50%; filter: blur(4px); mix-blend-mode: screen; opacity: 0.95;}
.orb i:nth-child(1){background: rgb(244, 114, 182); left: -4px; top: -3px; animation: 2.4s ease-in-out 0s infinite normal none running ob1;}
.orb i:nth-child(2){background: rgb(56, 189, 248); right: -5px; top: 2px; animation: 3s ease-in-out 0s infinite normal none running ob2;}
.orb i:nth-child(3){background: rgb(167, 139, 250); left: 3px; bottom: -6px; animation: 2.8s ease-in-out 0s infinite normal none running ob3;}
.orb::after{content: ""; position: absolute; inset: 0px; border-radius: 50%; background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.55), transparent 45%); pointer-events: none;}
@media (max-width: 640px){
.orb{width: 17px; height: 17px;}
.top .sig{display: none;}
.gsearch{min-width: 0px; flex: 1 1 40px;}
}
.pill.ico{width: 42px; padding: 0px; justify-content: center; gap: 0px;}
.pill.ico[hidden]{display: none;}
.siri{display: inline-flex; align-items: center; gap: 2px; height: 18px; flex: 0 0 auto;}
.siri i{width: 3px; height: 6px; border-radius: 3px; background: linear-gradient(rgb(56, 189, 248), rgb(52, 211, 153)); animation: 1.5s ease-in-out 0s infinite normal none running sbar;}
.siri i:nth-child(2){animation-delay: 0.18s;}
.siri i:nth-child(3){animation-delay: 0.36s;}
.siri i:nth-child(4){animation-delay: 0.54s;}
.sync .siri i{animation-duration: 0.5s;}
.siri.off i{animation: auto ease 0s 1 normal none running none; height: 6px; background: var(--mut);}
.fx{position: relative; overflow: hidden; isolation: isolate;}
.fx::before{content: ""; position: absolute; inset: -40%; z-index: -1; pointer-events: none; opacity: 0.5; background: radial-gradient(circle at 20% 30%,rgba(var(--glow),.16),transparent 38%),radial-gradient(circle at 80% 70%,rgba(167,139,250,.14),transparent 40%); animation: 14s ease-in-out 0s infinite alternate none running aur;}
body{user-select: none;}
input,textarea,select{user-select: text;}
.side,.content,dialog{overscroll-behavior: contain;}
button,.nav,.li,.chip,.tab,.pill,.rb,.ac{transition: transform 0.32s cubic-bezier(0.2, 1.1, 0.3, 1.2), background-color 0.2s, box-shadow 0.25s, opacity 0.2s;}
button:active:not(:disabled),.li:active,.ac:active{transform: scale(0.95);}
.nav:active{transform: scale(0.96);}
.view:not([hidden]){animation: 0.42s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal none running vin;}
dialog[open]{animation: 0.36s cubic-bezier(0.2, 1.15, 0.3, 1) 0s 1 normal none running dpop;}
dialog::backdrop{background: rgba(10, 30, 20, 0.38); backdrop-filter: blur(8px);}
@media (pointer: coarse){
.nav{height: 48px;}
.btn,.pill,.mini,.chip,.tab{min-height: 44px;}
.rb{width: 46px; height: 46px;}
}
@media (prefers-reduced-motion: reduce){
*,::before,::after{animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important;}
}
dialog#gePurch{border: 0px; border-radius: 28px; padding: 0px; width: min(470px, -24px + 100vw); background: var(--card); color: var(--ink); box-shadow: rgba(10, 20, 15, 0.35) 0px 24px 70px; max-height: var(--gepH,calc(100dvh - 24px)); overflow: auto;}
dialog#gePurch.kb{position: fixed; top: var(--gepT,5px); bottom: auto; left: 0px; right: 0px; margin: 0px auto; border-radius: 22px;}
.gep-cols,.gep-l,.gep-r{display: grid; gap: 14px; min-width: 0px;}
.gep-packline{display: flex; justify-content: space-between; align-items: center; gap: 10px; background: var(--soft); border-radius: 14px; padding: 11px 14px; font-size: 16px;}
.gep-packline button{border: 0px; background: none; color: var(--g2); font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 700; cursor: pointer; padding: 6px 4px;}
dialog#gePurch::backdrop{background: rgba(10, 20, 15, 0.45);}
.gep{padding: 10px 22px 22px; display: grid; gap: 14px;}
.gep-grab{width: 56px; height: 5px; border-radius: 3px; background: var(--bd); justify-self: center; margin-bottom: 2px;}
.gep-head{display: flex; align-items: center; gap: 14px;}
.gep-ic{width: 58px; height: 58px; border-radius: 17px; background: var(--gsoft); display: grid; place-items: center; font-size: 28px; overflow: hidden; flex: 0 0 auto;}
.gep-ic img{width: 100%; height: 100%; object-fit: cover; display: block;}
.gep-head h2{margin: 0px; font-size: 24px; line-height: 1.15;}
.gep-head p{margin: 2px 0px 0px; color: var(--mut2); font-size: 16px;}
.gep-x{margin-left: auto; border: 0px; background: none; font-size: 32px; line-height: 1; color: var(--ink); width: 46px; height: 46px; border-radius: 50%; cursor: pointer;}
.gep label{display: grid; gap: 7px; font-size: 14.5px; color: var(--mut2);}
.gep input:not([type="checkbox"]),.gep select{height: 56px; border: 1px solid var(--bd); border-radius: 15px; padding: 0px 15px; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 18px; color: var(--ink); background: var(--card); width: 100%; min-width: 0px;}
.gep-row{display: grid; grid-template-columns: 1fr 1fr; gap: 12px;}
.gep-size{display: flex; border: 1px solid var(--bd); border-radius: 15px; overflow: hidden;}
.gep-size input{flex: 1 1 0%; border: 0px !important; border-radius: 0px !important;}
.gep-size select{flex: 0 0 auto; border-top: 0px !important; border-right: 0px !important; border-bottom: 0px !important; border-image: none !important; border-left: 1px solid var(--bd) !important; border-radius: 0px !important; width: 100px !important;}
.gep-step{display: flex; border: 1px solid var(--bd); border-radius: 15px; overflow: hidden;}
.gep-step button{width: 54px; border: 0px; background: none; font-size: 28px; color: var(--ink); cursor: pointer; flex: 0 0 auto;}
.gep-step input{text-align: center; border-top: 0px !important; border-bottom: 0px !important; border-image: none !important; border-radius: 0px !important; padding: 0px 4px !important; border-left: 1px solid var(--bd) !important; border-right: 1px solid var(--bd) !important;}
.gep-tax{margin-top: -8px; color: var(--mut2); font-size: 14px;}
.gep-sum{display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--gsoft2); border-radius: 18px; padding: 16px 18px;}
.gep-sum span{font-size: 17px;}
.gep-sum small{display: block; color: var(--g2); font-size: 14px;}
.gep-sum b{display: block; font-size: 28px; letter-spacing: -0.5px;}
.gep-save{justify-content: space-between; align-items: center; display: flex !important; font-size: 18px !important; color: var(--ink) !important;}
.gep-save input{appearance: none; width: 56px; height: 32px; border-radius: 16px; background: var(--bd); position: relative; cursor: pointer; transition: background 0.2s; border: 0px;}
.gep-save input::after{content: ""; position: absolute; top: 3px; left: 3px; width: 26px; height: 26px; border-radius: 50%; background: rgb(255, 255, 255); transition: transform 0.2s; box-shadow: rgba(0, 0, 0, 0.267) 0px 1px 3px;}
.gep-save input:checked{background: var(--g1);}
.gep-save input:checked::after{transform: translateX(24px);}
.gep-err{margin: -6px 0px; color: var(--red); font-size: 13.5px; min-height: 0px;}
.gep-err:empty{display: none;}
:root[data-mode="dark"] .gep-go{color: rgb(6, 33, 15);}
.gep-go{height: 60px; border: 0px; border-radius: 19px; background: var(--g1); color: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 700; font-size: 19px; cursor: pointer;}
.gep-cancel{border: 0px; background: none; color: var(--g2); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 600; font-size: 17px; height: 44px; cursor: pointer;}
@media (orientation: landscape) and (max-height: 900px){
dialog#gePurch{width: min(900px, 96vw); border-radius: 22px;}
dialog#gePurch.eat{width: min(560px, 96vw);}
.gep{padding: 8px 18px 14px; gap: 10px;}
.gep-grab{display: none;}
.gep-cols{grid-template-columns: 1fr 1fr; gap: 10px 22px; align-items: start;}
.gep-cols.one{grid-template-columns: 1fr;}
.gep-l,.gep-r{gap: 10px;}
.gep-ic{width: 44px; height: 44px; font-size: 22px; border-radius: 13px;}
.gep-head h2{font-size: 20px;}
.gep-head p{font-size: 14px; margin: 0px;}
.gep-x{width: 40px; height: 40px; font-size: 28px;}
.gep input:not([type="checkbox"]),.gep select{height: 46px; font-size: 16px; border-radius: 12px;}
.gep-step button{width: 46px; font-size: 24px;}
.gep label{gap: 5px; font-size: 13.5px;}
.gep-sum{padding: 10px 14px;}
.gep-sum b{font-size: 22px;}
.gep-sum span{font-size: 15px;}
.gep-go{height: 50px; font-size: 17px; border-radius: 15px;}
.gep-cancel{display: none;}
.gep-save{font-size: 16px !important;}
.gep-tax{margin-top: -4px;}
.gep-packline{padding: 8px 12px; font-size: 15px;}
}
@media (max-width: 640px){
dialog#gePurch{margin: auto 0px 0px; width: 100%; max-width: 100%; border-radius: 28px 28px 0px 0px; max-height: 94dvh;}
dialog#gePurch[open]{animation: 0.42s cubic-bezier(0.2, 1.1, 0.3, 1) 0s 1 normal none running mo-sheet;}
dialog#gePurch[open]::backdrop{animation: 0.3s ease 0s 1 normal none running mo-dim;}
}
.ge-page .ge-receipt{padding: 12px 14px; border-radius: 16px; top: 10px; scroll-margin-top: 10px; max-height: calc(100dvh - 100px - var(--skbH,0px)); overflow-y: auto; overscroll-behavior: contain; scroll-padding: 12px;}
@media (max-width: 720px){
.ge-page .ge-receipt{max-height: none; overflow: visible;}
}
.ge-page .ge-receipt-title{margin-bottom: 8px;}
.ge-page .ge-receipt-title h2{font-size: 15px;}
.ge-page .ge-receipt fieldset{gap: 8px;}
.ge-page .ge-receipt .ge-store-logo{width: 34px; height: 34px; border-radius: 10px;}
.ge-page .ge-receipt label{gap: 4px; font-size: 11px;}
.ge-page .ge-receipt input,.ge-page .ge-receipt select{padding: 8px 10px; font-size: 14px; border-radius: 9px; min-height: 38px;}
.ge-page .ge-receipt .ge-link{font-size: 11px; padding: 0px; margin: -4px 0px 0px;}
.ge-page .ge-receipt .row2{display: grid; grid-template-columns: 1.5fr 0.7fr; gap: 8px;}
.ge-page .ge-lines{padding: 6px 0px; max-height: 240px;}
.ge-page .ge-line{padding: 7px 0px; gap: 4px;}
.ge-page .ge-empty{display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; text-align: left; padding: 4px 2px; font-size: 11.5px;}
.ge-page .ge-empty span{grid-row: 1 / span 2; font-size: 24px; margin: 0px;}
.ge-page .ge-empty p{margin: 0px;}
.ge-page .ge-summary{margin-top: 8px;}
.ge-page .ge-summary > b{font-size: 20px;}
.ge-page .ge-summary span{font-size: 13px;}
.ge-page .ge-receipt .ge-note{margin-top: 6px; font-size: 11px; line-height: 1.5;}
.ge-page .ge-save{margin-top: 8px; min-height: 42px;}
.gep-sum .gep-eq{display: block; font-size: 18px; line-height: 1.3; font-weight: 700;}
.gep-sum .gep-ct{display: block; color: var(--mut2); font-size: 13.5px; margin-top: 3px;}
.gep-ct:empty{display: none;}
.gep-tot{text-align: right;}
.gep-l2{min-width: 0px;}
.tl-mut{color: var(--mut2); font-size: 13.5px; margin: 8px 0px 0px;}
.ge-page .ge-who{display: grid; gap: 6px;}
.ge-page .ge-who > small{font-size: 11px; font-weight: 650; color: var(--mut2);}
.ge-page .ge-brand{font-style: normal; font-size: 11px; color: var(--mut2); margin-left: 4px;}
.ge-page .ge-more{border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px;}
.ge-page .ge-more summary{cursor: pointer; font-size: 12px; color: var(--mut2); display: flex; justify-content: space-between; gap: 8px; list-style: none;}
.ge-page .ge-more summary::-webkit-details-marker{display: none;}
.ge-page .ge-more summary i{font-style: normal; color: var(--g2,#1c7c4c); font-weight: 700;}
.ge-page .ge-more[open]{display: grid; gap: 8px;}
.ge-page .ge-save{position: sticky; bottom: 0px; z-index: 3; box-shadow: 0 -8px 14px var(--card,#fff);}
.ge-page .ge-monthly h3{font-size: 14px; margin: 18px 0px 8px;}
.gep-brand-f{display: grid; gap: 4px; font-size: 12px;}
.gep-brand-f input{border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: var(--card); color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 15px; width: 100%; box-sizing: border-box;}
@media (max-width: 759px){
.ge-page .ge-layout{grid-template-columns: minmax(0px, 1fr);}
.ge-page .ge-receipt{position: static; max-height: none; overflow: visible;}
.ge-page .ge-save{bottom: 8px;}
}
.pgbox{background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 14px 16px; margin: 0px 0px 14px;}
.pg-h{display: flex; justify-content: space-between; gap: 12px; align-items: flex-start;}
.pg-h h3{margin: 0px 0px 2px; font-size: 16px;}
.pg-h small{color: var(--mut2); font-size: 12.5px;}
.pg-me{margin-top: 10px; font-size: 13px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap;}
.pg-list{display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-top: 12px;}
.pg-card{border: 1px solid var(--line); border-radius: 14px; padding: 12px; display: grid; gap: 5px;}
.pg-card small{color: var(--mut2);}
.pg-empty{color: var(--mut2); font-size: 13px; margin: 10px 0px 0px;}
.pg-pick{display: grid; gap: 8px;}
.pg-pick .chk{display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px;}
.pg-pick .chk input{width: 20px; height: 20px;}
.ge-page .ge-date{display: grid; gap: 4px;}
.ge-page .ge-date span{font-size: 12px; color: var(--mut2);}
.ge-page .ge-date span b{color: var(--g2,#1c7c4c);}
.ge-suppick{width: 100%; max-width: 290px; border: 3px solid transparent; border-radius: 18px; background: var(--panel); padding: 18px 12px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--ink); font: inherit; min-height: 130px; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 14px;}
.ge-suppick b{font-size: 16px; font-weight: 650;}
.ge-suppick.on{border-color: var(--g2,#1c7c4c); box-shadow: rgba(28, 124, 76, 0.2) 0px 0px 0px 3px;}
.ge-supother{cursor: default;}
.ge-supother input{width: 100%; box-sizing: border-box;}
.ge-superr{color: rgb(179, 38, 30); font-size: 13px; min-height: 16px; margin: 0px;}
.ge-suplogo{position: relative; width: 56px; height: 56px; border-radius: 14px; display: flex; align-items: center; justify-content: center; overflow: hidden; color: rgb(255, 255, 255); font-weight: 700; font-size: 22px;}
.ge-suplogo i{font-style: normal;}
.ge-suplogo img{position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: contain; background: rgb(255, 255, 255); padding: 4px; box-sizing: border-box;}
.ge-accdlg{padding: 20px; flex-direction: column; gap: 12px; max-height: calc(100dvh - 24px); display: flex !important;}
.ge-accdlg .ge-acclist{flex: 1 1 auto; min-height: 0px;}
.ge-acclist{display: grid; gap: 10px; max-height: 60vh; overflow: auto;}
@media (min-width: 760px){
.ge-page .ge-layout{height: calc(100dvh - 235px - var(--skbH,0px)); min-height: 430px; align-items: stretch;}
.ge-page .ge-products{overflow-y: auto; padding: 0px 8px 12px 0px; overscroll-behavior: contain;}
.ge-page .ge-receipt{position: static; max-height: 100%; overflow-y: auto; overscroll-behavior: contain;}
}
.ge-page .ge-receipt{display: flex; flex-direction: column; overflow: hidden;}
.ge-page .ge-bill-body{flex: 1 1 0%; min-height: 0px; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 6px;}
.ge-page .ge-bill-foot{flex: 0 0 auto; border-top: 1px solid var(--line); padding-top: 8px; background: var(--card);}
.ge-page .ge-save{position: static; box-shadow: none;}
.ge-page .ge-receipt-title span{display: flex; gap: 4px; align-items: center; flex-wrap: wrap; justify-content: flex-end;}
@media (min-width: 760px){
.ge-page .ge-layout.big{grid-template-columns: minmax(0px, 1fr) 540px;}
}
@media (max-width: 759px){
.ge-page .ge-receipt{max-height: none; overflow: visible;}
.ge-page .ge-bill-body{overflow: visible;}
.ge-page .ge-receipt.up{position: fixed; inset: 0px; z-index: 70; border-radius: 0px; max-height: none; height: 100dvh; overflow: hidden; padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); background: var(--card);}
.ge-page .ge-receipt.up .ge-bill-body{overflow-y: auto;}
}
#insDlg:has(.ge-accdlg){width: min(820px, -24px + 100vw);}
.ge-acclist{display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 225px), 1fr)); gap: 14px; overflow: auto; padding: 4px; align-content: start; justify-items: center;}
#insDlg:has(.ge-whodlg){width: min(520px, -24px + 100vw);}
.ge-whoav{border-radius: 50%;}
.ge-whoav img{background: none; object-fit: cover;}
#insDlg:has(.ge-flow){width: min(720px, -24px + 100vw); height: min(540px, 100dvh - 24px); animation: 0.2s ease 0s 1 normal none running geDlgIn;}
.ge-flow{box-sizing: border-box; height: 100%; flex-direction: column; gap: 12px; padding: 20px; animation: 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal none running geFlowIn; display: flex !important;}
.ge-flow h2{margin: 0px;}
.ge-flow .ge-acclist{flex: 1 1 auto; min-height: 0px; max-height: none; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 12px;}
.ge-flow .ge-suppick{max-width: 200px; min-height: 92px; padding: 12px 10px; gap: 6px; border-radius: 16px;}
.ge-flow .ge-suppick b{font-size: 14px;}
.ge-flow .ge-suplogo{width: 40px; height: 40px; border-radius: 11px; font-size: 17px;}
.ge-flow .actions{margin-top: auto; flex: 0 0 auto;}
.ge-billask{justify-content: center; align-items: center; text-align: center;}
.ge-billask .actions{margin-top: 10px; justify-content: center;}
.ge-spin{width: 34px; height: 34px; border-radius: 50%; border-width: 4px; border-style: solid; border-right-color: rgba(136, 136, 136, 0.267); border-bottom-color: rgba(136, 136, 136, 0.267); border-left-color: rgba(136, 136, 136, 0.267); border-image: none; border-top-color: var(--g2,#1c7c4c); animation: 0.8s linear 0s infinite normal none running geSpin;}
@media (prefers-reduced-motion: reduce){
.ge-flow,#insDlg:has(.ge-flow){animation: auto ease 0s 1 normal none running none;}
.ge-spin{animation-duration: 2s;}
}
#insDlg:has(.ge-inv){width: min(620px, -24px + 100vw);}
.ge-inv{padding: 0px 0px 18px; display: grid; gap: 12px; max-height: calc(100dvh - 24px); overflow: auto;}
.ge-inv > h2,.ge-inv > p,.ge-inv > .actions{margin-left: 20px; margin-right: 20px;}
.ge-inv h2{margin-top: 6px; font-size: 22px;}
.ge-inv > .actions{display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding-bottom: 2px;}
.ge-page .ge-bill-body{display: flex; flex-direction: column; overflow: hidden;}
.ge-page .ge-bill-body > fieldset{flex: 1 1 auto; min-height: 0px; min-width: 0px; display: flex; flex-direction: column; padding: 0px; margin: 0px; border: 0px;}
.ge-page .ge-fs{display: flex; flex-direction: column; gap: 8px; min-height: 0px; flex: 1 1 auto;}
.ge-page .ge-fs > *{flex: 0 0 auto;}
.ge-page .ge-fs > .ge-lines{flex: 1 1 auto; min-height: 92px; overflow-y: auto; overscroll-behavior: contain; align-content: start;}
.ge-page .ge-date{display: flex; gap: 8px; align-items: flex-end;}
.ge-page .ge-date label{flex: 1 1 0%;}
.ge-page .ge-date span{white-space: nowrap; padding-bottom: 11px;}
.ge-page .ge-who > small{display: none;}
.ge-page .ge-receipt{padding: 10px 12px;}
.ge-page .ge-line{display: grid; grid-template-columns: minmax(0px, 1fr) auto; align-items: center; gap: 1px 8px; padding: 6px 0px;}
.ge-page .ge-line > div{grid-column: 1 / -1; display: flex; gap: 8px; align-items: center;}
.ge-page .ge-line > div b{flex: 1 1 0%; min-width: 0px;}
.ge-page .ge-line small{grid-column: 1; min-width: 0px; font-size: 11px;}
.ge-page .ge-line strong{grid-area: 2 / 2; text-align: right; font-size: 14px;}
@media (max-height: 720px){
.ge-page .ge-bill-body{overflow-y: auto;}
.ge-page .ge-fs > .ge-lines{flex: 0 0 auto; max-height: none; overflow: visible;}
}
@media (min-width: 760px){
.ge-page .ge-layout{height: calc(100dvh - 118px - var(--skbH,0px)); min-height: 480px;}
.ge-page .ge-layout.big{height: calc(100dvh - 110px - var(--skbH,0px));}
.ge-page .head p,.ge-page .ge-kicker{display: none;}
}
@media (max-width: 759px){
.ge-page .ge-receipt.up .ge-bill-body{overflow: hidden;}
.ge-page .ge-receipt.up .ge-fs > .ge-lines{flex: 1 1 auto; overflow-y: auto;}
}
@media (max-width: 700px){
.top{flex-wrap: wrap; display: flex !important; gap: 6px !important; padding: 8px !important;}
.top > *{grid-area: auto !important;}
.top .gsearch{min-width: 0px; flex: 1 1 calc(100% - 112px) !important;}
.top .rb,.top .apwrap{flex: 0 0 44px !important; width: 44px !important;}
.top .apwrap .rb{width: 44px !important;}
.top #btnCur{flex: 1 1 56px !important; width: auto !important;}
.top #btnBell{flex: 1 1 44px !important; width: auto !important;}
.side .nav[data-view="grocery"]{order: -1;}
.ge-page .head{margin-bottom: 6px; gap: 8px;}
.ge-page .head p,.ge-page .ge-kicker{display: none;}
.ge-page .head h1{font-size: 24px; margin: 0px;}
.ge-page .head .actions{display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; scrollbar-width: none; max-width: 100%;}
.ge-page .head .actions::-webkit-scrollbar{display: none;}
.ge-page .head .actions .btn,.ge-page .head .actions .ge-settings-icon{flex: 0 0 auto; padding: 8px 12px; font-size: 13px; white-space: nowrap;}
.ge-page .head .actions [data-go="shopplan"]{display: none;}
.ge-search{margin-bottom: 8px; gap: 8px;}
.ge-search .btn{padding: 10px 12px; font-size: 13px; white-space: nowrap;}
.ge-search input{padding: 11px;}
.ge-categories{flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 10px;}
.ge-categories::-webkit-scrollbar{display: none;}
.ge-categories .btn{flex: 0 0 auto; padding: 8px 14px; font-size: 14px;}
.ge-grid{gap: 10px;}
.ge-product{padding: 8px;}
.ge-picture{min-height: 84px; font-size: 38px;}
.ge-product > b{font-size: 15px;}
.ge-page{padding-bottom: 160px;}
}
.ge-page .ge-grid{overflow-y: scroll; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgb(28, 124, 76) rgba(0, 0, 0, 0.1); padding-right: 6px;}
.ge-page .ge-grid::-webkit-scrollbar{width: 10px;}
.ge-page .ge-grid::-webkit-scrollbar-track{background: rgba(0, 0, 0, 0.1); border-radius: 8px;}
.ge-page .ge-grid::-webkit-scrollbar-thumb{background: padding-box rgb(28, 124, 76); border-radius: 8px; border: 2px solid transparent;}
@media (min-width: 760px){
.ge-page .ge-products{overflow: hidden; display: flex; flex-direction: column; padding: 0px;}
.ge-page .ge-products > .ge-search,.ge-page .ge-products > .ge-categories{flex: 0 0 auto;}
.ge-page .ge-products > .ge-grid{flex: 1 1 auto; min-height: 0px;}
}
@media (min-width: 760px){
body:has(#view-grocery:not([hidden])) .content{overflow: hidden;}
}
.view:not([hidden])[data-mo="done"]{animation: auto ease 0s 1 normal none running none;}
.view:not([hidden])[data-mo="rise"]{animation: 0.32s cubic-bezier(0.22, 0.8, 0.3, 1) 0s 1 normal none running mo-rise;}
.view:not([hidden])[data-mo="push"]{animation: 0.34s cubic-bezier(0.22, 0.8, 0.3, 1) 0s 1 normal none running mo-push;}
.view:not([hidden])[data-mo="back"]{animation: 0.34s cubic-bezier(0.22, 0.8, 0.3, 1) 0s 1 normal none running mo-back;}
.view:not([hidden])[data-mo="zoom"]{animation: 0.34s cubic-bezier(0.22, 0.8, 0.3, 1) 0s 1 normal none running mo-zoom; transform-origin: var(--mox,50%) var(--moy,30%);}
.view:not([hidden])[data-mo="flip"]{animation: 0.4s cubic-bezier(0.2, 0.9, 0.3, 1) 0s 1 normal none running mo-flip; transform-origin: 50% 0px;}
@media (max-width: 640px){
dialog#dlg[open]{animation: 0.42s cubic-bezier(0.2, 1.1, 0.3, 1) 0s 1 normal none running mo-lift;}
dialog#dlg[open]::backdrop{animation: 0.3s ease 0s 1 normal none running mo-dim;}
}
html[data-motion="off"] .view,html[data-motion="off"] dialog[open],html[data-motion="off"] dialog[open]::backdrop{animation: auto ease 0s 1 normal none running none !important;}
@media (prefers-reduced-motion: reduce){
.view[data-mo]{animation: auto ease 0s 1 normal none running none !important;}
dialog#dlg[open],dialog#dlg[open]::backdrop{animation: auto ease 0s 1 normal none running none !important;}
}
.aichat{background: var(--card); border-radius: 22px; display: flex; flex-direction: column; height: calc(100dvh - 215px); min-height: 440px; overflow: hidden; min-width: 0px;}
.seg{display: inline-flex; background: var(--soft); border-radius: 999px; padding: 3px;}
.seg button{border: 0px; background: none; height: 34px; padding: 0px 13px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--mut2);}
.seg button.on{background: var(--g1); color: rgb(255, 255, 255);}
.mode{margin-left: auto; font-size: 11px; font-weight: 600; padding: 5px 10px; border-radius: 999px; background: var(--soft); color: var(--mut2);}
.mode.full{background: var(--possoft); color: var(--pos);}
.m{display: flex; gap: 8px; max-width: 90%; animation: 0.3s cubic-bezier(0.2, 0.9, 0.3, 1.2) 0s 1 normal none running min;}
.m.user{align-self: flex-end; flex-direction: row-reverse;}
.m .b{padding: 10px 13px; border-radius: 18px; background: var(--soft); line-height: 1.45; font-size: 14px; word-break: break-word; min-width: 0px;}
.m.assistant .b{border-bottom-left-radius: 6px;}
.m.user .b{background: linear-gradient(135deg,var(--btn1),var(--btn2)); color: rgb(255, 255, 255); border-bottom-right-radius: 6px;}
.typing{padding: 2px 4px;}
.pv{position: relative; display: inline-block; margin-bottom: 8px;}
.pv img{height: 70px; border-radius: 12px; display: block;}
.pv button{position: absolute; top: -6px; right: -6px; width: 22px; height: 22px; border-radius: 50%; border: 0px; background: var(--ink); color: var(--card); display: grid; place-items: center; padding: 0px;}
.pv button svg{width: 12px; height: 12px;}
.hint{margin: -6px 0px 0px; color: var(--mut); font-size: 12.5px;}
.chars{display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 10px;}
.today{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 8px; margin-bottom: 10px;}
.today > div{background: var(--card); border-radius: 14px; padding: 8px 12px;}
.today small{display: block; font-size: 10.5px; color: var(--mut); font-weight: 600;}
.today b{display: block; font-size: 14px; font-weight: 600; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
@media (max-width: 560px){
.today{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
html.tx,html.tx *,html.tx ::before,html.tx ::after{transition: background-color 0.55s, color 0.55s, border-color 0.55s, fill 0.55s, stroke 0.55s, box-shadow 0.55s !important;}
.apwrap{position: relative; flex: 0 0 auto;}
.rb[aria-expanded="true"]{box-shadow: 0 0 0 2px var(--g2);}
.sig{display: flex; align-items: flex-end; gap: 2px; height: 16px; padding: 0px 6px; flex: 0 0 auto; position: relative;}
.sig i{display: block; width: 3.5px; border-radius: 1px; background: var(--ink); opacity: 0.22; transition: opacity 0.4s, background 0.4s;}
.sig i:nth-child(1){height: 5px;}
.sig i:nth-child(2){height: 8px;}
.sig i:nth-child(3){height: 11px;}
.sig i:nth-child(4){height: 14px;}
.sig i.on{opacity: 1;}
.sig.off i{background: rgb(229, 72, 77);}
.sig.off::after{content: ""; position: absolute; left: 3px; right: 3px; top: 7px; height: 2px; background: rgb(229, 72, 77); transform: rotate(-35deg); border-radius: 2px;}
.sig.wave i{transform-origin: center bottom; animation: 0.5s ease 0s 1 normal both running sigw;}
.sig.wave i:nth-child(2){animation-delay: 0.07s;}
.sig.wave i:nth-child(3){animation-delay: 0.14s;}
.sig.wave i:nth-child(4){animation-delay: 0.21s;}
@media (max-width: 640px){
.sig{padding: 0px 2px;}
}
@media (max-width: 900px){
.chars{grid-template-columns: repeat(3, minmax(0px, 1fr));}
}
@media (max-width: 640px){
.aichat{height: calc(100dvh - 190px);}
.chars{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.m{max-width: 96%;}
}
@media (max-width: 1100px){
.brand b{font-size: 14px;}
}
.life{background: var(--card); border-radius: 20px; padding: 14px 18px 8px; margin-bottom: 12px;}
.lt{display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; margin-bottom: 34px;}
.lt small{color: var(--mut); font-weight: 500;}
.lticks{position: relative; height: 22px; margin-top: 6px; font-size: 10.5px; color: var(--mut);}
.lticks span{position: absolute; transform: translateX(-50%);}
.dpick{display: grid;}
.dpv{aspect-ratio: 16 / 10; border-radius: 16px; background: var(--soft); border: 2px dashed var(--bd); display: grid; place-items: center; overflow: hidden; cursor: pointer; color: var(--mut);}
.dpv img{width: 100%; height: 100%; object-fit: cover;}
.dpv span{display: grid; justify-items: center; gap: 4px;}
.dpv svg{width: 28px; height: 28px;}
.ph.mono{display: grid; place-items: center; color: rgb(255, 255, 255); position: absolute; inset: 0px; width: 100%; height: 100%; align-content: center; gap: 6px;}
.ph.mono b{font-size: 96px; font-weight: 300; line-height: 1; opacity: 0.92; letter-spacing: -2px;}
.ph.mono small{display: flex; gap: 6px; align-items: center; font-size: 12px; opacity: 0.85; background: rgba(255, 255, 255, 0.18); padding: 6px 12px; border-radius: 999px;}
.ph.mono small svg{width: 15px; height: 15px;}
.dline{height: 5px; border-radius: 6px; background: var(--track); max-width: 460px; overflow: hidden;}
.dline i{display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg,var(--c1),var(--c2)); animation: 1.1s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal none running pgrow;}
.dlg label.chk{display: flex; align-items: center; gap: 10px; font-weight: 500; font-size: 13.5px;}
.dlg label.chk input{width: 22px; height: 22px; flex: 0 0 auto;}
.dlg label.chk em{font-style: normal; color: var(--mut);}
.lsum{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 10px; margin-bottom: 12px;}
.lsum > div{border-radius: 20px; padding: 14px 16px; display: flex; gap: 12px; align-items: flex-start; min-width: 0px; background: var(--card);}
.lsum .si{width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; flex: 0 0 auto; background: var(--card); color: var(--ink2);}
.lsum .si svg{width: 20px; height: 20px;}
.lsum .stx{min-width: 0px; flex: 1 1 0%;}
.lsum small{color: var(--mut2); font-size: 12px; font-weight: 600;}
.lsum b{display: block; font-size: 20px; font-weight: 700; letter-spacing: -0.4px; margin: 1px 0px; word-break: break-word;}
.lsum .sb{font-size: 11px; color: var(--mut2); font-weight: 500; display: block;}
.lsum .s1{background: var(--red-soft);}
.lsum .s1 .si{color: var(--red);}
.lsum .s2{background: var(--blue-soft);}
.lsum .s2 .si{color: var(--blue);}
.lsum .s3{background: var(--amber-soft);}
.lsum .s3 .si{color: var(--amber);}
.lsum .s4{background: var(--possoft);}
.lsum .s4 .si{color: var(--pos);}
.lsum .mbar{height: 5px; border-radius: 99px; background: rgba(0, 0, 0, 0.08); margin-top: 6px; overflow: hidden;}
.lsum .mbar i{display: block; height: 100%; background: var(--pos); border-radius: 99px;}
.lbar2{display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px;}
.ltabs{display: flex; gap: 8px; flex-wrap: wrap;}
.ltabs button{height: 36px; padding: 0px 16px; border-radius: 999px; border: 1px solid var(--bd); background: var(--card); color: var(--ink2); font-weight: 600; font-size: 13px;}
.ltabs button.on{background: var(--g2); border-color: var(--g2); color: rgb(255, 255, 255);}
.lsort{margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--mut2);}
.lsort select{height: 38px; border: 1px solid var(--bd); border-radius: 12px; background: var(--card); color: var(--ink); padding: 0px 10px; font-size: 13px;}
.lnote{font-size: 12px; color: var(--mut2); margin: 4px 2px 12px;}
.llist{display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 430px), 1fr)); gap: 12px;}
.lr{background: var(--card); border-radius: 22px; padding: 16px; display: grid; gap: 12px; min-width: 0px;}
.lh1{display: flex; align-items: center; gap: 12px; min-width: 0px;}
.lav{width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; color: rgb(255, 255, 255); font-weight: 700; font-size: 15px; flex: 0 0 auto; background: linear-gradient(135deg,var(--c1,#1f8a57),var(--c2,#0b4a2c));}
.lh1 .tt{flex: 1 1 0%; min-width: 0px;}
.lh1 h3{margin: 0px; font-size: 17px; font-weight: 700; display: flex; gap: 8px; align-items: center; flex-wrap: wrap;}
.lh1 .ls{font-size: 12px; color: var(--mut2); margin-top: 1px;}
.code{font-family: ui-monospace, Menlo, monospace; font-size: 11px; font-weight: 600; background: var(--chipbg); padding: 3px 9px; border-radius: 8px; letter-spacing: 0.2px; color: var(--ink2);}
.lx{width: 34px; height: 34px; border-radius: 50%; border: 0px; background: none; color: var(--mut2); display: grid; place-items: center; flex: 0 0 auto;}
.lx:active{background: var(--chipbg);}
.lbx{display: grid; grid-template-columns: 1fr 1fr; gap: 10px;}
.lbx > div{background: var(--soft); border-radius: 16px; padding: 10px 14px; min-width: 0px; position: relative;}
.lbx small{font-size: 12px; color: var(--mut2); font-weight: 600;}
.lbx b{display: block; font-size: 22px; font-weight: 700; letter-spacing: -0.5px; margin-top: 2px;}
.lbx .sb{font-size: 12px; color: var(--mut2);}
.lbx .nx{background: var(--amber-soft);}
.lr.late .nx{background: var(--red-soft);}
.lr.ok .nx{background: var(--possoft);}
.lr.on .nx{background: var(--chipbg);}
.lpill{position: absolute; right: 10px; top: 9px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.7); color: var(--amber);}
.lpill svg{width: 14px; height: 14px;}
.lr.late .lpill{color: var(--red);}
.lr.ok .lpill{color: var(--pos);}
.lr.soon .lpill{color: var(--blue);}
.lr.on .lpill{color: var(--mut2);}
:root[data-mode="dark"] .lpill{background: rgba(0, 0, 0, 0.3);}
.lpr{display: flex; justify-content: space-between; font-size: 13px; gap: 10px;}
.lpr b{font-weight: 600;}
.lpr span{font-weight: 600;}
.lr .dline{max-width: none; height: 8px; --c1: var(--pos); --c2: var(--g3);}
.lst{display: grid; grid-template-columns: 1fr 1fr; gap: 10px; border-top: 1px solid var(--line); padding-top: 10px;}
.lst > div{display: flex; gap: 10px; align-items: center;}
.lst .i2{width: 34px; height: 34px; border-radius: 10px; background: var(--gsoft); color: var(--g2); display: grid; place-items: center; flex: 0 0 auto;}
.lst small{display: block; font-size: 11.5px; color: var(--mut2);}
.lst b{font-size: 15px;}
.lft{display: flex; align-items: center; gap: 8px; flex-wrap: wrap;}
.lft .hb{border: 0px; background: none; color: var(--g2); font-weight: 600; font-size: 13px; display: inline-flex; gap: 6px; align-items: center; padding: 6px 0px;}
.lft .sp{flex: 1 1 0%;}
.lk{display: inline-flex; gap: 6px; align-items: center; font-size: 12px; font-weight: 600; padding: 7px 12px; border-radius: 999px; background: var(--possoft); color: var(--pos);}
.lft .pb2{height: 36px; padding: 0px 14px; border-radius: 999px; border: 1px solid var(--g2); background: var(--card); color: var(--g2); font-weight: 600; font-size: 12.5px;}
.lft .rm{height: 36px; padding: 0px 10px; border: 0px; background: none; color: var(--mut2); font-size: 12.5px;}
.lhist{border-top: 1px dashed var(--line); padding-top: 8px; display: grid; gap: 6px;}
.lhist div{display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px;}
.lhist small{color: var(--mut2);}
.lacc{display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 10px;}
.la{display: flex; align-items: center; gap: 12px; background: var(--card); border-radius: 18px; padding: 14px;}
.la > div{flex: 1 1 0%; min-width: 0px;}
.la b{display: block; font-size: 14px;}
.la small{color: var(--mut2); font-size: 11.5px;}
.la strong{font-size: 15px; color: var(--red);}
.lai{width: 40px; height: 40px; border-radius: 12px; background: var(--gsoft); color: var(--g2); display: grid; place-items: center; flex: 0 0 auto;}
@media (max-width: 1100px){
.lsum{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
@media (max-width: 560px){
.lbx{grid-template-columns: 1fr;}
.lpill{position: static; transform: none; margin-top: 6px;}
.lsort{margin-left: 0px; width: 100%;}
}
:root{--logo: 44px;}
:root[data-logo="s"]{--logo: 30px;}
:root[data-logo="l"]{--logo: 60px;}
.logo{width: var(--logo); height: var(--logo);}
.logo svg{width: 100%; height: 100%;}
.logo img{width: 100%; height: 100%; object-fit: contain; display: block; border-radius: 22%;}
html.rail .logo{width: min(var(--logo),48px); height: min(var(--logo),48px);}
@media (max-width: 1100px){
.logo{width: min(var(--logo),48px); height: min(var(--logo),48px);}
}
.side .logo{max-width: 52px; max-height: 52px;}
.brand b{min-width: 0px; overflow: hidden; text-overflow: ellipsis;}
:root[data-logo="l"] .brand b{font-size: 14px;}
@media (max-width: 640px), (max-width: 960px) and (max-height: 500px){
html,body{height: auto; min-height: 100%; overscroll-behavior: auto;}
body{width: 100%; min-width: 0px;}
.shell,html.rail .shell{width: 100%; max-width: 100%; height: auto; min-height: 100dvh; margin: 0px; border-radius: 0px; grid-template-columns: minmax(0px, 1fr); overflow: visible; padding: max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) calc(88px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));}
:root[data-skin] .shell{border-radius: 0px;}
.col{height: auto; min-width: 0px; max-width: 100%;}
.content{min-width: 0px; max-width: 100%; min-height: 0px; overflow: visible; padding: 12px;}
.view,.view > *,.head > div,[data-orbit-history],[data-api-dashboard]{min-width: 0px; max-width: 100%;}
.top{display: grid; grid-template-columns: repeat(6, minmax(0px, 1fr)); gap: 6px; padding: 8px; min-width: 0px; max-width: 100%; align-items: center;}
.top > .sp,.top .pill.dt,.top .sig{display: none;}
.top .rb{width: 100%; min-width: 0px; height: 44px; border-radius: 14px;}
#btnMenu{grid-area: 1 / 1;}
.top .gsearch{grid-area: 1 / 2 / auto / 6; max-width: none; width: auto; height: 44px; min-width: 0px; padding-left: 12px;}
.top .gsearch input{width: 100%; min-width: 0px; font-size: 16px;}
.top .apwrap{grid-area: 1 / 6; min-width: 0px;}
#btnCur{grid-area: 2 / 3; width: 100%; min-width: 0px; height: 44px; padding: 0px 4px; justify-content: center; font-size: 12px;}
#btnBell{grid-area: 2 / 5;}
.side,html.rail .side{position: fixed; top: auto; left: max(8px,env(safe-area-inset-left)); right: max(8px,env(safe-area-inset-right)); bottom: max(8px,env(safe-area-inset-bottom)); height: 64px; max-width: 100%; padding: 4px 6px; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 2px; overflow: auto hidden; border-radius: 20px; z-index: 30; scrollbar-width: none;}
.side .ng,.side .ngb,.side .nrow{display: contents;}
.side .brand,.side .sec,.side .sep,.side .ngh{display: none;}
.side .nav,html.rail .side .nav{flex: 0 0 64px; width: 64px; min-width: 64px; height: 52px; min-height: 52px; padding: 4px 2px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;}
.side .nav span,html.rail .side .nav span{display: block; font-size: 9.5px; line-height: 1.1; font-weight: 600;}
.side .nav.on::before{display: none;}
.asum,.asum.c4{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.d2,.rgrid,.sgrid,.pgrid,.pcols{grid-template-columns: minmax(0px, 1fr);}
.d2 > .card{grid-area: auto !important;}
.head{gap: 10px;}
.head h1{font-size: 28px;}
.head p{overflow-wrap: anywhere;}
.head .actions{width: 100%; gap: 8px;}
.actions .btn,.brow .btn{max-width: 100%; white-space: normal; min-height: 42px; height: auto; padding: 9px 14px; justify-content: center;}
.head .actions .btn{flex: 1 1 auto;}
.ac{max-width: 100%;}
input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size: 16px; min-width: 0px; max-width: 100%;}
dialog{max-width: calc(-24px + 100vw); max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));}
.dlg{min-width: 0px; padding: 16px; max-height: calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); overflow: auto;}
.dlg .row2{grid-template-columns: minmax(0px, 1fr);}
.dlg input,.dlg select,.dlg textarea{width: 100%;}
.gi{min-width: 0px; max-width: 100%;}
.auth{padding-left: max(14px,env(safe-area-inset-left)); padding-right: max(14px,env(safe-area-inset-right)); align-items: safe center;}
.auwrap{min-width: 0px;}
.auth .box{min-width: 0px; padding: 22px;}
.auth .brand{display: flex;}
.auth .brand b{white-space: normal;}
.land{padding-left: max(14px,env(safe-area-inset-left)); padding-right: max(14px,env(safe-area-inset-right));}
}
@media (max-width: 400px){
.pprof .tx{min-width: 0px;}
}
@media (min-width: 641px) and (max-width: 960px) and (max-height: 500px){
.top{grid-template-columns: 44px minmax(0px, 1fr) minmax(88px, auto) repeat(5, 44px);}
#btnMenu{grid-area: 1 / 1;}
.top .gsearch{grid-area: 1 / 2;}
#btnCur{grid-area: 1 / 4;}
#btnBell{grid-area: 1 / 6;}
.top .apwrap{grid-area: 1 / 8;}
}
.side .nav > span,.side .ngh > span{white-space: nowrap; min-width: 0px; overflow: hidden; text-overflow: ellipsis;}
.side .nav > svg,.side .ngh > svg{flex-shrink: 0;}
.side .ngh > span{flex: 1 1 0px; text-align: left;}
@media (min-width: 641px){
.side .nav > span{flex: 1 1 0px;}
}
.side .logo,.auth .brand .logo,.aulogo,.splogo img{box-shadow: none; background: transparent !important;}
.side .logo img{border-radius: 0px;}
.side .brand{gap: 7px; padding: 0px 0px 6px; min-width: 0px;}
.side .brand > .logo{width: 30px; height: 30px; max-width: 30px; max-height: 30px; flex: 0 0 30px;}
.side .brand > b,:root[data-logo="l"] .side .brand > b{font-size: 13px; letter-spacing: -0.3px; white-space: nowrap; overflow: visible; text-overflow: clip; flex: 0 0 auto;}
.logo img,.splogo img,.lnl{object-fit: contain;}
.aulogo{max-width: 100%; overflow: hidden; width: 240px !important; height: 160px !important; border-radius: 18px !important; background: transparent !important; box-shadow: none !important; border: 0px !important;}
.aulogo img{width: 100%; height: 100%; object-fit: contain; animation: auto ease 0s 1 normal none running none !important; filter: none !important;}
@media (max-width: 600px){
.auhero .aulogo{margin: 0px auto 14px; width: 204px !important; height: 136px !important;}
}
.ge-page{max-width: 1500px; margin: auto;}
.ge-kicker{font-size: 10px; letter-spacing: 1.7px; color: rgb(231, 119, 65); font-weight: 800;}
.ge-layout{display: grid; grid-template-columns: minmax(0px, 1fr) 345px; gap: 24px; align-items: start;}
.ge-products{min-width: 0px;}
.ge-search{display: flex; gap: 16px; align-items: center; margin-bottom: 18px;}
.ge-search label{flex: 1 1 0%;}
.ge-search > span,.ge-note{font-size: 12px; color: var(--mut2);}
.ge-page label{display: grid; gap: 7px; font-size: 12px; font-weight: 650; min-width: 0px;}
.ge-page input,.ge-page select{width: 100%; min-width: 0px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink); font: inherit; box-sizing: border-box;}
.ge-categories{display: flex; gap: 8px; overflow: auto; padding-bottom: 16px;}
.ge-categories button{white-space: nowrap;}
.ge-grid{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 14px;}
.ge-product{border: 1px solid var(--line); border-radius: 16px; padding: 10px; background: var(--card); color: var(--ink); text-align: left; cursor: pointer; display: grid; gap: 8px; transition: transform 0.15s, box-shadow 0.15s;}
.ge-product:hover{transform: translateY(-2px); box-shadow: rgba(0, 0, 0, 0.047) 0px 8px 20px;}
.ge-picture{display: grid; place-items: center; min-height: 110px; background: linear-gradient(140deg, rgb(255, 243, 229), rgb(232, 240, 232)); border-radius: 10px; font-size: 48px;}
.ge-product > b{font-size: 14px;}
.ge-product > small{color: var(--mut2); font-size: 11px;}
.ge-product > div{display: flex; gap: 5px; justify-content: space-between; align-items: center; font-size: 11px; color: var(--mut2);}
.ge-product i{font-style: normal; border-radius: 50%; background: rgb(255, 113, 61); color: rgb(255, 255, 255); font-size: 21px; width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 auto;}
.ge-receipt{background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 20px; position: sticky; top: 16px; box-shadow: rgba(0, 0, 0, 0.02) 0px 8px 30px;}
.ge-receipt-title{display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 20px;}
.ge-receipt-title h2{font-size: 16px; margin: 0px;}
.ge-receipt-title > span{font-size: 11px; color: var(--mut2);}
.ge-receipt fieldset{border: 0px; padding: 0px; margin: 0px; min-width: 0px; display: grid; gap: 14px;}
.ge-store-logo{width: 42px; height: 42px; border-radius: 12px; background: rgb(240, 243, 237); color: rgb(55, 112, 80); display: grid; place-items: center; overflow: hidden; flex: 0 0 auto; font-weight: 800;}
.ge-store-logo img{width: 100%; height: 100%; object-fit: contain;}
.ge-link{border: 0px; background: none; color: var(--btn1); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px; cursor: pointer; text-align: left; padding: 2px;}
.ge-lines{border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line); padding: 12px 0px; max-height: 340px; overflow: auto;}
.ge-line{padding: 10px 0px; display: grid; gap: 6px;}
.ge-line > div{display: flex; gap: 8px; align-items: center;}
.ge-line b{flex: 1 1 0%; font-size: 13px;}
.ge-line small{font-size: 11px; color: var(--mut2); overflow-wrap: anywhere;}
.ge-line strong{text-align: right; font-size: 13px;}
.ge-remove{border: 0px; background: var(--soft); color: var(--ink); width: 26px; height: 26px; border-radius: 50%; cursor: pointer;}
.ge-empty{text-align: center; color: var(--mut2); padding: 24px 5px; font-size: 12px;}
.ge-empty span{display: block; font-size: 32px; margin-bottom: 12px;}
.ge-empty b{color: var(--ink);}
.ge-summary{display: flex; justify-content: space-between; align-items: center; margin-top: 20px; gap: 10px;}
.ge-summary > b{font-size: 25px;}
.ge-note{line-height: 1.65; margin-top: 14px;}
.ge-save{width: 100%; margin-top: 12px; min-height: 45px;}
.ge-error{font-size: 12px; line-height: 1.6; color: var(--red); background: var(--soft); padding: 12px; border-radius: 8px;}
.ge-page button:focus-visible{outline: rgb(231, 119, 65) solid 3px; outline-offset: 3px;}
.ge-page button:disabled{opacity: 0.55; cursor: default;}
@media (min-width: 1450px){
.ge-grid{grid-template-columns: repeat(4, minmax(0px, 1fr));}
}
@media (max-width: 1000px){
.ge-layout{grid-template-columns: minmax(0px, 1fr) 310px; gap: 14px;}
.ge-grid{grid-template-columns: repeat(2, minmax(0px, 1fr));}
}
@media (max-width: 720px){
.ge-layout{grid-template-columns: 1fr;}
.ge-receipt{position: static;}
.ge-picture{min-height: 90px; font-size: 40px;}
.ge-search > span{display: none;}
.ge-page .head{gap: 12px; flex-wrap: wrap;}
.ge-lines{max-height: none;}
}
.ge-product-wrap{min-width: 0px;}
.ge-product-wrap .ge-product{width: 100%; height: auto;}
.ge-picture{overflow: hidden;}
.ge-picture img{width: 100%; height: 115px; object-fit: cover;}
.ge-settings-icon{width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line); background: var(--card); color: var(--ink); cursor: pointer;}
.ge-settings-icon svg{width: 18px; height: 18px;}
.ge-admin-tools{display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px;}
.ge-admin-company{display: flex; gap: 14px; align-items: center; margin-bottom: 18px;}
.ge-admin-company p{margin: 6px 0px 0px; color: var(--mut2); font-size: 12px;}
.ge-admin-grid{display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px;}
.ge-admin-item{background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 14px; min-width: 0px;}
.ge-admin-item h3{font-size: 14px; overflow-wrap: anywhere; margin: 14px 0px 8px;}
.ge-admin-item p,.ge-admin-item > small{font-size: 12px; color: var(--mut2); line-height: 1.6;}
.ge-admin-row{display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0px;}
.ge-admin-row .btn{font-size: 11px; padding: 8px 10px;}
.ge-admin-item.ge-inactive{opacity: 0.65;}
@media (max-width: 600px){
.ge-admin-grid{grid-template-columns: 1fr 1fr;}
.ge-admin-item{padding: 10px;}
.ge-admin-tools .btn{font-size: 11px;}
}
.ge-pack-table{overflow: auto; margin: 16px 0px;}
.ge-pack-table table{width: 100%; border-collapse: collapse; font-size: 12px;}
.ge-pack-table th,.ge-pack-table td{text-align: left; padding: 12px; border-bottom: 1px solid var(--line); white-space: nowrap;}
.ge-monthly{margin-top: 24px;}
.ge-monthly h2{font-size: 18px;}
.ge-monthly label{max-width: 220px;}
#insDlg:has(.ge-pack-manager){overflow: auto; width: min(1040px, 96vw) !important; max-width: 96vw !important;}
@media (min-width: 760px){
.ge-page .ge-grid{grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 8px;}
.ge-page .ge-grid .ge-product{padding: 6px; gap: 5px; border-radius: 12px;}
.ge-page .ge-grid .ge-picture{min-height: 64px; font-size: 30px; border-radius: 8px;}
.ge-page .ge-grid .ge-product b{font-size: 12px; line-height: 1.2;}
.ge-page .ge-grid .ge-product small{font-size: 10px;}
.ge-page .ge-grid .ge-product > div{font-size: 10px; gap: 3px;}
.ge-page .ge-grid .ge-product i{width: 22px; height: 22px; font-size: 16px;}
}
@media (min-width: 1001px){
.ge-page .ge-grid{grid-template-columns: repeat(6, minmax(0px, 1fr));}
}
@font-face { font-family: "Doto Variable"; src: url("/fonts/doto.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
html[data-font="dot"] :is(h1, h2, h3, .kpi b, .sc b, .acb b, .ac-num, .ge-summary b, .dm-bal, .dxcd b, .stat b, .big){font-weight: 900; letter-spacing: 0.6px; font-family: "Doto Variable",var(--font) !important;}
html[data-font="dotall"],html[data-font="dotall"] :is(body, button, input, select, textarea){font-weight: 800; letter-spacing: 0.3px; font-family: "Doto Variable",var(--font) !important;}
html[data-dash="dot"] #view-dash :is(.kpi b, .gnum b, .csc b, .gv, .sc b, .dxcd b, .acb b){font-weight: 900; letter-spacing: 0.6px; font-family: "Doto Variable",var(--font) !important;}
.rb .dot.warn{background: rgb(255, 138, 61);}
@media (min-width: 700px){
dialog#dlg{overflow: hidden; width: min(700px, -24px + 100vw) !important; max-width: none !important; height: min(560px, 100dvh - 24px) !important; max-height: none !important; margin: auto !important; border-radius: 22px !important;}
dialog#dlg > form.dlg{box-sizing: border-box; height: 100%; overflow: auto; flex-direction: column; animation: 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal none running geFlowIn; max-height: none !important; padding-bottom: 0px !important; display: flex !important;}
dialog#dlg .actions{order: 99; position: sticky; bottom: 0px; background: var(--card); padding: 10px 22px 14px; margin: auto -22px 0px; flex: 0 0 auto; z-index: 2;}
}
.ge-pbar{width: min(260px, 60%); height: 4px; background: rgba(136, 136, 136, 0.2); border-radius: 4px; overflow: hidden; margin-top: 6px;}
.ge-pbar i{display: block; width: 40%; height: 100%; background: rgb(255, 106, 43); border-radius: 4px; animation: 1.1s cubic-bezier(0.4, 0, 0.2, 1) 0s infinite normal none running gePbar;}
@media (prefers-reduced-motion: reduce){
.ge-pbar i{animation-duration: 2.4s;}
}
:root[data-skin="bento"]{--bg: #ecebe8; --shell: #f4f3f1; --card: #fff; --panel: #faf9f7; --line: rgba(28,26,25,.07); --bd: rgba(28,26,25,.09); --soft: #f4f3f1; --track: #efedea; --chipbg: #f1efec; --ink: #1c1a19; --ink2: #3d3a38; --mut: #8a8683; --mut2: #6d6966; --g1: #1c1a19; --g2: #d9623b; --g3: #e8825c; --g4: #f0a083; --btn1: #d9623b; --btn2: #1c1a19; --h1: #e0714a; --h2: #d9623b; --h3: #b8512c; --htxt: #fff; --d1: #e0714a; --d2: #b8512c; --gsoft: #fbe6dd; --gsoft2: #fdf1ec; --gline: #f0c9b9; --glow: 217,98,59; --shadow: 60,40,30; --hatch: rgba(28,26,25,.04); --hatchline: #d9a893;}
:root[data-skin="bento"][data-mode="dark"]{--bg: #121110; --shell: #181716; --card: #211f1e; --panel: #1b1a19; --line: rgba(255,255,255,.07); --bd: rgba(255,255,255,.1); --soft: rgba(255,255,255,.05); --track: rgba(255,255,255,.1); --chipbg: rgba(255,255,255,.08); --ink: #f4f1ee; --ink2: #d9d4cf; --mut: #9a948f; --mut2: #b5afa9; --g1: #f0a083; --g2: #ee7f55; --g3: #e8825c; --g4: #f0a083; --gsoft: rgba(238,127,85,.18); --gsoft2: rgba(238,127,85,.1); --gline: rgba(238,127,85,.35); --d1: #3a2a24; --d2: #1b1512;}
:root[data-skin="bento"] .shell{border-radius: 32px; box-shadow: none;}
:root[data-skin="bento"] .side{border-radius: 28px; background: var(--card); backdrop-filter: none;}
:root[data-skin="bento"] :is(.kpi, .card, .panel, .apanel, .sc, .coach, .aichat, .today > div){border-radius: 24px; border: 0px; backdrop-filter: none; box-shadow: none;}
:root[data-skin="bento"] :is(.btn, .mini, .seg button, .tab, .chip, .at){border-radius: 999px;}
:root[data-skin="bento"] .btn.p{background: var(--g2); border-color: var(--g2); color: rgb(255, 255, 255); box-shadow: none;}
.bn{display: grid; gap: 14px; max-width: 1100px;}
html.bg *,html.bg ::before,html.bg ::after{animation-play-state: paused !important;}
.bw-tabs{display: flex; gap: 5px; overflow: auto; padding: 5px; margin-bottom: 23px; background: var(--soft); border: 1px solid var(--bd); border-radius: 14px; scrollbar-width: thin;}
.bw-tabs button{white-space: nowrap; flex: 1 1 0%; padding: 11px 13px; border: 0px; border-radius: 10px; background: transparent; color: var(--mut); cursor: pointer;}
.bw-tabs button.on{background: var(--card); color: var(--g1); box-shadow: rgba(16, 45, 24, 0.07) 0px 2px 8px;}
@media (max-width: 800px){
.bw-tabs button{font-size: 11px; padding: 10px;}
}
@media print{
body:has(#view-budget:not([hidden])) .side,body:has(#view-budget:not([hidden])) .top{display: none !important;}
body:has(#view-budget:not([hidden])) .shell{display: block; height: auto; margin: 0px; padding: 0px; border: 0px;}
body:has(#view-budget:not([hidden])) .content{overflow: visible; height: auto; padding: 0px;}
}
:root{--app-zoom: 1;}
.content{zoom: var(--app-zoom);}
.top{min-height: 54px; padding: 8px 11px; gap: 8px;}
.top .rb{width: 36px; height: 36px;}
.top .rb svg{width: 18px; height: 18px;}
.top .gsearch{height: 36px;}
.top .gsearch > svg{width: 16px !important; height: 16px !important;}
.top .pill{font-size: 10px;}
.top #btnCur{height: 32px; min-height: 32px; padding: 0px 10px;}
.top .sig{transform: scale(0.86); padding: 0px 3px;}
@media (max-width: 960px){
.top{padding: 6px; gap: 5px;}
.top .rb{width: 100%; height: 44px;}
.top .gsearch{height: 40px;}
.top #btnCur{height: 44px; min-height: 44px;}
}
@media (pointer: coarse){
.top .rb,.top #btnCur{min-height: 44px;}
.top .rb{min-width: 44px;}
}
@media print{
.content{zoom: 1;}
}
[data-display-status]{display: block; font-size: 11px; color: var(--g1); margin-top: 8px;}
#view-loans .llist{grid-template-columns: repeat(auto-fill, minmax(min(100%, 310px), 1fr)); gap: 12px; align-items: stretch;}
#view-loans .lr{padding: 13px; gap: 9px; border-radius: 18px; display: flex; flex-direction: column; min-width: 0px;}
#view-loans .lh1{gap: 9px; align-items: flex-start;}
#view-loans .lav{width: 36px; height: 36px; border-radius: 11px; font-size: 12px;}
#view-loans .lh1 h3{font-size: 15px; gap: 5px; line-height: 1.35; overflow-wrap: anywhere;}
#view-loans .code{font-size: 9px; padding: 3px 6px; border-radius: 6px; letter-spacing: 0px;}
#view-loans .lh1 .ls{display: block; font-size: 10px; line-height: 1.55; margin-top: 4px; padding: 0px; border: 0px; border-radius: 0px; background: none; box-shadow: none; height: auto; min-height: 0px; white-space: normal; color: var(--mut2);}
#view-loans .lx{width: 28px; height: 28px;}
#view-loans .lx svg{width: 14px; height: 14px;}
#view-loans .lbx{grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px;}
#view-loans .lbx > div{padding: 9px 10px; border-radius: 12px;}
#view-loans .lbx small{font-size: 10px;}
#view-loans .lbx b{font-size: 18px; line-height: 1.35; letter-spacing: -0.4px; overflow-wrap: anywhere;}
#view-loans .lbx .sb{font-size: 10px;}
#view-loans .lpill{position: static; display: flex; width: max-content; max-width: 100%; margin-top: 5px; padding: 3px 6px; gap: 4px; font-size: 9px; line-height: 1.4; white-space: normal;}
#view-loans .lpill svg{width: 11px; height: 11px; flex: 0 0 auto;}
#view-loans .lpr{font-size: 10px; line-height: 1.6; gap: 7px;}
#view-loans .lr .dline{height: 6px;}
#view-loans .lst{gap: 8px; padding-top: 8px;}
#view-loans .lst > div{gap: 7px; min-width: 0px;}
#view-loans .lst .i2{width: 28px; height: 28px; border-radius: 9px;}
#view-loans .lst .i2 svg{width: 14px; height: 14px;}
#view-loans .lst small{font-size: 9px; line-height: 1.5;}
#view-loans .lst b{font-size: 12px;}
#view-loans .lft{display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 6px; margin-top: auto; align-items: center;}
#view-loans .lft .hb{grid-column: 1 / -1; font-size: 10px; padding: 4px 0px; min-height: 28px;}
#view-loans .lft .hb svg{width: 14px; height: 14px;}
#view-loans .lft .sp{display: none;}
#view-loans .lk{font-size: 9px; padding: 6px 8px; gap: 4px; min-width: 0px; overflow-wrap: anywhere;}
#view-loans .lk svg{width: 13px; height: 13px; flex: 0 0 auto;}
#view-loans .lft .pb2{height: 32px; font-size: 10px; padding: 0px 10px; white-space: nowrap;}
#view-loans .lsum > div{padding: 13px; gap: 10px; border-radius: 17px;}
#view-loans .lsum .si{width: 34px; height: 34px; border-radius: 11px;}
#view-loans .lsum .si svg{width: 17px; height: 17px;}
#view-loans .lsum b{font-size: 20px;}
#view-loans .lsum small,#view-loans .lsum .sb{font-size: 10px;}
#view-loans .la{padding: 12px; gap: 9px; border-radius: 15px;}
#view-loans .lai{width: 34px; height: 34px; border-radius: 10px;}
#view-loans .la b{font-size: 13px;}
#view-loans .la small{font-size: 10px;}
#view-loans .la strong{font-size: 14px;}
@media (max-width: 640px){
#view-loans .llist{grid-template-columns: minmax(0px, 1fr);}
#view-loans .lr{padding: 13px;}
#view-loans .lbx b{font-size: 19px;}
}
@media (pointer: coarse){
#view-loans .lx{width: 40px; height: 40px;}
#view-loans .lft .hb,#view-loans .lft .pb2{min-height: 44px;}
}
#menuMain{display: contents;}
#menuMain > .nav{flex: 0 0 auto;}
.side .menu-label{display: flex; align-items: center; justify-content: space-between; gap: 8px;}
@media (max-width: 640px){
.side .menu-label{display: none;}
}
#dashSentinelSlot:has(#sentinelChip[hidden]){display: none;}
@media (max-width: 960px){
.top #btnCur{grid-column: 1 / 4;}
}
@media (min-width: 641px) and (max-width: 960px) and (max-height: 500px){
.top{grid-template-columns: 44px minmax(0px, 1fr) repeat(5, 44px);}
.top #btnCur{grid-area: 1 / 3;}
.top #btnBell{grid-column: 5;}
.top .apwrap{grid-column: 7;}
}
@media (min-width: 641px) and (max-width: 1100px){
.top{align-items: center; display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; padding: 8px 10px !important;}
.top > *{grid-area: auto !important;}
.top .rb,.top .apwrap,.top .apwrap .rb{flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important;}
.top #btnBell{flex: 0 0 44px !important; width: 44px !important;}
.top #btnCur{min-width: 44px; flex: 0 0 auto !important; width: auto !important;}
.top .gsearch{flex: 1 1 220px !important; min-width: 160px !important; max-width: none !important; width: auto !important; height: 44px !important;}
.top .gsearch input{width: 100%; min-width: 0px; font-size: 16px;}
}
.ge-page .ge-grid{align-content: start; grid-auto-rows: max-content; padding-right: 8px; scrollbar-width: auto !important; scrollbar-color: auto !important;}
.ge-page .ge-grid::-webkit-scrollbar{width: 18px;}
.ge-page .ge-grid::-webkit-scrollbar-track{background: rgb(223, 230, 225); border-radius: 10px;}
.ge-page .ge-grid::-webkit-scrollbar-thumb{background: rgb(28, 124, 76); border-radius: 10px; border: 3px solid rgb(223, 230, 225); min-height: 64px;}
@supports not selector(::-webkit-scrollbar){
.ge-page .ge-grid{scrollbar-width: auto !important; scrollbar-color: rgb(28, 124, 76) rgb(223, 230, 225) !important;}
}
@media (min-width: 760px){
.ge-page .ge-layout{min-height: 300px !important;}
.ge-page .ge-receipt{overscroll-behavior: none; touch-action: none; overflow: hidden !important;}
.ge-page .ge-receipt .ge-lines{touch-action: pan-y; overscroll-behavior: contain;}
.ge-page .ge-bill-body{overflow: hidden !important;}
.ge-page .ge-fs > .ge-lines{flex: 1 1 auto !important; min-height: 48px !important; max-height: none !important; overflow-y: auto !important;}
}
@media (min-width: 760px) and (max-height: 820px){
.ge-page .ge-fs{gap: 6px !important;}
.ge-page .ge-receipt{padding-top: 10px !important; padding-bottom: 10px !important;}
.ge-page .ge-date input{min-height: 36px !important; height: 36px !important; padding-top: 0px !important; padding-bottom: 0px !important;}
.ge-page .ge-store-logo{width: 30px !important; height: 30px !important;}
.ge-page .ge-bill-foot{padding-top: 6px !important;}
.ge-page .ge-summary{margin-top: 4px !important;}
.ge-page .ge-save{margin-top: 6px !important; min-height: 36px !important; height: 38px !important;}
}
@media (min-width: 760px) and (max-height: 700px){
.ge-page .ge-note,.ge-page .ge-who > small{display: none !important;}
.ge-page .ge-empty small,.ge-page .ge-empty p{display: none !important;}
.ge-page .ge-fs > .ge-lines{min-height: 34px !important;}
.ge-page .ge-fs{gap: 4px !important;}
.ge-page .ge-date{align-items: center; gap: 10px; display: flex !important;}
.ge-page .ge-date label{flex: 0 0 150px; gap: 2px;}
.ge-page .ge-more > summary{padding: 0px !important;}
.ge-page .ge-receipt-title h2{font-size: 14px !important;}
}
@media (min-width: 760px){
.ge-page .ge-layout{grid-template-columns: minmax(0px, 1fr) 292px !important; gap: 16px !important;}
.ge-page .ge-receipt{font-size: 12px; padding-left: 12px !important; padding-right: 12px !important;}
.ge-page .ge-receipt-title h2{font-size: 14px !important;}
.ge-page .ge-receipt input{font-size: 13px !important;}
.ge-page .ge-receipt label,.ge-page .ge-receipt small,.ge-page .ge-receipt .ge-note{font-size: 10.5px !important;}
.ge-page .ge-summary b{font-size: 17px !important;}
.ge-page .ge-store-logo{display: none !important;}
.ge-page .ge-date input{min-width: 128px; font-size: 12px !important; padding: 0px 6px !important;}
}
@media (orientation: landscape) and (max-height: 500px){
dialog#gePurch{width: min(880px, 98vw) !important; border-radius: 16px !important;}
#gePurch .gep{padding: 8px 12px !important; gap: 6px !important;}
#gePurch .gep-head{gap: 8px !important; min-height: 0px !important;}
#gePurch .gep-ic{width: 30px !important; height: 30px !important; font-size: 16px !important; border-radius: 9px !important;}
#gePurch .gep-head h2{font-size: 15px !important; line-height: 1.15 !important;}
#gePurch .gep-head p{font-size: 11px !important; margin: 0px !important;}
#gePurch .gep-x{width: 30px !important; height: 30px !important; font-size: 20px !important;}
#gePurch .gep-packline{padding: 6px 10px !important; font-size: 12.5px !important; min-height: 0px !important;}
#gePurch .gep-packline button{font-size: 12px !important; padding: 4px 8px !important; height: 26px !important;}
#gePurch label{font-size: 11px !important; gap: 2px !important;}
#gePurch .gep input,#gePurch .gep-step{height: 32px !important; min-height: 0px !important; font-size: 13px !important; padding-top: 0px !important; padding-bottom: 0px !important;}
#gePurch .gep-step button{font-size: 16px !important;}
#gePurch .gep-tax{font-size: 11px !important;}
#gePurch .gep-sum{padding: 6px 10px !important; min-height: 0px !important;}
#gePurch .gep-eq{font-size: 13px !important;}
#gePurch .gep-ct,#gePurch .gep-tot small{font-size: 10.5px !important;}
#gePurch .gep-tot b{font-size: 16px !important;}
#gePurch .gep-save{font-size: 12px !important; padding: 0px !important; height: auto !important;}
#gePurch .gep-save span{font-size: 12px !important;}
#gePurch .gep-go{height: 34px !important; min-height: 0px !important; font-size: 13.5px !important;}
dialog#dlg{font-size: 12.5px;}
dialog#dlg h2{font-size: 16px !important;}
dialog#dlg input,dialog#dlg select,dialog#dlg textarea{min-height: 32px !important; font-size: 13px !important; padding-top: 4px !important; padding-bottom: 4px !important;}
dialog#dlg .btn{min-height: 34px !important; font-size: 13px !important;}
}
@media (orientation: landscape) and (min-width: 640px){
#gePurch .gep-cols{grid-auto-flow: dense; display: grid !important; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) !important; gap: 8px 14px !important; align-items: start !important;}
#gePurch .gep-l,#gePurch .gep-r{display: contents !important;}
#gePurch .gep-packline{grid-area: 1 / 1;}
#gePurch .gep-sum{grid-area: 3 / 1;}
#gePurch .gep-brand-f{grid-area: 4 / 1;}
#gePurch .gep-r > .gep-row{grid-area: 1 / 2 / 3; align-self: start;}
#gePurch .gep-tax{grid-area: 3 / 2; align-self: start; margin: 0px !important;}
#gePurch .gep-save{grid-area: 4 / 2; align-self: start;}
#gePurch .gep-cols > .gep-l > :not(.gep-packline):not(.gep-sizes),#gePurch .gep-cols > .gep-r > :not(.gep-row):not(.gep-tax):not(.gep-sum):not(.gep-brand-f):not(.gep-save):not(.gep-clr):not(.gep-err):not(.gep-go):not(.gep-cancel){grid-column: 1;}
#gePurch .gep-err{grid-area: 6 / 1 / auto / -1;}
#gePurch .gep-go{grid-row: 7; grid-column: 1 / -1 !important;}
#gePurch .gep-row{grid-template-columns: 1fr 1fr !important;}
#gePurch .gep-cols:has(.gep-l > .gep-row) :is(.gep-l, .gep-r){gap: 8px; align-content: start; display: grid !important;}
#gePurch .gep-cols:has(.gep-l > .gep-row) :is(.gep-l, .gep-r) > *{grid-area: auto !important;}
}
@media (orientation: landscape) and (min-width: 640px){
dialog#gePurch,dialog#gePurch.eat{width: min(640px, 94vw) !important; border-radius: 18px !important;}
#gePurch .gep{padding: 10px 14px !important; gap: 6px !important;}
#gePurch .gep-head h2{font-size: 15px !important;}
#gePurch .gep-head p{font-size: 11px !important;}
#gePurch .gep-ic{width: 34px !important; height: 34px !important; font-size: 18px !important;}
#gePurch .gep-x{width: 32px !important; height: 32px !important;}
#gePurch .gep-cols{gap: 6px 12px !important;}
#gePurch label,#gePurch .gep-tax{font-size: 11px !important;}
#gePurch .gep-packline{padding: 7px 10px !important; font-size: 12.5px !important;}
#gePurch .gep-packline button{font-size: 12px !important;}
#gePurch .gep input,#gePurch .gep select,#gePurch .gep-step{height: 34px !important; min-height: 0px !important; font-size: 13px !important;}
#gePurch .gep-sum{padding: 7px 10px !important;}
#gePurch .gep-eq{font-size: 13.5px !important;}
#gePurch .gep-tot b{font-size: 17px !important;}
#gePurch .gep-ct,#gePurch .gep-tot small{font-size: 10.5px !important;}
#gePurch .gep-save,#gePurch .gep-save span{font-size: 12px !important;}
#gePurch .gep-go{height: 38px !important; min-height: 0px !important; font-size: 13.5px !important;}
}
.lpay{display: inline-flex; align-items: center; gap: 6px; min-width: 0px;}
.lpay .ibt{flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line,#dfe5e1); background: var(--soft,#f4f6f5); color: var(--g2,#0c4b2d); display: grid; place-items: center; padding: 0px; cursor: pointer;}
.lpay .ibt svg{width: 16px; height: 16px;}
.lpay .ibt:active{background: var(--gsoft,#e3f4ea);}
.lpay .pb2{white-space: nowrap;}
#view-loans .lft .lpay{grid-column: 2; justify-self: end;}
@media (pointer: coarse){
#view-loans .lpay .ibt{width: 40px; height: 40px;}
}
.sig i.on{background: rgb(31, 157, 85) !important;}
.sig[data-q="fair"] i.on{background: rgb(245, 158, 11) !important;}
.sig[data-q="weak"] i.on{background: rgb(224, 62, 62) !important;}
.sig.off i{opacity: 0.45; background: rgb(224, 62, 62) !important;}
@media (orientation: landscape) and (min-width: 700px){
dialog#dlg{font-size: 12px !important;}
dialog#dlg label{font-size: 11px !important; gap: 3px !important;}
dialog#dlg h2{font-size: 15px !important; margin-bottom: 6px !important;}
dialog#dlg .actions{padding-top: 6px !important; gap: 8px !important;}
dialog#dlg .actions .btn{min-height: 32px !important; height: 32px !important; font-size: 12px !important; padding: 0px 14px !important;}
}
.ng[data-ng="money"].open > .ngb{max-height: 1800px;}
.sidetools{display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 10px 0px 2px; padding: 6px 8px 6px 12px; border-radius: 16px; background: var(--soft,rgba(0,0,0,.05));}
.sidetools .sigw{display: inline-flex; align-items: center; gap: 6px; min-width: 0px;}
.sidetools .sig{padding: 0px 2px;}
.sidetools .apwrap .rb{width: 40px; height: 40px;}
html.rail .side .sidetools{flex-direction: column; padding: 6px 2px;}
.side .brand .sigw{margin-left: auto; display: inline-flex; align-items: center;}
html.rail .side .brand .sigw{display: none;}
.sidetools{justify-content: flex-start;}
.top .sidetools{margin: 0px; padding: 0px; background: none; flex: 0 0 44px; width: 44px; grid-area: 1 / 8; display: block;}
.top .sidetools .sigw{display: none;}
.top .sidetools .apwrap{display: block;}
.apwrap{position: relative; display: inline-block; flex: 0 0 auto;}
.apwrap .rb{display: grid; place-items: center; width: 40px !important; height: 40px !important; border-radius: 50% !important; padding: 0px !important;}
.apwrap .rb{place-items: center; flex: 0 0 auto; width: 40px !important; height: 40px !important; min-width: 40px !important; border-radius: 50% !important; padding: 0px !important; margin: 0px !important; display: inline-grid !important;}
.apwrap .rb{border: 1px solid var(--line,var(--bd)); background: var(--card); color: var(--g2,#1c7c4c);}
.apwrap .rb svg{width: 18px !important; height: 18px !important;}
.sidetools:not(:has(*)){display: none;}
tr.r.grp{cursor: pointer;}
tr.r.grp .desc b{font-weight: 700;}
tr.r.grp.open{background: var(--soft);}
.topmonth{display: none;}
html:has(#view-dash:not([hidden])) .topmonth{display: flex; align-items: center; flex: 0 0 auto;}
@media (max-width: 960px){
.topmonth{grid-row: auto; flex: 1.5 1 0px; order: 1; min-width: 0px;}
.top #btnBell{order: 2;}
}
.side .nrow .apwrap{flex: 1 1 0%; display: flex; justify-content: center; align-items: center; position: static;}
.side .nrow .apwrap .rb{color: inherit; width: 100% !important; height: 44px !important; border: 0px !important; background: transparent !important; border-radius: 12px !important;}
.lgh{color-scheme: unset; forced-color-adjust: unset; math-depth: unset; position: unset; position-anchor: unset; text-size-adjust: unset; appearance: unset; color: unset; font: unset; font-palette: unset; font-synthesis: unset; position-area: unset; text-orientation: unset; text-rendering: unset; text-spacing-trim: unset; -webkit-font-smoothing: unset; -webkit-locale: unset; -webkit-text-orientation: unset; -webkit-writing-mode: unset; writing-mode: unset; zoom: unset; accent-color: unset; align-content: unset; place-self: unset; alignment-baseline: unset; anchor-name: unset; anchor-scope: unset; animation-composition: unset; animation: unset; animation-trigger: unset; app-region: unset; aspect-ratio: unset; backdrop-filter: unset; backface-visibility: unset; background-blend-mode: unset; baseline-shift: unset; baseline-source: unset; block-size: unset; border-block: unset; border-collapse: unset; border-end-end-radius: unset; border-end-start-radius: unset; border-inline: unset; border-shape: unset; border-start-end-radius: unset; border-start-start-radius: unset; inset: unset; box-decoration-break: unset; box-shadow: unset; break-after: unset; break-before: unset; break-inside: unset; buffered-rendering: unset; caption-side: unset; caret-animation: unset; caret-color: unset; caret-shape: unset; clear: unset; clip: unset; clip-path: unset; clip-rule: unset; color-interpolation: unset; color-interpolation-filters: unset; color-rendering: unset; columns: unset; column-fill: unset; rule-break: unset; rule: unset; rule-inset: unset; rule-visibility-items: unset; column-span: unset; contain: unset; contain-intrinsic-block-size: unset; contain-intrinsic-size: unset; contain-intrinsic-inline-size: unset; container: unset; content: unset; content-visibility: unset; corner-shape: unset; corner-block-end-shape: unset; corner-block-start-shape: unset; counter-increment: unset; counter-reset: unset; counter-set: unset; cx: unset; cy: unset; d: unset; dominant-baseline: unset; dynamic-range-limit: unset; empty-cells: unset; field-sizing: unset; fill: unset; fill-opacity: unset; fill-rule: unset; filter: unset; flex: unset; flex-flow: unset; flex-line-count: unset; float: unset; flood-color: unset; flood-opacity: unset; grid: unset; grid-area: unset; height: unset; hyphenate-character: unset; hyphenate-limit-chars: unset; hyphens: unset; image-orientation: unset; image-rendering: unset; initial-letter: unset; inline-size: unset; inset-block: unset; inset-inline: unset; interactivity: unset; interest-delay: unset; interpolate-size: unset; isolation: unset; justify-items: unset; letter-spacing: unset; lighting-color: unset; line-break: unset; list-style: unset; margin-block: unset; margin-inline: unset; marker: unset; mask: unset; mask-type: unset; math-shift: unset; math-style: unset; max-block-size: unset; max-height: unset; max-inline-size: unset; max-width: unset; min-block-size: unset; min-height: unset; min-inline-size: unset; min-width: unset; mix-blend-mode: unset; object-fit: unset; object-position: unset; object-view-box: unset; offset: unset; opacity: unset; order: unset; orphans: unset; outline: unset; outline-offset: unset; overflow-anchor: unset; overflow-block: unset; overflow-clip-margin: unset; overflow-inline: unset; overflow-wrap: unset; overflow: unset; overlay: unset; overscroll-behavior-block: unset; overscroll-behavior-inline: unset; overscroll-behavior: unset; padding-block: unset; padding-inline: unset; page: unset; page-margin-safety: unset; page-orientation: unset; paint-order: unset; perspective: unset; perspective-origin: unset; pointer-events: unset; position-try: unset; position-visibility: unset; print-color-adjust: unset; quotes: unset; r: unset; reading-flow: unset; reading-order: unset; resize: unset; rotate: unset; ruby-align: unset; ruby-overhang: unset; ruby-position: unset; rule-overlap: unset; rx: unset; ry: unset; scale: unset; scroll-axis-lock: unset; scroll-behavior: unset; scroll-initial-target: unset; scroll-margin-block: unset; scroll-margin: unset; scroll-margin-inline: unset; scroll-marker-group: unset; scroll-padding-block: unset; scroll-padding: unset; scroll-padding-inline: unset; scroll-snap-align: unset; scroll-snap-stop: unset; scroll-snap-type: unset; scroll-target-group: unset; scroll-timeline: unset; scrollbar-color: unset; scrollbar-gutter: unset; scrollbar-width: unset; shape-image-threshold: unset; shape-margin: unset; shape-outside: unset; shape-rendering: unset; size: unset; speak: unset; stop-color: unset; stop-opacity: unset; stroke: unset; stroke-dasharray: unset; stroke-dashoffset: unset; stroke-linecap: unset; stroke-linejoin: unset; stroke-miterlimit: unset; stroke-opacity: unset; stroke-width: unset; tab-size: unset; table-layout: unset; text-align: unset; text-align-last: unset; text-anchor: unset; text-autospace: unset; text-box: unset; text-combine-upright: unset; text-decoration: unset; text-decoration-skip-ink: unset; text-emphasis: unset; text-emphasis-position: unset; text-fit: unset; text-indent: unset; text-justify: unset; text-overflow: unset; text-shadow: unset; text-transform: unset; text-underline-offset: unset; text-underline-position: unset; text-wrap: unset; timeline-scope: unset; timeline-trigger: unset; touch-action: unset; transform: unset; transform-box: unset; transform-origin: unset; transform-style: unset; transition: unset; translate: unset; trigger-scope: unset; user-select: unset; vector-effect: unset; vertical-align: unset; view-timeline: unset; view-transition-class: unset; view-transition-group: unset; view-transition-name: unset; view-transition-scope: unset; visibility: unset; border-spacing: unset; -webkit-box-align: unset; -webkit-box-decoration-break: unset; -webkit-box-direction: unset; -webkit-box-flex: unset; -webkit-box-ordinal-group: unset; -webkit-box-orient: unset; -webkit-box-pack: unset; -webkit-box-reflect: unset; -webkit-line-break: unset; -webkit-line-clamp: unset; -webkit-mask-box-image: unset; -webkit-rtl-ordering: unset; -webkit-ruby-position: unset; -webkit-tap-highlight-color: unset; -webkit-text-combine: unset; -webkit-text-decorations-in-effect: unset; -webkit-text-fill-color: unset; -webkit-text-security: unset; -webkit-text-stroke: unset; -webkit-user-drag: unset; white-space-collapse: unset; widows: unset; will-change: unset; window-drag: unset; word-break: unset; word-spacing: unset; x: unset; y: unset; z-index: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 12px 16px; margin: 16px 0px 10px; border-radius: 14px; background: var(--card); border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-left: 4px solid var(--g2,#1c7c4c); cursor: pointer;}
.lgh.over{border-left-color: rgb(239, 68, 68);}
.lgh.w1{border-left-color: rgb(245, 158, 11);}
.lgh.done{border-left-color: var(--mut);}
.lgh .lgt{display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px;}
.lgh .lgt .i{width: 15px; height: 15px; transition: transform 0.2s;}
.lgh[aria-expanded="true"] .lgt .i{transform: rotate(90deg);}
.lgh .lgc{color: var(--mut2); font-size: 12.5px; font-weight: 700; text-align: right;}
.sig{display: block; position: relative; width: 22px; height: 16px; padding: 0px; flex: 0 0 auto;}
.sig i{position: absolute; left: 50%; bottom: 0px; transform: translateX(-50%); box-sizing: border-box; display: block; opacity: 0.25; transition: opacity 0.35s, border-color 0.35s, background 0.35s; animation: auto ease 0s 1 normal none running none;}
.sig i:nth-child(1){width: 4px; height: 4px; border-radius: 50%; background: var(--ink); bottom: 0px;}
.sig i:nth-child(n+2){border-width: 2.4px; border-style: solid; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-image: none; border-top-color: var(--ink); border-radius: 50% 50% 0px 0px / 100% 100% 0px 0px; height: auto; background: transparent !important;}
.sig i:nth-child(2){width: 9px; height: 5px; bottom: 4px;}
.sig i:nth-child(3){width: 15px; height: 8px; bottom: 4px;}
.sig i:nth-child(4){width: 22px; height: 11px; bottom: 4px;}
.sig i.on{opacity: 1;}
.sig i.on:nth-child(n+2){border-top-color: rgb(31, 157, 85);}
.sig[data-q="fair"] i.on:nth-child(n+2){border-top-color: rgb(245, 158, 11);}
.sig[data-q="weak"] i.on:nth-child(n+2){border-top-color: rgb(224, 62, 62);}
.sig.off i:nth-child(n+2){border-top-color: rgb(224, 62, 62) !important;}
.sig[data-q] i.on:nth-child(n+2),.sig.off i:nth-child(n+2){background: transparent !important;}
.sig.off::after{left: 2px; right: 2px; top: 7px;}
.sig.wave i.on{animation: 0.6s ease-out 0s 1 normal both running sigf !important; transform: translateX(-50%) !important;}
.top .gsearch{height: 44px !important; max-width: 360px;}
.top .gsearch input{font-size: 14px;}
.top .gsearch > svg{width: 18px !important; height: 18px !important;}
@media (max-width: 960px){
.top .gsearch{max-width: none;}
}
#view-dash .tr i{transform-origin: left center; animation: 0.5s ease-out 0.1s 1 normal both running dkFill;}
#view-dash .card{animation: 0.3s ease-out 0s 1 normal both running dkIn;}
@media (prefers-reduced-motion: reduce){
#view-dash *,#view-dash ::before{animation: auto ease 0s 1 normal none running none !important; transition: none !important;}
}
html[data-cb-icon-style^="icon-"] .col > header.top :is(button.rb, button.mailb){transition: background 0.16s, transform 0.16s, box-shadow 0.16s; background: var(--cb-icon-bg) !important; color: var(--cb-icon-fg) !important; border-radius: var(--cb-icon-radius) !important; border: 1px solid var(--cb-icon-border) !important; box-shadow: var(--cb-icon-shadow) !important;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(button.rb, button.mailb):hover{transform: translateY(-1px);}
html[data-cb-icon-style="icon-1"]{--cb-icon-bg: #d9eaff; --cb-icon-fg: #243044; --cb-icon-border: #2279d5; --cb-icon-radius: 13px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-2"]{--cb-icon-bg: #e6e7ed; --cb-icon-fg: #243044; --cb-icon-border: #55576c; --cb-icon-radius: 11px; --cb-icon-shadow: 0 4px 14px rgba(30,40,70,.25);}
html[data-cb-icon-style="icon-3"]{--cb-icon-bg: #eaf0ff; --cb-icon-fg: #243044; --cb-icon-border: #9ebaff; --cb-icon-radius: 24px; --cb-icon-shadow: 0 4px 14px rgba(30,40,70,.25);}
html[data-cb-icon-style="icon-4"]{--cb-icon-bg: #eee5ff; --cb-icon-fg: #243044; --cb-icon-border: #6750a4; --cb-icon-radius: 19px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-5"]{--cb-icon-bg: #fae5d6; --cb-icon-fg: #243044; --cb-icon-border: #ef7625; --cb-icon-radius: 10px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-6"]{--cb-icon-bg: #e9edff; --cb-icon-fg: #243044; --cb-icon-border: #6b8af2; --cb-icon-radius: 24px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-7"]{--cb-icon-bg: #e1f3f6; --cb-icon-fg: #243044; --cb-icon-border: #4285f4; --cb-icon-radius: 18px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-8"]{--cb-icon-bg: #1a87d5; --cb-icon-fg: #243044; --cb-icon-border: #ffffff; --cb-icon-radius: 2px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-9"]{--cb-icon-bg: #1f1f1f; --cb-icon-fg: #ffffff; --cb-icon-border: #ffffff; --cb-icon-radius: 7px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-10"]{--cb-icon-bg: #dfecff; --cb-icon-fg: #243044; --cb-icon-border: #5187ca; --cb-icon-radius: 13px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-11"]{--cb-icon-bg: #e7f0fb; --cb-icon-fg: #243044; --cb-icon-border: #5395df; --cb-icon-radius: 15px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-12"]{--cb-icon-bg: #ffeacf; --cb-icon-fg: #243044; --cb-icon-border: #e6a246; --cb-icon-radius: 19px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-13"]{--cb-icon-bg: #dfdfff; --cb-icon-fg: #243044; --cb-icon-border: #6876ee; --cb-icon-radius: 15px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-14"]{--cb-icon-bg: #ffe0e0; --cb-icon-fg: #243044; --cb-icon-border: #f14444; --cb-icon-radius: 17px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-15"]{--cb-icon-bg: #eff3ff; --cb-icon-fg: #243044; --cb-icon-border: #a2b6e7; --cb-icon-radius: 27px; --cb-icon-shadow: 0 4px 14px rgba(30,40,70,.25);}
html[data-cb-icon-style="icon-16"]{--cb-icon-bg: #262d36; --cb-icon-fg: #eceff4; --cb-icon-border: #eceff4; --cb-icon-radius: 6px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-17"]{--cb-icon-bg: #161616; --cb-icon-fg: #eeeeee; --cb-icon-border: #eeeeee; --cb-icon-radius: 4px; --cb-icon-shadow: 0 0 12px #eeeeee66;}
html[data-cb-icon-style="icon-18"]{--cb-icon-bg: #091821; --cb-icon-fg: #00ffe1; --cb-icon-border: #00ffe1; --cb-icon-radius: 3px; --cb-icon-shadow: 0 4px 14px rgba(30,40,70,.25);}
html[data-cb-icon-style="icon-19"]{--cb-icon-bg: #edf0f5; --cb-icon-fg: #243044; --cb-icon-border: #8997b5; --cb-icon-radius: 18px; --cb-icon-shadow: 0 2px 7px rgba(0,0,0,.10);}
html[data-cb-icon-style="icon-20"]{--cb-icon-bg: #f9ecdc; --cb-icon-fg: #243044; --cb-icon-border: #ad7f42; --cb-icon-radius: 23px; --cb-icon-shadow: 0 4px 14px rgba(30,40,70,.25);}
@media (prefers-reduced-motion: reduce){
html[data-cb-icon-style^="icon-"] .col > header.top button.rb{transition: none;}
}
html[data-cb-icon-size="small"][data-cb-icon-style^="icon-"] .col > header.top button.rb{width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important;}
html[data-cb-icon-size="medium"][data-cb-icon-style^="icon-"] .col > header.top button.rb{width: 38px !important; height: 38px !important; min-width: 38px !important; min-height: 38px !important;}
html[data-cb-icon-size="large"][data-cb-icon-style^="icon-"] .col > header.top button.rb{width: 46px !important; height: 46px !important; min-width: 46px !important; min-height: 46px !important;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #btnCur, #pillAI, .topq button, .pn-indicators button){background: var(--cb-icon-bg) !important; color: var(--cb-icon-fg) !important; border: 1px solid var(--cb-icon-border) !important; border-radius: var(--cb-icon-radius) !important; box-shadow: var(--cb-icon-shadow) !important;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #btnCur, #pillAI, .topq button, .pn-indicators button) :is(svg, path){color: inherit;}
html[data-cb-icon-style^="icon-"] .col > header.top #btnCur{padding: 0px 6px !important; min-width: 40px !important;}
html[data-cb-icon-style^="icon-"] .col > header.top #btnBell .dot{top: 1px !important; right: 1px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="extra-small"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #btnCur, #pillAI, .topq button){width: 28px !important; height: 28px !important; min-width: 28px !important; min-height: 28px !important; padding: 0px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="small"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #btnCur, #pillAI, .topq button){width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; padding: 0px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="medium"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #btnCur, #pillAI, .topq button){width: 38px !important; height: 38px !important; min-width: 38px !important; min-height: 38px !important; padding: 0px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="large"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #btnCur, #pillAI, .topq button){width: 46px !important; height: 46px !important; min-width: 46px !important; min-height: 46px !important; padding: 0px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="extra-small"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #pillAI, .topq button) svg{width: 15px !important; height: 15px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="small"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #pillAI, .topq button) svg{width: 17px !important; height: 17px !important;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="large"] .col > header.top :is(#btnAll, #btnHard, #btnBell, #btnMail, #btnMenu, #pillAI, .topq button) svg{width: 22px !important; height: 22px !important;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnAll, #btnBell, #btnMail, #btnMenu, #btnHard, #nexusChip) svg{stroke-width: var(--cb-glyph-stroke,1.8px) !important; stroke-linecap: var(--cb-glyph-cap,round);}
html[data-cb-icon-style="icon-8"],html[data-cb-icon-style="icon-16"]{--cb-glyph-stroke: 1.5px; --cb-glyph-cap: square;}
html[data-cb-icon-style="icon-9"],html[data-cb-icon-style="icon-17"]{--cb-glyph-stroke: 1.2px;}
html[data-cb-icon-style="icon-18"],html[data-cb-icon-style="icon-20"]{--cb-glyph-stroke: 2.3px;}
html[data-cb-icon-style^="icon-"] .col > header.top{align-items: center;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnCur, #btnAll, #btnHard, #btnBell, #btnMail, #btnMenu){vertical-align: middle; display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; box-sizing: border-box !important; flex-shrink: 0 !important;}
html[data-cb-icon-style^="icon-"] .col > header.top #btnCur{text-transform: uppercase; white-space: nowrap; color: var(--cb-icon-fg,#243044) !important; -webkit-text-fill-color: var(--cb-icon-fg,#243044) !important; opacity: 1 !important; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; font-weight: 800 !important; letter-spacing: 0px !important; text-align: center !important; overflow: visible !important; text-shadow: none !important; padding: 0px 7px !important;}
html[data-cb-icon-size="extra-small"][data-cb-icon-style^="icon-"] .col > header.top #btnCur{width: 44px !important; min-width: 44px !important; max-width: none !important; flex: 0 0 44px !important; font-size: 11px !important;}
html[data-cb-icon-size="small"][data-cb-icon-style^="icon-"] .col > header.top #btnCur{width: 50px !important; min-width: 50px !important; max-width: none !important; flex: 0 0 50px !important; font-size: 12px !important;}
html[data-cb-icon-size="medium"][data-cb-icon-style^="icon-"] .col > header.top #btnCur{width: 56px !important; min-width: 56px !important; max-width: none !important; flex: 0 0 56px !important; font-size: 13px !important;}
html[data-cb-icon-size="large"][data-cb-icon-style^="icon-"] .col > header.top #btnCur{width: 64px !important; min-width: 64px !important; max-width: none !important; flex: 0 0 64px !important; font-size: 15px !important;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnBell, #btnMail, #btnAll) svg{display: block; flex-shrink: 0; opacity: 1 !important; color: var(--cb-icon-fg,#243044) !important; stroke: currentcolor !important;}
@media (max-width: 680px){
html[data-cb-icon-style^="icon-"] .col > header.top #btnCur{margin-inline: 2px !important;}
}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="extra-small"]{--cb-top-uniform: 28px; --cb-currency-font: 9px;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="small"]{--cb-top-uniform: 32px; --cb-currency-font: 10px;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="medium"]{--cb-top-uniform: 38px; --cb-currency-font: 11px;}
html[data-cb-icon-style^="icon-"][data-cb-icon-size="large"]{--cb-top-uniform: 46px; --cb-currency-font: 13px;}
html[data-cb-icon-style^="icon-"] .col > header.top #btnCur{box-sizing: border-box !important; flex: 0 0 var(--cb-top-uniform,32px) !important; width: var(--cb-top-uniform,32px) !important; min-width: var(--cb-top-uniform,32px) !important; max-width: var(--cb-top-uniform,32px) !important; height: var(--cb-top-uniform,32px) !important; min-height: var(--cb-top-uniform,32px) !important; max-height: var(--cb-top-uniform,32px) !important; padding: 0px !important; margin-inline: 0px !important; border-radius: 50% !important; font-size: var(--cb-currency-font,10px) !important; font-weight: 700 !important; letter-spacing: -0.045em !important; line-height: 1 !important; text-align: center !important; text-transform: uppercase !important; overflow: hidden !important; white-space: nowrap !important;}
@media (max-width: 680px){
html[data-cb-icon-style^="icon-"] .col > header.top #btnCur{margin-inline: 0px !important;}
}
html[data-cb-icon-style^="icon-"] .col > header.top{--cb-toolbar-diameter: var(--cb-top-uniform,32px);}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnAll, #btnCur, #btnBell, #btnMail, #btnMenu, #btnHard){box-sizing: border-box !important; flex: 0 0 var(--cb-toolbar-diameter) !important; inline-size: var(--cb-toolbar-diameter) !important; block-size: var(--cb-toolbar-diameter) !important; min-inline-size: var(--cb-toolbar-diameter) !important; max-inline-size: var(--cb-toolbar-diameter) !important; min-block-size: var(--cb-toolbar-diameter) !important; max-block-size: var(--cb-toolbar-diameter) !important; padding: 0px !important; margin-inline: 0px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 50% !important; line-height: 1 !important; vertical-align: middle !important;}
html[data-cb-icon-style^="icon-"] .col > header.top #btnCur{font-size: var(--cb-currency-font,10px) !important; letter-spacing: -0.05em !important; font-weight: 700 !important;}
html[data-cb-icon-style^="icon-"] .col > header.top :is(#btnAll, #btnBell, #btnMail) svg{width: 52% !important; height: 52% !important; max-width: 22px !important; max-height: 22px !important;}
.col > header.top{--cb-toolbar-circle: 32px;}
html[data-cb-icon-size="extra-small"] .col > header.top{--cb-toolbar-circle: 28px;}
html[data-cb-icon-size="small"] .col > header.top{--cb-toolbar-circle: 32px;}
html[data-cb-icon-size="medium"] .col > header.top{--cb-toolbar-circle: 38px;}
html[data-cb-icon-size="large"] .col > header.top{--cb-toolbar-circle: 46px;}
html body .col > header.top :is(#btnHard, #btnAll, #btnCur, #btnBell, #btnMail){box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 var(--cb-toolbar-circle) !important; width: var(--cb-toolbar-circle) !important; min-width: var(--cb-toolbar-circle) !important; max-width: var(--cb-toolbar-circle) !important; height: var(--cb-toolbar-circle) !important; min-height: var(--cb-toolbar-circle) !important; max-height: var(--cb-toolbar-circle) !important; aspect-ratio: 1 / 1 !important; border-radius: 50% !important; padding: 0px !important; margin: 0px !important; white-space: nowrap !important; line-height: 1 !important;}
html body .col > header.top #btnCur{font-family: system-ui, -apple-system, sans-serif !important; font-size: clamp(9px,calc(var(--cb-toolbar-circle) * .31),13px) !important; font-weight: 750 !important; letter-spacing: -0.06em !important; text-align: center !important; overflow: hidden !important;}
html.cb-macos-home{--mac-ink: #243145; --mac-muted: #67778c; --mac-glass: rgba(248,251,255,.82); --mac-panel: rgba(255,255,255,.88); --mac-border: rgba(255,255,255,.72); --mac-accent: #2878e8; --ink: var(--mac-ink); --ink2: #435269; --mut: var(--mac-muted); --mut2: var(--mac-muted); --card: var(--mac-panel); --panel: var(--mac-glass);}
html.cb-macos-home[data-mode="dark"]{--mac-ink: #edf3ff; --mac-muted: #aab8ce; --mac-glass: rgba(27,35,54,.86); --mac-panel: rgba(31,41,61,.93); --mac-border: rgba(180,202,240,.15); --ink2: #c6d3e7;}
html.cb-macos-home body{background: radial-gradient(at 8% 8%, rgb(157, 207, 250) 0px, transparent 52%), radial-gradient(at 85% 80%, rgb(216, 186, 250) 0px, transparent 55%), linear-gradient(145deg, rgb(213, 229, 246), rgb(200, 210, 238) 48%, rgb(222, 231, 248)) !important;}
html.cb-macos-home[data-mode="dark"] body{background: radial-gradient(at 10% 10%, rgb(26, 73, 105) 0px, transparent 55%), radial-gradient(at 90% 85%, rgb(68, 49, 94) 0px, transparent 55%), rgb(16, 26, 45) !important;}
html.cb-macos-home .shell{border: 1px solid var(--mac-border); backdrop-filter: blur(28px); background: var(--mac-glass) !important; border-radius: 24px !important; box-shadow: rgba(19, 44, 75, 0.15) 0px 24px 70px !important;}
html.cb-macos-home :is(.side, header.top){border: 1px solid var(--mac-border); backdrop-filter: blur(20px); background: var(--mac-glass) !important; box-shadow: none !important; color: var(--mac-ink) !important;}
html.cb-macos-home .side .nav.on{background: color-mix(in srgb,var(--mac-accent) 14%,transparent) !important; color: var(--mac-accent) !important; border-radius: 10px !important;}
html.cb-macos-home .side :is(.nav, .ngh){color: var(--mac-ink);}
html.cb-macos-home #view-dash.cb-design-macos{font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--mac-ink); min-width: 0px; padding-bottom: 92px !important;}
html.cb-macos-home #view-dash.cb-design-macos :is(.card, .kpi, .kv-c, .gl-c, .cr-c, .bn-card, .tl-box){backdrop-filter: blur(16px); background: var(--mac-panel) !important; color: var(--mac-ink) !important; border: 1px solid var(--mac-border) !important; border-radius: 20px !important; box-shadow: rgba(20, 46, 74, 0.04) 0px 5px 20px !important;}
html.cb-macos-home #view-dash.cb-design-macos .head h1{font-size: 28px; letter-spacing: -1px; font-weight: 650;}
html.cb-macos-home #view-dash.cb-design-macos :is(.card small, .sub, .muted){color: var(--mac-muted);}
html.cb-macos-home #view-dash.cb-design-macos :is(.topg, .kpis, .d2){gap: 14px;}
html.cb-macos-home #view-dash.cb-design-macos .cb-macos-bar{align-items: center; gap: 18px; padding: 12px 16px; margin-bottom: 20px; border: 1px solid var(--mac-border); border-radius: 14px; background: var(--mac-glass); color: var(--mac-ink); min-width: 0px; display: flex !important;}
.cb-macos-lights{display: flex; gap: 7px; flex: 0 0 auto;}
.cb-macos-lights i{width: 11px; height: 11px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.082) 0px 0px 0px 1px inset;}
.cb-macos-lights .red{background: rgb(255, 96, 88);}
.cb-macos-lights .yellow{background: rgb(255, 189, 46);}
.cb-macos-lights .green{background: rgb(40, 200, 64);}
.cb-macos-title{font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 14px; min-width: 0px;}
.cb-macos-title small{font-size: 11px; font-weight: 400; color: var(--mac-muted);}
.cb-macos-add{margin-left: auto; flex: 0 0 auto; border: 1px solid var(--mac-border); border-radius: 9px; padding: 9px 12px; color: var(--mac-ink); background: var(--mac-panel); font-size: 12px; font-weight: 600;}
:is(.cb-macos-app, .cb-macos-add):focus-visible{outline: rgb(33, 133, 255) solid 3px; outline-offset: 3px;}
@media (min-width: 1101px){
html.cb-macos-home .shell{margin: 18px auto; max-width: 1640px; height: calc(100dvh - 36px); min-height: 0px;}
html.cb-macos-home .content{padding: 18px 22px;}
html.cb-macos-home .side{border-radius: 18px !important;}
}
@media (max-width: 767px){
html.cb-macos-home #view-dash.cb-design-macos{padding-bottom: 12px !important;}
.cb-macos-title small{display: none;}
html.cb-macos-home #view-dash.cb-design-macos .cb-macos-bar{gap: 10px; padding: 10px;}
.cb-macos-lights{gap: 4px;}
.cb-macos-lights i{width: 8px; height: 8px;}
.cb-macos-title{font-size: 12px;}
.cb-macos-add{font-size: 11px; padding: 8px;}
.cb-macos-lights{display: none;}
}
html.cb-macos-home #view-dash.cb-design-macos > .mac2-workspace{max-width: 1450px; margin: 0px auto; display: block !important;}
.mac2-workspace{--mac2-line: color-mix(in srgb,var(--mac-ink) 9%,transparent); --mac2-blue: #2878e8;}
.mac2-workspace .i{width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentcolor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;}
.mac2-period > button{color: var(--mac-ink);}
.mac2-balance-footer > span{white-space: nowrap;}
.mac2-heading{display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 26px 0px 18px;}
.mac2-heading > div > small{color: var(--mac-muted); font-size: 10px; font-weight: 750; letter-spacing: 2px;}
.mac2-heading h1{font-size: clamp(25px, 2.6vw, 38px); font-weight: 650; letter-spacing: -1.3px; margin: 9px 0px 7px; line-height: 1.15;}
.mac2-heading p{margin: 0px; color: var(--mac-muted); font-size: 13px;}
.mac2-period{display: flex; align-items: center; gap: 14px; margin: 0px 0px 20px; font-size: 12px;}
.mac2-period > button{display: grid; place-items: center; width: 28px; height: 28px; background: var(--mac-panel); border: 1px solid var(--mac2-line); border-radius: 8px;}
.mac2-period > button:disabled{opacity: 0.35; cursor: default;}
.mac2-period #dashSentinelSlot{margin-left: auto;}
.mac2-period svg{width: 15px; height: 15px;}
.mac2-grid{display: grid; grid-template-columns: minmax(0px, 1.45fr) minmax(0px, 1fr); gap: 18px; align-items: stretch;}
.mac2-card,.mac2-balance{border-radius: 20px; padding: 22px; min-width: 0px; border: 1px solid var(--mac-border); box-shadow: rgba(20, 46, 74, 0.03) 0px 5px 20px;}
.mac2-card{background: var(--mac-panel); color: var(--mac-ink);}
.mac2-balance{display: flex; flex-direction: column; justify-content: center; min-height: 220px; position: relative; overflow: hidden; background: radial-gradient(circle at 100% 0px, rgba(121, 198, 255, 0.46), transparent 55%), linear-gradient(125deg, rgb(24, 83, 172), rgb(55, 126, 228)); color: rgb(255, 255, 255); border-color: rgba(149, 186, 255, 0.4); padding: 30px;}
.mac2-balance::after{content: ""; position: absolute; width: 210px; height: 210px; border: 1px solid rgba(255, 255, 255, 0.094); border-radius: 50%; right: -55px; bottom: -100px; pointer-events: none;}
.mac2-eyebrow{font-size: 13px; color: rgb(225, 239, 255);}
.mac2-balance h2{font-size: clamp(30px, 3.3vw, 48px); font-weight: 650; letter-spacing: -1.6px; margin: 17px 0px 9px; overflow-wrap: anywhere; line-height: 1.05;}
.mac2-balance > p{font-size: 12px; color: rgb(222, 235, 255); margin: 0px;}
.mac2-balance-footer{display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 28px;}
.mac2-balance-footer > span{display: flex; align-items: center; gap: 8px; font-size: 11px; color: rgb(228, 239, 255);}
.mac2-balance-footer > button{width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.333); background: rgba(255, 255, 255, 0.094); border-radius: 50%; color: white;}
.mac2-card-head{display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px;}
.mac2-card-head h2{font-size: 14px; letter-spacing: -0.2px; font-weight: 700; margin: 0px;}
.mac2-card-head p{font-size: 11px; color: var(--mac-muted); margin: 7px 0px 0px;}
.mac2-link{display: flex; align-items: center; gap: 5px; padding: 4px 0px; background: none; border: 0px; color: var(--mac2-blue); font-size: 11px; white-space: nowrap;}
.mac2-link svg:first-child{display: none;}
.mac2-link svg{width: 13px; height: 13px;}
.mac2-row{display: flex; align-items: center; width: 100%; text-align: left; gap: 11px; padding: 12px 0px; background: none; border-right: 0px; border-bottom: 0px; border-left: 0px; border-image: none; border-top: 1px solid var(--mac2-line); color: var(--mac-ink);}
.mac2-row > span:not(.mac2-symbol){display: grid; gap: 5px; min-width: 0px; flex: 1 1 0%;}
.mac2-row b{font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;}
.mac2-row small{color: var(--mac-muted); font-size: 10px;}
.mac2-row strong{font-size: 12px; font-weight: 650; white-space: nowrap; margin-left: auto;}
.mac2-symbol{display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; background: color-mix(in srgb,var(--mac2-blue) 9%,transparent); border-radius: 11px; color: var(--mac2-blue);}
.mac2-symbol svg{width: 17px; height: 17px;}
.mac2-symbol.expense,.mac2-symbol.bill{background: rgba(245, 154, 39, 0.1); color: rgb(217, 133, 34);}
.mac2-row strong.expense{color: var(--mac-ink);}
.mac2-row strong.income{color: rgb(36, 158, 123);}
.mac2-metrics{grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 18px;}
.mac2-metrics > .mac2-card{position: relative; display: flex; flex-direction: column; text-align: left; padding: 23px; gap: 11px; cursor: pointer;}
.mac2-metrics small{font-size: 12px; color: var(--mac-muted); max-width: calc(100% - 44px);}
.mac2-metrics strong{font-size: clamp(21px, 2vw, 29px); font-weight: 650; letter-spacing: -0.8px; overflow-wrap: anywhere;}
.mac2-caption{font-size: 10px; color: var(--mac-muted);}
.mac2-metric-icon{position: absolute; top: 18px; right: 18px; display: grid; place-items: center; width: 31px; height: 31px; background: rgba(145, 118, 217, 0.094); border-radius: 10px; color: rgb(136, 112, 203);}
.mac2-metric-icon.income{color: rgb(41, 165, 132); background: rgba(41, 165, 132, 0.094);}
.mac2-metric-icon.expense{color: rgb(229, 151, 55); background: rgba(229, 151, 55, 0.094);}
.mac2-metric-icon svg{width: 16px; height: 16px;}
.mac2-chart-bars{display: flex; gap: 12px; height: 180px; margin: 25px 0px 0px; border-bottom: 1px solid var(--mac2-line);}
.mac2-month{display: flex; flex: 1 1 0%; min-width: 0px; flex-direction: column; align-items: center; justify-content: flex-end; gap: 12px;}
.mac2-bars{width: 100%; height: 150px; display: flex; align-items: flex-end; justify-content: center; gap: 5px; background: repeating-linear-gradient(to top,transparent 0,transparent 49px,var(--mac2-line) 50px);}
.mac2-bars > i{display: block; flex: 1 1 0%; max-width: 24px; border-radius: 5px 5px 0px 0px; background: linear-gradient(rgb(97, 168, 255), rgb(52, 123, 224));}
.mac2-bars > i.expense{background: linear-gradient(rgb(199, 182, 239), rgb(156, 131, 210));}
.mac2-month > small{font-size: 10px; color: var(--mac-muted); padding-bottom: 7px;}
.mac2-legend{display: flex; align-items: center; gap: 5px; font-size: 9px; color: var(--mac-muted);}
.mac2-legend i{width: 7px; height: 7px; border-radius: 2px; background: rgb(64, 136, 233);}
.mac2-legend i.expense{background: rgb(180, 155, 223); margin-left: 5px;}
.mac2-category{margin: 19px 0px;}
.mac2-category > div{display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 11px; margin-bottom: 9px;}
.mac2-category > div > span{display: flex; align-items: center; gap: 8px;}
.mac2-category > div > span > i{width: 7px; height: 7px; border-radius: 50%;}
.mac2-category b{font-size: 11px; font-weight: 650;}
.mac2-track{display: block; height: 5px; border-radius: 10px; background: var(--mac2-line); overflow: hidden;}
.mac2-track > i{display: block; height: 100%; border-radius: 10px;}
.mac2-plan{display: flex; align-items: center; justify-content: space-between; gap: 9px; width: 100%; padding: 13px; margin: 18px 0px 0px; background: color-mix(in srgb,var(--mac2-blue) 7%,transparent); color: var(--mac2-blue); border: 0px; border-radius: 12px; font-size: 12px;}
.mac2-plan svg{width: 17px; height: 17px;}
@media (max-width: 1000px){
.mac2-grid{grid-template-columns: minmax(0px, 1.2fr) minmax(0px, 1fr); gap: 12px;}
.mac2-metrics{gap: 12px;}
.mac2-card{padding: 16px;}
.mac2-metrics > .mac2-card{padding: 18px;}
.mac2-legend{flex-wrap: wrap;}
.mac2-row strong{font-size: 11px;}
}
@media (max-width: 767px){
.mac2-heading{align-items: flex-start; margin-top: 20px; gap: 10px;}
.mac2-heading h1{font-size: 26px;}
.mac2-heading p{font-size: 11px;}
.mac2-grid{grid-template-columns: minmax(0px, 1fr);}
.mac2-metrics{grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px;}
.mac2-metrics > .mac2-card:last-child{grid-column: 1 / -1;}
.mac2-metrics > .mac2-card{padding: 17px;}
.mac2-metrics small{font-size: 11px;}
.mac2-metric-icon{right: 10px; top: 12px; width: 24px; height: 24px;}
.mac2-balance{min-height: 210px; padding: 25px;}
.mac2-balance h2{font-size: 38px;}
.mac2-card-head{margin-bottom: 12px;}
.mac2-card{padding: 18px;}
}
html.cb-macos-home{--soft: rgba(218,232,250,.45); --line: rgba(76,105,149,.13); --bd: rgba(76,105,149,.18); --g1: #245aa4; --g2: #2878e8; --gsoft: rgba(40,120,232,.09); --shell: var(--mac-glass); --font: -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
html.cb-macos-home[data-mode="dark"]{--soft: rgba(93,119,161,.15); --line: rgba(180,202,240,.13); --bd: rgba(180,202,240,.2); --g1: #8bbdff; --g2: #74aeff; --gsoft: rgba(116,174,255,.12);}
html.cb-macos-home :is(.content, .view){color: var(--mac-ink); font-family: var(--font);}
html.cb-macos-home .view .head h1{font-weight: 650; letter-spacing: -0.8px;}
html.cb-macos-home .view :is(.card, .panel, .apanel, .stat, .sc, .bw-card, .bw-stat, .pt-card, .pt-stats article, .ge-receipt, .ge-admin-item, .loan-card, .bill-card, .doc-card, .pp-card, .as-card, .emcard){color: var(--mac-ink); background: var(--mac-panel) !important; border: 1px solid var(--mac-border) !important; border-radius: 18px !important; box-shadow: rgba(20, 46, 74, 0.03) 0px 5px 20px !important;}
html.cb-macos-home .view :is(.filters, .tabs, .chips){border-color: var(--line);}
html.cb-macos-home .view :is(.field, .seg, .pt-tabs, .bw-tabs){background: var(--mac-glass); border-color: var(--bd); border-radius: 12px;}
html.cb-macos-home .view :is(.btn, .mini, .chip, .tab, .pg){border-radius: 10px;}
html.cb-macos-home .view .btn.p{box-shadow: rgba(40, 120, 232, 0.125) 0px 3px 9px; background: rgb(40, 120, 232) !important; color: rgb(255, 255, 255) !important; border-color: rgb(40, 120, 232) !important;}
html.cb-macos-home .view :is(.chip.on, .tab.on, .pg.on){color: var(--g1); background: var(--gsoft);}
html.cb-macos-home .view :is(table, .tw, .bw-table){border-color: var(--line);}
html.cb-macos-home .view th{color: var(--mac-muted); border-color: var(--line); background: var(--soft) !important;}
html.cb-macos-home .view td{border-color: var(--line);}
html.cb-macos-home .view tr.r:hover{background: var(--gsoft);}
html.cb-macos-home :is(.view, .dlg) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea){background-color: var(--mac-panel); border-color: var(--bd); color: var(--mac-ink); border-radius: 10px;}
html.cb-macos-home :is(.view, .dlg) :is(input, select, textarea):focus-visible{outline: 2px solid var(--g2); outline-offset: 2px;}
html.cb-macos-home :is(dialog, .dlg){background: var(--mac-panel); color: var(--mac-ink); border-radius: 20px; border-color: var(--mac-border);}
html.cb-macos-home dialog::backdrop{background: rgba(16, 30, 54, 0.25); backdrop-filter: blur(5px);}
html.cb-macos-home :is(#view-settings .cb-appearance-settings, #view-settings .cb-toolbar-icon-settings){background: var(--mac-glass); border-color: var(--bd);}
@media (min-width: 768px){
html.cb-macos-home:not(.gapp):not(.mapp) .content{padding-bottom: 110px !important;}
}
@media print{
.cb-macos-bar{display: none !important;}
}
html.cb-ubuntu-home{color-scheme: light; --mac-ink: #292929; --mac-muted: #66616a; --mac-glass: rgba(246,245,244,.97); --mac-panel: #fff; --mac-border: rgba(50,39,45,.12); --mac-accent: #e95420; --mac2-blue: #c74312; --g1: #a9320b; --g2: #d84713; --gsoft: #e9542014; --soft: #f0eeed; --line: #34252c17; --bd: #34252c29; --font: "Ubuntu","Noto Sans","Segoe UI",system-ui,sans-serif;}
html.cb-ubuntu-home[data-mode="dark"]{color-scheme: dark; --mac-ink: #f6f5f4; --mac-muted: #b8b2bc; --mac-glass: rgba(35,32,37,.98); --mac-panel: #302c32; --mac-border: #ffffff16; --mac-accent: #ff865c; --g1: #ff9976; --g2: #ff865c; --gsoft: #e9542026; --soft: #3a353d; --line: #ffffff13; --bd: #ffffff25;}
html.cb-ubuntu-home header.top{border-color: rgba(255, 255, 255, 0.082); background: rgb(37, 34, 40) !important; color: rgb(250, 249, 251) !important;}
html.cb-ubuntu-home body{background: radial-gradient(at 15% 90%, rgb(164, 54, 101) 0px, transparent 55%), radial-gradient(at 85% 10%, rgb(119, 33, 111) 0px, transparent 60%), linear-gradient(145deg, rgb(44, 0, 30), rgb(94, 39, 80) 60%, rgb(119, 33, 111)) !important;}
html.cb-ubuntu-home .shell{border-color: rgba(255, 255, 255, 0.14); backdrop-filter: none; background: var(--mac-glass) !important; border-radius: 16px !important; box-shadow: rgba(22, 1, 14, 0.4) 0px 18px 70px !important;}
html.cb-ubuntu-home .side{border-color: var(--line); backdrop-filter: none; background: var(--soft) !important; border-radius: 12px !important;}
html.cb-ubuntu-home .side .nav.on{background: rgb(199, 67, 18) !important; color: rgb(255, 255, 255) !important; border-radius: 8px !important;}
html.cb-ubuntu-home body :is(.col, .side) > header.top{border-color: rgba(255, 255, 255, 0.082); backdrop-filter: none; border-radius: 10px; background: rgb(37, 34, 40) !important; color: rgb(250, 249, 251) !important;}
html.cb-ubuntu-home body :is(.col, .side) > header.top :is(#btnAll, #btnCur, #btnBell, #btnMail, #btnMenu){background: rgba(255, 255, 255, 0.043) !important; color: rgb(250, 249, 251) !important; border-color: rgba(255, 255, 255, 0.1) !important; box-shadow: none !important;}
html.cb-ubuntu-home body :is(.col, .side) > header.top :is(.gsearch, .topmonth){background: rgba(255, 255, 255, 0.04); color: rgb(255, 255, 255); border-color: rgba(255, 255, 255, 0.1);}
html.cb-ubuntu-home .view :is(.head h1, .mac2-heading h1){letter-spacing: -0.6px; font-weight: 700;}
html.cb-ubuntu-home .view :is(.card, .panel, .apanel, .stat, .sc, .bw-card, .bw-stat, .pt-card, .pt-stats article, .ge-receipt, .ge-admin-item, .loan-card, .bill-card, .doc-card, .pp-card, .as-card, .emcard, .mac2-card){border-radius: 12px !important; box-shadow: rgba(36, 25, 35, 0.035) 0px 2px 8px !important;}
html.cb-ubuntu-home .view :is(.sub, .muted, .card small, .panel small, .apanel small){color: var(--mac-muted);}
html.cb-ubuntu-home .view .btn.p{box-shadow: none; background: rgb(199, 67, 18) !important; border-color: rgb(199, 67, 18) !important;}
html.cb-ubuntu-home :is(.view, .dlg) :is(input, select, textarea):focus-visible{outline-color: rgb(233, 84, 32);}
html.cb-ubuntu-home :is(dialog, .dlg){border-radius: 14px;}
html.cb-ubuntu-home #view-dash .cb-macos-bar{background: var(--soft); border-color: var(--line); border-radius: 11px; box-shadow: rgba(255, 255, 255, 0.082) 0px 1px inset;}
html.cb-ubuntu-home .cb-macos-lights{display: none;}
html.cb-ubuntu-home .cb-macos-title::before{content: ""; width: 13px; height: 13px; flex: 0 0 auto; background: rgb(233, 84, 32); border: 4px solid rgb(233, 84, 32); border-radius: 50%; box-shadow: rgb(255, 255, 255) 0px 0px 0px 2px inset;}
html.cb-ubuntu-home .cb-macos-add{background: rgb(199, 67, 18); color: white; border-color: rgb(199, 67, 18);}
html.cb-ubuntu-home .mac2-workspace{--mac2-blue: #c74312; --mac2-line: var(--line);}
html.cb-ubuntu-home[data-mode="dark"] .mac2-workspace{--mac2-blue: #ff9976;}
html.cb-ubuntu-home .mac2-balance{border-radius: 14px; background: radial-gradient(circle at 95% 10%, rgba(247, 158, 112, 0.27), transparent 60%), linear-gradient(125deg, rgb(94, 39, 80), rgb(168, 62, 78) 55%, rgb(199, 67, 18)); border-color: rgba(255, 255, 255, 0.133); box-shadow: none;}
html.cb-ubuntu-home .mac2-balance :is(.mac2-eyebrow, p, .mac2-balance-footer > span){color: rgb(251, 232, 232);}
html.cb-ubuntu-home .mac2-balance h2{color: white;}
html.cb-ubuntu-home .mac2-bars > i{background: linear-gradient(rgb(245, 138, 99), rgb(233, 84, 32));}
html.cb-ubuntu-home .mac2-bars > i.expense{background: linear-gradient(rgb(182, 140, 187), rgb(119, 33, 111));}
html.cb-ubuntu-home .mac2-legend i{background: rgb(233, 84, 32);}
html.cb-ubuntu-home .mac2-legend i.expense{background: rgb(158, 109, 167);}
@media (min-width: 1101px){
html.cb-ubuntu-home .shell{margin: 18px 18px 18px 98px; max-width: none; height: calc(100dvh - 36px);}
html.cb-ubuntu-home:not(.gapp):not(.mapp) .content{padding-bottom: 30px !important;}
}
@media (min-width: 768px) and (max-width: 1100px){
html.cb-ubuntu-home .shell{margin-left: 8px; margin-right: 8px;}
}
@media (max-width: 767px){
html.cb-macos-home #view-dash.cb-design-macos .cb-macos-bar{flex-wrap: wrap;}
}
html[data-cb-widget-theme="macos"] .mac2-card{backdrop-filter: blur(18px); border-radius: 22px !important; box-shadow: rgba(26, 52, 93, 0.047) 0px 7px 24px !important;}
html[data-cb-widget-theme="macos"] .mac2-metrics > .mac2-card{background: linear-gradient(145deg,color-mix(in srgb,var(--mac-panel) 94%,#afcaff),var(--mac-panel)); border-top: 1px solid var(--mac-border);}
html[data-cb-widget-theme="macos"] .mac2-metric-icon{border-radius: 50%; width: 34px; height: 34px; box-shadow: rgba(255, 255, 255, 0.267) 0px 1px inset;}
html[data-cb-widget-theme="macos"] .mac2-card-head h2{font-weight: 650; letter-spacing: -0.25px;}
html[data-cb-widget-theme="ubuntu"] .mac2-card{backdrop-filter: none; border: 1px solid var(--bd) !important; border-radius: 10px !important; box-shadow: rgba(29, 14, 24, 0.03) 0px 2px 5px !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-card-head{background: var(--soft); border-bottom: 1px solid var(--line); margin: -22px -22px 14px; padding: 13px 18px; border-radius: 10px 10px 0px 0px; min-height: 48px;}
html[data-cb-widget-theme="ubuntu"] .mac2-card-head h2{font-weight: 700; font-size: 13px; letter-spacing: 0px;}
html[data-cb-widget-theme="ubuntu"] .mac2-metrics > .mac2-card{background: var(--mac-panel); padding-top: 20px; border-top: 3px solid rgb(233, 84, 32) !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-metric-icon{background: rgba(233, 84, 32, 0.094); color: var(--g1); border-radius: 6px; box-shadow: none; width: 32px; height: 32px;}
html[data-cb-widget-theme="ubuntu"] .mac2-metrics > .mac2-card:last-child{border-top-color: rgb(119, 33, 111) !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-metrics > .mac2-card:last-child .mac2-metric-icon{background: rgba(119, 33, 111, 0.1); color: rgb(153, 84, 143);}
html[data-cb-widget-theme="ubuntu"] .mac2-symbol{border-radius: 6px; background: rgba(233, 84, 32, 0.08); color: var(--g1);}
html[data-cb-widget-theme="ubuntu"] .mac2-plan{border-radius: 7px; border: 1px solid var(--bd); background: var(--soft); font-weight: 600;}
html[data-cb-widget-theme="ubuntu"] .mac2-track{height: 7px; border-radius: 3px;}
html[data-cb-widget-theme="ubuntu"] .mac2-track > i{border-radius: 3px;}
html[data-cb-widget-theme="ubuntu"] .mac2-category:nth-of-type(4n+2) :is(.mac2-track > i, div > span > i){background: rgb(233, 84, 32) !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-category:nth-of-type(4n+3) :is(.mac2-track > i, div > span > i){background: rgb(119, 33, 111) !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-category:nth-of-type(4n+4) :is(.mac2-track > i, div > span > i){background: rgb(14, 132, 32) !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-category:nth-of-type(4n+1) :is(.mac2-track > i, div > span > i){background: rgb(52, 101, 164) !important;}
html[data-cb-widget-theme="ubuntu"] .mac2-bars > i{border-radius: 2px 2px 0px 0px; background: rgb(233, 84, 32);}
html[data-cb-widget-theme="ubuntu"] .mac2-bars > i.expense{background: rgb(153, 86, 155);}
@media (min-width: 1101px){
html[data-cb-widget-theme="ubuntu"] .mac2-grid{grid-template-columns: minmax(0px, 1.7fr) minmax(0px, 1fr); gap: 16px;}
html[data-cb-widget-theme="ubuntu"] .mac2-row{padding-top: 14px; padding-bottom: 14px;}
}
@media (max-width: 1000px){
html[data-cb-widget-theme="ubuntu"] .mac2-card-head{margin: -16px -16px 12px; padding: 12px 16px;}
}
@media (max-width: 767px){
html[data-cb-widget-theme="ubuntu"] .mac2-card-head{margin: -18px -18px 12px; padding: 12px 16px;}
html[data-cb-widget-theme="macos"] .mac2-metric-icon{width: 26px; height: 26px;}
}
@media (min-width: 641px) and (max-width: 1599px){
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .shell{grid-template-columns: 196px minmax(0px, 1fr) !important; grid-template-rows: minmax(0px, 1fr) !important; width: calc(100% - 16px) !important; max-width: none !important; height: calc(var(--cb-viewport-height,100dvh) - 16px) !important; min-height: 0px !important; margin: 8px !important; padding: 6px !important; gap: 8px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side{scrollbar-width: none; display: flex !important; flex-direction: column !important; align-items: stretch !important; position: relative !important; inset: auto !important; width: 196px !important; height: 100% !important; min-width: 0px !important; min-height: 0px !important; padding: 16px 12px !important; gap: 0px !important; overflow: hidden auto !important; border-radius: 16px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side #menuMain{flex: 0 0 auto; display: block !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .ng{flex: 0 0 auto; position: static; display: grid !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngb{max-height: 0px; overflow: hidden; display: grid !important; position: static !important; min-width: 0px !important; padding: 0px 0px 0px 6px !important; background: none !important; box-shadow: none !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .ng.open > .ngb{max-height: 1800px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngh{align-items: center; gap: 8px; min-height: 44px; height: auto; width: 100%; white-space: normal; display: flex !important; padding: 8px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngh > .i{display: block !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side :is(.brand b, .sigw){display: block !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .brand{align-items: center; gap: 7px; flex: 0 0 auto; display: flex !important; padding: 0px 2px 10px !important; margin: 0px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .brand b{font-size: 13px; white-space: nowrap;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .brand .logo{width: 28px; height: 28px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .sec{align-items: center; justify-content: space-between; margin: 12px 8px 6px; min-height: 30px; display: flex !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .sep{margin: 8px 4px; display: block !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav{display: flex !important; flex: 0 0 auto !important; flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; width: 100% !important; min-width: 0px !important; min-height: 44px !important; height: auto !important; padding: 8px !important; margin: 0px !important; border-radius: 10px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav .i{flex: 0 0 auto; display: block !important; width: 18px !important; height: 18px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav span{min-width: 0px; text-align: left; display: block !important; font-size: 13px !important; line-height: 1.3 !important; white-space: normal !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav::after{display: none !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nrow{justify-content: space-between; gap: 4px; padding: 0px; flex: 0 0 auto; display: flex !important; flex-direction: row !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nrow .nav{width: auto !important; flex: 1 1 0px !important; justify-content: center !important; padding: 8px 2px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .nrow .nav span{display: none !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .side .sidetools{align-items: center; justify-content: space-between; max-width: 100%; min-height: 44px; flex: 0 0 auto; display: flex !important; margin: 4px 0px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .col{min-width: 0px; min-height: 0px; height: 100%; gap: 8px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body header.top{display: flex !important; flex-flow: wrap !important; align-items: center !important; gap: 6px !important; padding: 8px 10px !important; min-width: 0px !important; min-height: 60px !important; height: auto !important; width: 100% !important; position: relative !important; inset: auto !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body header.top .gsearch{flex: 1 1 150px !important; min-width: 120px !important; max-width: none !important; width: auto !important; height: 44px !important; order: 0 !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body header.top :is(.rb, .pill:not([hidden])){min-height: 44px !important; flex-shrink: 0;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body header.top .rb{width: 44px !important; height: 44px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body header.top :is(.sp, .kbd){display: none !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body header.top .topmonth{max-width: 100%; flex-wrap: wrap; zoom: 1 !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .content{min-width: 0px; min-height: 0px; overflow: hidden auto; padding: 14px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .view{min-width: 0px; max-width: 100%; overflow-wrap: break-word;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body #view-dash.cb-design-macos{padding-bottom: 0px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.head, .head .actions, .filters, .brow){flex-wrap: wrap; min-width: 0px; max-width: 100%;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .head h1{font-size: 28px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.kpis, .stats, .asum.c4){grid-template-columns: repeat(2, minmax(0px, 1fr)) !important; gap: 12px !important;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.dgrid, .d2, .rgrid, .sgrid, .pgrid, .pcols, .abody, .cgrid, .egrid, .dgrid2, .aiw){min-width: 0px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.card, .kpi, .stat, .panel, .field){min-width: 0px; max-width: 100%;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.tw, .bw-table){max-width: 100%; overflow-x: auto;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .filters > *{max-width: 100%; min-width: 0px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea){font-size: 16px; max-width: 100%;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.btn, .mini, .chip, .tab, .pg){min-height: 44px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.btn, .mini){height: auto; white-space: normal;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body dialog{max-width: calc(-32px + 100vw); max-height: calc(100dvh - 32px);}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body dialog .dlg{max-height: calc(100dvh - 32px); overflow: auto;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-grid{gap: 14px; grid-template-columns: minmax(0px, 1.25fr) minmax(0px, 1fr);}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-card{padding: 16px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-metrics{gap: 12px; grid-template-columns: repeat(3, minmax(0px, 1fr));}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-metrics > .mac2-card{padding: 18px 14px; gap: 12px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-metrics strong{font-size: 24px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-card-head{flex-wrap: wrap; gap: 8px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-period > button{width: 44px; height: 44px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body :is(.mac2-link, .mac2-balance-footer > button){min-width: 44px; min-height: 44px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-row{min-height: 58px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-heading{margin-top: 18px;}
html:root:where([data-cb-tablet], [data-cb-compact-window], .cb-tablet-preview).cb-ubuntu-home body .mac2-card:not(.mac2-balance) > .mac2-card-head{margin: -16px -16px 16px; padding: 12px 16px;}
}
@media (min-width: 641px) and (max-width: 900px){
html:root:not(.gapp):not(.mapp) body :is(.d2, .rgrid, .sgrid, .pgrid, .pcols, .abody, .cgrid, .egrid, .dgrid2, .aiw){grid-template-columns: minmax(0px, 1fr) !important;}
html:root:not(.gapp):not(.mapp) body .d2 > .card{grid-area: auto !important;}
html:root:not(.gapp):not(.mapp) body .mac2-grid{grid-template-columns: minmax(0px, 1fr);}
html:root:not(.gapp):not(.mapp) body .mac2-balance{min-height: 200px; padding: 24px;}
html:root:not(.gapp):not(.mapp) body .mac2-heading h1{font-size: 28px;}
html:root:not(.gapp):not(.mapp) body .mac2-metrics strong{font-size: 22px;}
html:root:not(.gapp):not(.mapp) body .mac2-metrics small{font-size: 12px; max-width: none; padding-top: 28px;}
html:root:not(.gapp):not(.mapp) body .mac2-metric-icon{top: 12px; left: 14px; right: auto;}
}
html:root:not(.gapp):not(.mapp) body .content{container: cbpage / inline-size; --cb-card-padding: clamp(12px,2cqi,22px); --cb-card-gap: clamp(10px,1.5cqi,18px);}
html:root:not(.gapp):not(.mapp) body .view :is(.card, .panel, .kpi, .stat, .bw-card, .bw-stat, .pt-card, .as-card, .loan-card, .bill-card, .doc-card, .emcard){min-width: 0px; max-width: 100%; height: auto; padding: var(--cb-card-padding,16px) !important;}
html:root:not(.gapp):not(.mapp) body .view :is(.kpis, .stats, .asum, .dsum, .bw-stats, .cards){display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)) !important; gap: var(--cb-card-gap,12px) !important;}
html:root:not(.gapp):not(.mapp) body .mac2-grid{gap: var(--cb-card-gap,14px);}
html:root:not(.gapp):not(.mapp) body .mac2-card,html:root:not(.gapp):not(.mapp) body .mac2-metrics > .mac2-card{min-width: 0px; height: auto; padding: var(--cb-card-padding,16px) !important;}
html:root:not(.gapp):not(.mapp) body .mac2-metrics{grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)) !important; gap: var(--cb-card-gap,12px) !important;}
html:root:not(.gapp):not(.mapp) body .mac2-metrics > .mac2-card:last-child{grid-column: auto !important;}
html:root:not(.gapp):not(.mapp) body .mac2-balance{min-height: clamp(170px, 24cqi, 230px); padding: clamp(18px, 3cqi, 30px) !important;}
html:root:not(.gapp):not(.mapp) body .mac2-metrics strong{font-size: clamp(21px, 3cqi, 29px) !important; overflow-wrap: anywhere;}
html:root:not(.gapp):not(.mapp) body .mac2-card-head{flex-wrap: wrap;}
html:root.cb-ubuntu-home:not(.gapp):not(.mapp) body .mac2-card:not(.mac2-balance) > .mac2-card-head{margin: calc(-1 * var(--cb-card-padding,16px)) calc(-1 * var(--cb-card-padding,16px)) var(--cb-card-padding,16px) !important; padding: 12px var(--cb-card-padding,16px) !important;}
@container cbpage (max-width: 759px){
html:root:not(.gapp):not(.mapp) body .mac2-grid{grid-template-columns: minmax(0px, 1fr) !important;}
html:root:not(.gapp):not(.mapp) body .view :is(.rgrid, .sgrid, .pgrid, .pcols, .abody, .cgrid, .egrid, .dgrid2, .aiw){grid-template-columns: minmax(0px, 1fr) !important;}
html:root:not(.gapp):not(.mapp) body #view-dash .d2{grid-template-columns: minmax(0px, 1fr) !important; grid-template-rows: auto !important;}
html:root:not(.gapp):not(.mapp) body #view-dash .d2 > .card{grid-area: auto !important;}
html:root:not(.gapp):not(.mapp) body .mac2-metrics small{max-width: none; padding-top: 28px;}
html:root:not(.gapp):not(.mapp) body .mac2-metric-icon{top: 12px; left: var(--cb-card-padding,16px); right: auto;}
}
@container cbpage (min-width: 760px){
html:root:not(.gapp):not(.mapp) body .mac2-grid{grid-template-columns: minmax(0px, 1.25fr) minmax(0px, 1fr) !important;}
}
@media (min-width: 1200px){
html:root:not(.cb-macos-home):not(.rail):not(.nomenu):not(.gbar):not(.gapp):not(.mapp):not([data-skin="coral"]):not([data-skin="glass"]):not([data-skin="kova"]) body .shell{grid-template-columns: 224px minmax(0px, 1fr);}
html:root:not(.cb-macos-home):not(.rail):not(.gbar):not([data-skin="coral"]):not([data-skin="glass"]):not([data-skin="kova"]) body .side .nav{height: auto; min-height: 42px; padding: 9px 10px; gap: 10px;}
html:root:not(.cb-macos-home):not(.rail):not(.gbar):not([data-skin="coral"]):not([data-skin="glass"]):not([data-skin="kova"]) body .side .nav span{min-width: 0px; white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3;}
}
#view-settings.cb-windows-settings{--cbs-bg: #f0f5fa; --cbs-panel: #fbfcfedd; --cbs-text: #222b35; --cbs-muted: #606c78; --cbs-line: #dce4ec; --cbs-hover: #e4ebf2; --cbs-active: #e0e9f1; --cbs-accent: #087ca5; border-radius: 16px; padding: 22px; min-width: 0px; font-family: "Segoe UI", Inter, system-ui, sans-serif; background: var(--cbs-bg) !important; color: var(--cbs-text) !important;}
#view-settings.cb-windows-settings[data-settings-mode="dark"]{--cbs-bg: #1c242d; --cbs-panel: #29323ee8; --cbs-text: #f0f3f7; --cbs-muted: #b5c0cc; --cbs-line: #404b58; --cbs-hover: #323e4c; --cbs-active: #354859; --cbs-accent: #80d5ed;}
#view-settings.cb-windows-settings > .head,#view-settings.cb-windows-settings > .shub,#view-settings.cb-windows-settings > .sgtop{display: none !important;}
#view-settings.cb-windows-settings .cb-settings-layout{display: grid; grid-template-columns: 215px minmax(0px, 1fr); gap: 32px; min-width: 0px; align-items: start;}
#view-settings.cb-windows-settings .cb-settings-sidebar{position: sticky; top: 12px; min-width: 0px; align-self: start;}
#view-settings.cb-windows-settings .cb-settings-identity{display: flex; gap: 12px; align-items: center; margin: 1px 0px 24px; min-width: 0px;}
.cb-settings-identity img{width: 44px; height: 44px; object-fit: contain;}
.cb-settings-identity > div{min-width: 0px;}
.cb-settings-identity b{display: block; font-size: 13px; font-weight: 600; color: var(--cbs-text);}
.cb-settings-identity small{display: block; overflow: hidden; text-overflow: ellipsis; font-size: 10px; color: var(--cbs-muted); white-space: nowrap; margin-top: 4px;}
#view-settings.cb-windows-settings .cb-settings-search{display: flex; align-items: center; gap: 7px; border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-bottom: 1px solid var(--cbs-muted); border-radius: 5px; background: var(--cbs-panel); padding: 0px 9px; margin-bottom: 18px; height: 33px;}
.cb-settings-search svg{height: 14px; width: 14px; color: var(--cbs-muted); order: 2; flex-shrink: 0;}
#view-settings.cb-windows-settings .cb-settings-search input{border-radius: 0px; outline: 0px; font-size: 12px; padding: 0px; height: 30px; width: 100%; min-width: 0px; background: transparent !important; color: var(--cbs-text) !important; border: 0px !important; box-shadow: none !important;}
.cb-settings-search:focus-within{outline: 2px solid var(--cbs-accent); outline-offset: 2px;}
#view-settings.cb-windows-settings .cb-settings-sidebar nav{display: grid; gap: 5px;}
.cb-settings-sidebar nav button{display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; position: relative; background: transparent; border: 0px; border-radius: 6px; padding: 11px 12px; font: 12px "Segoe UI", system-ui, sans-serif; color: var(--cbs-text); cursor: pointer; min-height: 39px;}
.cb-settings-sidebar nav button:hover{background: var(--cbs-hover);}
.cb-settings-sidebar nav button[aria-current="page"]{background: var(--cbs-active); font-weight: 500;}
.cb-settings-sidebar nav button[aria-current="page"]::before{content: ""; position: absolute; left: 0px; top: 12px; bottom: 12px; width: 3px; background: var(--cbs-accent); border-radius: 3px;}
.cb-settings-nav-icon{display: grid; place-items: center; color: var(--cbs-accent);}
.cb-settings-nav-icon svg{width: 17px; height: 17px;}
#view-settings.cb-windows-settings .cb-settings-main{min-width: 0px;}
.cb-settings-heading{display: flex; gap: 10px; align-items: center; margin-bottom: 24px; min-height: 35px;}
#view-settings.cb-windows-settings .cb-settings-heading h1{font-size: 25px; letter-spacing: -0.5px; font-weight: 600; margin: 0px; color: var(--cbs-text);}
.cb-settings-back{background: transparent; border: 0px; color: var(--cbs-text); font: 26px system-ui; cursor: pointer; padding: 0px 8px 2px 0px;}
.cb-settings-heading [hidden]{display: none !important;}
.cb-personalization-hero{display: grid; grid-template-columns: minmax(200px, 0.95fr) minmax(260px, 1.05fr); gap: 28px; align-items: start; margin-bottom: 26px;}
.cb-settings-monitor-wrap{padding-top: 8px;}
.cb-settings-monitor{border: 5px solid rgb(22, 28, 34); border-radius: 10px; background: rgb(22, 28, 34); aspect-ratio: 1.64 / 1; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.133) 0px 1px 1px; position: relative;}
.cb-theme-scene,.cb-theme-tile-scene{position: relative; overflow: hidden; background: radial-gradient(ellipse at 20% 10%,var(--cb-preview-glow),transparent 70%),linear-gradient(135deg,var(--cb-preview-other),var(--cb-preview-base)); display: block; height: 100%; width: 100%;}
.cb-theme-bloom{position: absolute; width: 105%; height: 160%; left: -24%; top: 6%; border-radius: 46% 54% 30% 70%; border: 1px solid rgba(224, 252, 255, 0.32); background: repeating-radial-gradient(at 85% 20%, transparent 0px, transparent 12%, rgba(208, 246, 255, 0.26) 12.5%, rgba(208, 246, 255, 0.26) 13.5%, transparent 14%, transparent 25%); box-shadow: rgba(16, 32, 90, 0.3) -15px -20px 30px inset, rgba(233, 251, 255, 0.282) 10px 14px 23px inset; transform: rotate(24deg); filter: saturate(1.2);}
.cb-preview-dashboard{position: absolute; inset: 18% 8% 12% 20%; display: flex; background: rgba(245, 249, 243, 0.93); border: 1px solid rgba(255, 255, 255, 0.6); border-radius: 5px; box-shadow: rgba(7, 27, 46, 0.22) 0px 5px 18px; overflow: hidden;}
.cb-preview-nav{width: 17%; background: rgb(220, 233, 232);}
.cb-preview-content{padding: 8% 6% 5%; width: 83%; min-width: 0px;}
.cb-preview-content > b{display: block; color: rgb(25, 75, 82); font-size: 9px; line-height: 1.1; font-weight: 600; margin: 0px 0px 8%;}
.cb-preview-values{display: flex; gap: 6%; height: 16%;}
.cb-preview-values i{flex: 1 1 0%; border-radius: 2px; background: rgb(197, 222, 214);}
.cb-preview-values i:nth-child(2){background: rgb(211, 223, 236);}
.cb-preview-values i:nth-child(3){background: rgb(229, 220, 202);}
.cb-preview-chart{height: 40%; margin-top: 10%; display: flex; align-items: end; gap: 8%; border-bottom: 1px solid rgb(174, 195, 199);}
.cb-preview-chart i{flex: 1 1 0%; background: rgb(85, 153, 165); height: 48%; border-radius: 2px 2px 0px 0px;}
.cb-preview-chart i:nth-child(2n){height: 80%; background: rgb(132, 189, 196);}
.cb-preview-chart i:nth-child(3){height: 62%;}
.cb-preview-chart i:nth-child(5){height: 95%;}
[data-theme="obsidian-dark"] .cb-preview-dashboard,[data-theme="ubuntu"] .cb-preview-dashboard{background: rgba(27, 47, 61, 0.92); border-color: rgba(255, 255, 255, 0.2);}
[data-theme="obsidian-dark"] .cb-preview-nav,[data-theme="ubuntu"] .cb-preview-nav{background: rgb(16, 36, 48);}
[data-theme="obsidian-dark"] .cb-preview-content > b,[data-theme="ubuntu"] .cb-preview-content > b{color: rgb(230, 249, 255);}
[data-theme="obsidian-dark"] .cb-preview-values i{background: rgb(52, 85, 98);}
.cb-settings-monitor-stand{width: 40%; height: 6px; background: rgb(132, 146, 154); margin: 0px auto; border-radius: 0px 0px 3px 3px;}
.cb-preview-caption{display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; font-size: 11px;}
.cb-preview-caption b{font-weight: 500; color: var(--cbs-text);}
.cb-preview-caption span{font-size: 10px; color: var(--cbs-muted);}
.cb-theme-selector h2{font-size: 12px; font-weight: 500; margin: 0px 0px 12px; color: var(--cbs-text);}
.cb-theme-gallery{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 9px;}
.cb-theme-tile{border: 2px solid transparent; border-radius: 7px; background: transparent; padding: 3px; color: var(--cbs-text); font: inherit; cursor: pointer; min-width: 0px;}
.cb-theme-tile:hover{background: var(--cbs-hover);}
.cb-theme-tile[aria-pressed="true"]{border-color: var(--cbs-accent);}
.cb-theme-tile-scene{aspect-ratio: 1.45 / 1; height: auto; border: 1px solid rgba(0, 0, 0, 0.067); border-radius: 4px;}
.cb-theme-tile-name{display: block; font-size: 10px; line-height: 1.4; text-align: left; padding-top: 5px; white-space: normal;}
.cb-theme-window{position: absolute; right: 7%; bottom: 9%; width: 39%; height: 48%; border: 1px solid rgba(255, 255, 255, 0.48); border-radius: 3px; background: rgb(238, 247, 255); box-shadow: rgba(16, 32, 48, 0.133) 0px 2px 6px; padding: 7% 5%;}
.cb-theme-window > i{display: block; height: 6%; min-height: 1px; background: rgb(165, 184, 192); margin-bottom: 10%; width: 80%;}
.cb-theme-window > b{display: block; width: 48%; height: 20%; position: absolute; right: 12%; bottom: 12%; border-radius: 2px; background: var(--cb-preview-base);}
[data-theme="obsidian-dark"] .cb-theme-window,[data-theme="ubuntu"] .cb-theme-window{background: rgb(31, 38, 53);}
.cb-theme-check{display: none; position: absolute; bottom: 5%; left: 5%; background: var(--cbs-accent); color: var(--cbs-bg); border-radius: 50%; width: 16px; height: 16px; place-items: center; font-size: 10px;}
.cb-theme-tile[aria-pressed="true"] .cb-theme-check{display: grid;}
.cb-theme-status{font-size: 11px; color: var(--cbs-muted); min-height: 15px; margin: 9px 0px 0px;}
.cb-personalization-rows{display: grid; gap: 6px;}
.cb-personalization-row{display: flex; align-items: center; gap: 15px; background: var(--cbs-panel); border: 1px solid var(--cbs-line); border-radius: 6px; padding: 15px 17px; text-align: left; color: var(--cbs-text); width: 100%; cursor: pointer; min-height: 66px; font-family: inherit;}
.cb-personalization-row:hover{background: var(--cbs-hover);}
.cb-settings-row-icon{display: grid; place-items: center; color: var(--cbs-muted); width: 21px; flex-shrink: 0;}
.cb-settings-row-icon svg{width: 19px; height: 19px;}
.cb-personalization-row > span:nth-child(2){flex: 1 1 0%; min-width: 0px;}
.cb-personalization-row b{font-size: 12px; font-weight: 500; display: block;}
.cb-personalization-row small{font-size: 10px; color: var(--cbs-muted); display: block; margin-top: 4px; line-height: 1.45;}
.cb-settings-chevron{font-size: 20px; color: var(--cbs-muted); font-weight: 400;}
#view-settings.cb-windows-settings .sgrid{display: grid !important; grid-template-columns: minmax(0px, 1fr) !important; gap: 12px !important; margin: 0px !important;}
#view-settings.cb-windows-settings .sgrid.cb-settings-controls-hidden{display: none !important;}
#view-settings.cb-windows-settings .sgrid > *{display: none !important;}
#view-settings.cb-windows-settings .sgrid > [data-settings-show="true"]:not([hidden]){display: block !important;}
#view-settings.cb-windows-settings .sgrid > .apanel{min-width: 0px; background: var(--cbs-panel) !important; border: 1px solid var(--cbs-line) !important; border-radius: 8px !important; color: var(--cbs-text) !important; padding: 19px !important;}
#view-settings.cb-windows-settings .sgrid > .apanel h3{color: var(--cbs-text) !important;}
#view-settings.cb-windows-settings .cb-settings-empty{color: var(--cbs-muted); font-size: 13px; padding: 25px 0px;}
#view-settings.cb-windows-settings .cb-settings-empty[hidden],#view-settings.cb-windows-settings .cb-personalization[hidden]{display: none !important;}
#view-settings.cb-windows-settings button:focus-visible{outline: 2px solid var(--cbs-accent); outline-offset: 3px;}
@media (max-width: 1150px){
#view-settings.cb-windows-settings{padding: 18px;}
#view-settings.cb-windows-settings .cb-settings-layout{grid-template-columns: 180px minmax(0px, 1fr); gap: 22px;}
.cb-personalization-hero{grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 18px;}
.cb-theme-gallery{gap: 5px;}
.cb-theme-tile-name{font-size: 9px;}
.cb-settings-identity small{font-size: 9px;}
}
@container cbSettings (max-width: 780px){
#view-settings.cb-windows-settings .cb-settings-layout{grid-template-columns: 165px minmax(0px, 1fr); gap: 18px;}
.cb-personalization-hero{grid-template-columns: minmax(0px, 1fr); gap: 20px;}
.cb-settings-monitor-wrap{max-width: 360px;}
.cb-theme-gallery{gap: 8px;}
.cb-theme-tile-scene{aspect-ratio: 1.65 / 1;}
.cb-theme-tile-name{font-size: 11px;}
}
#view-settings.cb-windows-settings{container: cbSettings / inline-size;}
@media (max-width: 760px){
#view-settings.cb-windows-settings{padding: 16px 12px;}
#view-settings.cb-windows-settings .cb-settings-layout{grid-template-columns: minmax(0px, 1fr); gap: 18px;}
#view-settings.cb-windows-settings .cb-settings-sidebar{position: static;}
.cb-settings-identity{margin-bottom: 12px !important;}
.cb-settings-identity img{width: 36px; height: 36px;}
#view-settings.cb-windows-settings .cb-settings-sidebar nav{display: flex; flex-wrap: wrap; gap: 5px;}
.cb-settings-sidebar nav button{width: auto; min-height: 36px; padding: 8px 10px; font-size: 11px; gap: 7px;}
.cb-settings-sidebar nav button[aria-current="page"]::before{inset: auto 10px 0px; width: auto; height: 2px;}
.cb-settings-nav-icon svg{width: 14px; height: 14px;}
#view-settings.cb-windows-settings .cb-settings-search{margin-bottom: 12px;}
.cb-settings-heading{margin-bottom: 18px;}
#view-settings.cb-windows-settings .cb-settings-heading h1{font-size: 23px;}
.cb-personalization-hero{grid-template-columns: minmax(0px, 1fr); gap: 22px;}
.cb-settings-monitor-wrap{width: 100%; max-width: 380px;}
.cb-theme-tile-name{font-size: 11px;}
.cb-theme-gallery{gap: 8px;}
.cb-personalization-row{padding: 13px 12px; gap: 12px;}
}
html:root.cb-obsidian{color-scheme: dark; --ob-bg: #08090b; --ob-panel: #111214; --ob-raised: #1a1b1e; --ob-line: #2b2c30; --ob-ink: #f3f3f5; --ob-muted: #929398; --ob-frame: #5c5d61; --ob-blue: #78a7ff; --ob-green: #4bce95; --ob-shadow: inset 0 1px 0 #ffffff09,0 8px 22px #00000030; --bg: #252629; --panel: var(--ob-bg); --card: var(--ob-panel); --soft: var(--ob-raised); --line: var(--ob-line); --bd: var(--ob-line); --ink: var(--ob-ink); --ink2: #c3c4c9; --mut: var(--ob-muted); --mut2: var(--ob-muted); --g1: #a1c0ff; --g2: var(--ob-blue); --gsoft: #78a7ff18; --pos: #4bce95; --red: #ff7a86;}
html:root.cb-obsidian.cb-obsidian-light{color-scheme: light; --ob-bg: #f0f1f4; --ob-panel: #fff; --ob-raised: #f3f4f7; --ob-line: #e0e2e8; --ob-ink: #202127; --ob-muted: #737680; --ob-frame: #bec2cb; --ob-blue: #377bd9; --ob-green: #208353; --ob-shadow: inset 0 1px 0 #fff,0 5px 18px #24304808; --bg: #d9dce2; --ink2: #434651; --g1: #285dba; --gsoft: #377bd912; --pos: #208353; --red: #bb3446;}
html.cb-obsidian body{color: var(--ob-ink); background: var(--bg) !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .shell{box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 60px; grid-template-columns: 58px minmax(0px, 1fr) !important; grid-template-rows: minmax(0px, 1fr) !important; gap: 12px !important; padding: 9px !important; margin: 8px auto !important; width: calc(100% - 16px) !important; max-width: 1800px !important; height: calc(var(--cb-viewport-height,100dvh) - 16px) !important; min-height: 0px !important; border: 5px solid var(--ob-frame) !important; border-radius: 32px !important; background: var(--ob-bg) !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side{scrollbar-width: none; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 4px !important; position: relative !important; inset: auto !important; width: 58px !important; height: 100% !important; padding: 9px 3px !important; background: linear-gradient(155deg,var(--ob-raised),var(--ob-bg)) !important; border: 1px solid var(--ob-line) !important; border-radius: 22px !important; overflow: auto !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side :is(.brand b, .sec, .sep, .ngh, .side-ai, .sup, .sigw, .sidetools, .gtx){display: none !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .brand{flex: 0 0 auto; justify-content: center; display: flex !important; padding: 3px !important; margin: 0px 0px 18px !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .brand .logo{width: 34px; height: 34px; color: var(--ob-ink);}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side :is(#menuMain, .ng, .ngb, .ngsub){display: contents !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nrow{width: 100%; padding-top: 12px; flex: 0 0 auto; display: flex !important; flex-direction: column !important; margin-top: auto !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nav{color: var(--ob-muted); background: none; display: flex !important; flex: 0 0 auto !important; flex-direction: row !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; min-height: 44px !important; padding: 10px !important; margin: 0px !important; border-radius: 13px !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nav :is(span, .bdg),html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nav::before,html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nav::after{display: none !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nav.on{background: var(--ob-ink) !important; color: var(--ob-bg) !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nav .i{display: block !important; color: inherit !important; width: 18px !important; height: 18px !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body header.top{color: var(--ob-ink); display: flex !important; flex-wrap: wrap !important; gap: 8px !important; min-height: 50px !important; padding: 4px 10px !important; background: transparent !important; box-shadow: none !important; border: 0px !important; border-radius: 14px !important;}
html.cb-obsidian .top :is(.gsearch, .rb, .pill){background: linear-gradient(135deg,var(--ob-raised),var(--ob-panel)) !important; color: var(--ob-ink) !important; border: 1px solid var(--ob-line) !important; box-shadow: none !important;}
html.cb-obsidian .top .gsearch{max-width: 310px;}
.cb-obsidian .top .gsearch input{color: var(--ob-ink);}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .content{min-width: 0px; overflow: hidden auto; padding: 8px 10px 14px !important; border: 0px !important; border-radius: 18px !important; background: transparent !important;}
html.cb-obsidian .view :is(.card, .panel, .apanel, .kpi, .stat, .sc, .bw-card, .bw-stat, .pt-card, .as-card, .loan-card, .bill-card, .doc-card, .emcard, .cb-appearance-settings, .cb-toolbar-icon-settings){background: var(--ob-panel) !important; color: var(--ob-ink) !important; border-color: var(--ob-line) !important; box-shadow: var(--ob-shadow) !important;}
html.cb-obsidian .view :is(input, select, textarea){background-color: var(--ob-raised) !important; color: var(--ob-ink) !important; border-color: var(--ob-line) !important;}
html.cb-obsidian :is(dialog, .dlg){background: var(--ob-panel); color: var(--ob-ink); border-color: var(--ob-line);}
html.cb-obsidian .view :is(th, .field, .seg, .tab, .chip){color: var(--ob-ink); border-color: var(--ob-line); background-color: var(--ob-raised) !important;}
html.cb-obsidian .view :is(.mut, .sub, .empty-s){color: var(--ob-muted);}
.ob-dashboard{color: var(--ob-ink); font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; min-width: 0px;}
.ob-dashboard *{box-sizing: border-box;}
.ob-dashboard button{font: inherit; color: inherit; cursor: pointer;}
.ob-dashboard button:disabled{opacity: 0.3; cursor: default;}
.ob-dashboard button:focus-visible{outline: 2px solid var(--ob-blue); outline-offset: 3px;}
.ob-heading{display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0px 0px 18px;}
.ob-heading h1{font-size: clamp(22px, 2.5cqi, 30px); font-weight: 550; letter-spacing: -0.6px; margin: 0px;}
.ob-heading > div{display: flex; align-items: center; gap: 8px;}
.ob-add,.ob-panel-head > button,.ob-calendar-head > button{display: grid; place-items: center; min-width: 36px; min-height: 36px; border: 1px solid var(--ob-line); background: linear-gradient(140deg,var(--ob-raised),var(--ob-panel)); border-radius: 50%; font-size: 18px;}
.ob-grid{display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) minmax(265px, 0.9fr); gap: 14px; align-items: stretch;}
.ob-panel{background: linear-gradient(145deg,var(--ob-panel),color-mix(in srgb,var(--ob-panel) 92%,var(--ob-raised))); border: 1px solid var(--ob-line); border-radius: 24px; padding: 20px; min-width: 0px; box-shadow: var(--ob-shadow); overflow: hidden;}
.ob-panel h2{font-size: 15px; font-weight: 550; margin: 0px; line-height: 1.4;}
.ob-panel-head{display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 16px;}
.ob-panel-head > button{min-width: 32px; min-height: 32px; font-size: 15px;}
.ob-revenue{grid-column: 1 / 3; display: flex; flex-direction: column; min-height: 360px;}
.ob-segment{display: flex; padding: 4px; gap: 2px; border: 1px solid var(--ob-line); border-radius: 30px; background: var(--ob-raised);}
.ob-segment button{background: none; border: 0px; border-radius: 22px; padding: 7px 12px; font-size: 10px; color: var(--ob-muted);}
.ob-segment button[aria-pressed="true"]{background: var(--ob-ink); color: var(--ob-bg); box-shadow: rgba(0, 0, 0, 0.133) 0px 2px 8px;}
.ob-revenue-total{display: flex; align-items: center; flex-wrap: wrap; gap: 10px;}
.ob-revenue-total > strong{font-size: clamp(26px, 3.5cqi, 40px); font-weight: 550; letter-spacing: -1.1px; overflow-wrap: anywhere;}
.ob-revenue-total em{font-size: 10px; font-style: normal; color: rgb(255, 255, 255); background: rgb(47, 169, 118); padding: 5px 8px; border-radius: 20px;}
.ob-revenue-total em.negative{background: rgb(172, 70, 83);}
.ob-muted{font-size: 10px; color: var(--ob-muted);}
.ob-chart{height: 220px; display: flex; align-items: stretch; gap: clamp(5px, 1cqi, 15px); margin-top: 24px; background: repeating-linear-gradient(to top,transparent 0,transparent 49px,color-mix(in srgb,var(--ob-line) 40%,transparent) 50px); border-bottom: 1px solid var(--ob-line);}
.ob-month{flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; align-items: center;}
.ob-bar{position: relative; display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 190px; padding: 0px; border: 0px; background: none; border-radius: 12px;}
.ob-bar > i{display: block; width: 100%; height: max(3px,var(--bar)); border: 1px solid rgba(106, 107, 109, 0.4); border-radius: 10px; background: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.016) 0px, rgba(255, 255, 255, 0.016) 2px, transparent 2px, transparent 5px), linear-gradient(rgb(48, 49, 52), rgb(23, 24, 26)); box-shadow: rgba(255, 255, 255, 0.086) 0px 2px 0px inset;}
.ob-bar > i::before{content: ""; display: block; width: 45%; height: 2px; margin: 5px auto; background: rgb(185, 186, 190); border-radius: 4px;}
.ob-bar.active > i{background: linear-gradient(rgb(137, 183, 255), rgb(86, 141, 232)); border-color: rgb(156, 191, 255); box-shadow: rgba(96, 154, 255, 0.094) 0px 0px 22px;}
.ob-bar > span{position: absolute; bottom: 9px; font-size: 8px; color: rgb(255, 255, 255); opacity: 0; max-width: 100%; overflow: hidden;}
.ob-bar.active > span,.ob-bar:hover > span,.ob-bar:focus-visible > span{opacity: 1;}
.ob-month > small{font-size: 9px; color: var(--ob-muted); padding-bottom: 8px;}
.ob-chart-note{color: var(--ob-muted); font-size: 10px; margin: 10px 0px 0px;}
.cb-obsidian-light .ob-bar > i{background: repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.016) 0px, rgba(0, 0, 0, 0.016) 2px, transparent 2px, transparent 5px), linear-gradient(rgb(212, 215, 223), rgb(233, 235, 240)); border-color: rgb(187, 192, 203);}
.cb-obsidian-light .ob-bar.active > i{background: linear-gradient(rgb(150, 189, 255), rgb(86, 141, 232)); border-color: rgb(100, 151, 239);}
.ob-calendar{display: flex; flex-direction: column; padding: 16px;}
.ob-calendar-head{display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 18px;}
.ob-calendar-head h2{font-size: 12px;}
.ob-calendar-head > button{min-width: 30px; min-height: 30px; font-size: 20px;}
.ob-weekdays,.ob-calendar-grid{display: grid; grid-template-columns: repeat(7, minmax(0px, 1fr)); gap: 4px;}
.ob-weekdays{margin-bottom: 9px; font-size: 9px; text-align: center; color: var(--ob-muted);}
.ob-calendar-grid button{position: relative; display: grid; place-items: center; aspect-ratio: auto; height: 30px; min-width: 0px; min-height: 28px; border: 1px solid rgba(255, 255, 255, 0.02); border-radius: 9px; background: linear-gradient(140deg,var(--ob-raised),var(--ob-panel)); font-size: 10px;}
.ob-calendar-grid button.selected{color: white; border-color: rgb(179, 202, 255); background: linear-gradient(rgb(159, 186, 255), rgb(66, 105, 179)); box-shadow: rgba(113, 157, 255, 0.145) 0px 4px 12px;}
.ob-calendar-grid .has-bill::after{content: ""; position: absolute; bottom: 3px; width: 3px; height: 3px; background: var(--ob-blue); border-radius: 50%;}
.ob-calendar-total{display: flex; align-items: center; gap: 12px; border: 1px solid var(--ob-line); border-radius: 16px; background: var(--ob-raised); padding: 13px; margin-top: 16px;}
.ob-calendar-total > span{width: 36px; height: 36px; border-radius: 50%; background: var(--ob-panel); display: grid; place-items: center; color: var(--ob-muted);}
.ob-calendar-total > div{min-width: 0px;}
.ob-calendar-total strong{display: block; font-size: 25px; font-weight: 550; line-height: 1.15; overflow-wrap: anywhere; letter-spacing: -0.6px;}
.ob-calendar-total small{display: block; color: var(--ob-muted); font-size: 9px; margin-top: 3px;}
.ob-summary{display: flex; flex-direction: column;}
.ob-spark{color: var(--ob-blue); font-size: 20px; margin-right: 4px;}
.ob-eyebrow{font-size: 10px; letter-spacing: 0.9px; color: var(--ob-muted);}
.ob-summary > p{font-size: 12px; line-height: 1.7; color: var(--ob-muted); margin: 10px 0px 16px;}
.ob-summary-metrics{display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto;}
.ob-summary-metrics > button{background: var(--ob-raised); border: 1px solid var(--ob-line); border-radius: 13px; text-align: left; padding: 12px; min-width: 0px;}
.ob-summary-metrics small{display: block; font-size: 9px; color: var(--ob-muted); margin-bottom: 9px;}
.ob-summary-metrics b{font-size: 24px; font-weight: 550; margin-right: 6px;}
.ob-summary-metrics em{display: inline-block; font-style: normal; font-size: 8px; color: var(--ob-green);}
.ob-ask{display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%; min-height: 40px; border: 1px solid var(--ob-line); border-radius: 24px; background: var(--ob-raised); padding: 10px 13px; text-align: left; margin-top: 13px; font-size: 10px !important; color: var(--ob-muted) !important;}
.ob-spending-body{display: grid; grid-template-columns: minmax(110px, 1fr) minmax(0px, 1fr); gap: 14px; align-items: center; margin: 8px 0px 18px;}
.ob-donut{position: relative; aspect-ratio: 1 / 1; max-width: 190px; width: 100%; border-radius: 50%; background: var(--donut); margin: auto; box-shadow: rgba(255, 255, 255, 0.04) 0px 0px 0px 1px inset;}
.ob-donut > div{position: absolute; inset: 15%; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 8px; background: var(--ob-panel); gap: 5px;}
.ob-donut strong{font-size: clamp(16px, 1.7cqi, 24px); font-weight: 550; max-width: 100%; overflow-wrap: anywhere;}
.ob-donut small{font-size: 10px; color: var(--ob-muted);}
.ob-category-legend{list-style: none; margin: 0px; padding: 0px; display: grid; gap: 10px; min-width: 0px;}
.ob-category-legend li{display: grid; grid-template-columns: 6px minmax(0px, 1fr); gap: 2px 6px; align-items: center; font-size: 9px;}
.ob-category-legend i{width: 5px; height: 5px; border-radius: 50%;}
.ob-category-legend span{overflow-wrap: anywhere; color: var(--ob-muted);}
.ob-category-legend b{grid-column: 2; font-size: 9px; font-weight: 500;}
.ob-insight{display: flex; align-items: flex-start; gap: 8px; background: var(--ob-raised); border: 1px solid var(--ob-line); padding: 11px; width: 100%; border-radius: 13px; text-align: left; line-height: 1.5; font-size: 10px !important; color: var(--ob-muted) !important;}
.ob-payment-score{display: flex; align-items: center; gap: 8px; background: var(--ob-raised); border: 1px solid var(--ob-line); border-radius: 22px; padding: 8px 10px; font-size: 9px; color: var(--ob-muted); margin-bottom: 13px;}
.ob-payment-score > i{display: block; flex: 1 1 0%; height: 10px; border-radius: 6px; background: linear-gradient(90deg,#e9c836 var(--paid),var(--ob-line) var(--paid)); mask-image: repeating-linear-gradient(90deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 2px, transparent 2px, transparent 4px);}
.ob-bill-list{display: grid;}
.ob-bill-row{display: flex; align-items: center; gap: 8px; width: 100%; padding: 13px 0px; background: none; border-top: 0px; border-right: 0px; border-left: 0px; border-image: none; border-bottom: 1px solid var(--ob-line); text-align: left;}
.ob-bill-row > span{min-width: 0px; flex: 1 1 0%;}
.ob-bill-row b{display: block; font-size: 11px; font-weight: 500; overflow-wrap: anywhere;}
.ob-bill-row small{display: block; font-size: 9px; color: var(--ob-muted); margin-top: 4px;}
.ob-bill-row em{font-size: 8px; font-style: normal; border: 1px solid var(--ob-line); border-radius: 20px; padding: 4px 6px; color: var(--ob-muted);}
.ob-bill-row strong{font-size: 10px; max-width: 34%; overflow-wrap: anywhere;}
.ob-all-bills{background: none; border: 0px; padding: 15px 0px 0px; text-align: left; font-size: 10px !important;}
.ob-empty{font-size: 11px; color: var(--ob-muted); line-height: 1.7;}
.ob-footnote{font-size: 10px; color: var(--ob-muted); line-height: 1.7; margin: 16px 0px 0px;}
@container cbpage (max-width: 1000px){
.ob-grid{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.ob-revenue{grid-column: 1 / -1;}
.ob-calendar{grid-area: 2 / 1;}
.ob-summary{grid-area: 2 / 2;}
.ob-spending{grid-area: 3 / 1;}
.ob-bills{grid-area: 3 / 2;}
.ob-panel{padding: 16px;}
.ob-calendar-grid button{min-height: 32px;}
}
@container cbpage (max-width: 600px){
.ob-grid{grid-template-columns: minmax(0px, 1fr); gap: 12px;}
.ob-grid > .ob-panel{grid-area: auto / 1;}
.ob-revenue{min-height: 330px;}
.ob-chart{gap: 5px; height: 190px;}
.ob-bar{height: 162px;}
.ob-panel{border-radius: 20px;}
.ob-revenue-total > strong{font-size: 29px;}
.ob-calendar-grid button{min-height: 36px;}
.ob-spending-body{grid-template-columns: minmax(110px, 1fr) minmax(0px, 1fr);}
}
@media (max-width: 640px){
html:root.cb-obsidian:not(.gapp):not(.mapp) body .shell{grid-template-columns: minmax(0px, 1fr) !important; border-width: 3px !important; border-radius: 22px !important; padding: 6px !important; gap: 6px !important; margin: 4px !important; width: calc(100% - 8px) !important; height: auto !important; min-height: calc(100dvh - 8px) !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side{z-index: 30; position: fixed !important; left: 10px !important; right: 10px !important; top: auto !important; bottom: max(8px,env(safe-area-inset-bottom)) !important; width: auto !important; height: 60px !important; flex-direction: row !important; padding: 5px !important; overflow: auto hidden !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .brand{display: none !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .side .nrow{display: contents !important;}
html:root.cb-obsidian:not(.gapp):not(.mapp) body .content{padding: 8px 8px 82px !important;}
html.cb-obsidian .top .gsearch{max-width: none; min-width: 100px;}
.ob-heading{margin-bottom: 12px;}
.ob-panel-head{flex-wrap: wrap;}
}
@media (prefers-reduced-motion: reduce){
html.cb-obsidian *,html.cb-obsidian ::before{animation: auto ease 0s 1 normal none running none !important; transition: none !important;}
}
html:root.cb-obsidian .view .btn.p{background: var(--ob-blue) !important; border-color: var(--ob-blue) !important; color: rgb(255, 255, 255) !important; box-shadow: none !important;}
html:root.cb-obsidian body #view-dash > .ob-dashboard{display: block !important;}
.ob-emi-next{display: grid; gap: 6px; padding: 14px; margin-bottom: 10px; background: var(--ob-raised); border: 1px solid var(--ob-line); border-radius: 16px;}
.ob-emi-next small,.ob-emi-next span{font-size: 10px; color: var(--ob-muted);}
.ob-emi-next strong{font-size: 26px; color: var(--ob-ink); letter-spacing: -0.6px;}
.ob-emi-row{display: flex; align-items: center; gap: 10px; width: 100%; padding: 13px 0px; background: none; border-top: 0px; border-right: 0px; border-left: 0px; border-image: none; border-bottom: 1px solid var(--ob-line); color: var(--ob-ink); text-align: left; cursor: pointer;}
.ob-emi-icon{display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto; border-radius: 10px; color: var(--ob-blue); background: var(--ob-raised);}
.ob-emi-info{display: grid; gap: 5px; flex: 1 1 0%; min-width: 0px;}
.ob-emi-info > b{font-size: 12px; font-weight: 550; overflow-wrap: anywhere;}
.ob-emi-info > small{font-size: 9px; color: var(--ob-muted);}
.ob-emi-progress{height: 4px; background: var(--ob-line); border-radius: 5px; overflow: hidden; display: block;}
.ob-emi-progress > i{height: 100%; display: block; background: var(--ob-blue); border-radius: 5px;}
.ob-emi-amount{display: grid; text-align: right; gap: 7px; flex: 0 0 auto;}
.ob-emi-amount strong{font-size: 11px; font-weight: 550;}
.ob-emi-amount em{font-size: 9px; color: var(--ob-muted); font-style: normal;}
.ob-emi-amount em.overdue{color: var(--red);}
.ob-grid.ob-balanced{grid-template-columns: minmax(0px, 2.1fr) minmax(260px, 0.9fr); align-items: start; gap: 14px;}
.ob-balanced .ob-main-column,.ob-balanced .ob-side-column{display: flex; flex-direction: column; gap: 14px; min-width: 0px;}
.ob-balanced .ob-main-details{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 14px; align-items: start; min-width: 0px;}
.ob-balanced .ob-panel{grid-area: auto; height: auto; min-width: 0px; align-self: stretch;}
.ob-balanced .ob-calendar,.ob-balanced .ob-summary,.ob-balanced .ob-spending,.ob-balanced .ob-upcoming-emis{min-height: 0px; max-height: none;}
.ob-balanced .ob-calendar-total{margin-top: 14px;}
.ob-balanced .ob-summary > p{margin-bottom: 12px;}
.ob-balanced .ob-spending-body{gap: 10px; margin-bottom: 12px;}
@container cbpage (max-width: 950px){
.ob-grid.ob-balanced{grid-template-columns: minmax(0px, 1fr);}
.ob-balanced .ob-side-column{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); align-items: start;}
.ob-balanced .ob-panel{grid-area: auto;}
}
@container cbpage (max-width: 600px){
.ob-balanced .ob-main-details,.ob-balanced .ob-side-column{display: grid; grid-template-columns: minmax(0px, 1fr); gap: 12px;}
.ob-grid.ob-balanced,.ob-balanced .ob-main-column{gap: 12px;}
}
@keyframes lblob { 
  50% { transform: translate(18%, -12%) scale(1.15); }
  100% { transform: translate(-10%, 14%) scale(0.9); }
}
@keyframes lspin { 
  100% { transform: rotate(360deg); }
}
@keyframes lin { 
  0% { opacity: 0; transform: translateY(18px); }
  100% { opacity: 1; transform: none; }
}
@keyframes lfloat { 
  50% { transform: translateY(-8px); }
}
@keyframes lwave { 
  0%, 100% { transform: scaleY(0.3); }
  50% { transform: scaleY(1); }
}
@keyframes lmarq { 
  100% { transform: translateX(-50%); }
}
@keyframes sppulse { 
  50% { transform: scale(1.06); }
}
@keyframes spin2 { 
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: none; }
}
@keyframes auf { 
  0% { transform: translate(0px, 0px) scale(1); }
  50% { transform: translate(6vmax, 4vmax) scale(1.12); }
  100% { transform: translate(-4vmax, 7vmax) scale(0.92); }
}
@keyframes aush { 
  100% { background-position: 300% 0px; }
}
@keyframes aubob { 
  50% { transform: translateY(-6px); }
}
@keyframes auin { 
  0% { opacity: 0; transform: translateY(18px); }
  100% { opacity: 1; transform: none; }
}
@keyframes aupl { 
  70% { box-shadow: rgba(23, 163, 90, 0) 0px 0px 0px 8px; }
  100% { box-shadow: rgba(23, 163, 90, 0) 0px 0px 0px 0px; }
}
@keyframes aushine { 
  0%, 55% { left: -60%; }
  100% { left: 130%; }
}
@keyframes aulo { 
  0% { transform: translateX(-100%); }
  100% { transform: translateX(260%); }
}
@keyframes ob1 { 
  0%, 100% { transform: translate(0px, 0px) scale(1); }
  33% { transform: translate(12px, 6px) scale(1.25); }
  66% { transform: translate(5px, 14px) scale(0.85); }
}
@keyframes ob2 { 
  0%, 100% { transform: translate(0px, 0px) scale(1); }
  50% { transform: translate(-13px, 8px) scale(1.3); }
}
@keyframes ob3 { 
  0%, 100% { transform: translate(0px, 0px) scale(1); }
  40% { transform: translate(10px, -12px) scale(1.2); }
  75% { transform: translate(-4px, -6px) scale(0.9); }
}
@keyframes orbglow { 
  100% { box-shadow: rgba(255, 255, 255, 0.55) 0px 0px 0px 1px, rgba(244, 114, 182, 0.6) 0px 0px 10px, rgba(52, 211, 153, 0.35) 0px 0px 15px; transform: scale(1.05); }
}
@keyframes sbar { 
  0%, 100% { height: 5px; }
  50% { height: 17px; }
}
@keyframes aur { 
  100% { transform: translate(8%, 6%) rotate(12deg); }
}
@keyframes vin { 
  0% { opacity: 0; transform: translateY(12px) scale(0.995); }
  100% { opacity: 1; transform: none; }
}
@keyframes dpop { 
  0% { opacity: 0; transform: translateY(24px) scale(0.96); }
  100% { opacity: 1; transform: none; }
}
@keyframes geFlowIn { 
  0% { opacity: 0; transform: translateX(26px); }
  100% { opacity: 1; transform: none; }
}
@keyframes geDlgIn { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes geSpin { 
  100% { transform: rotate(360deg); }
}
@keyframes mo-rise { 
  0% { opacity: 0; transform: translateY(14px); }
  100% { opacity: 1; transform: none; }
}
@keyframes mo-push { 
  0% { opacity: 0.2; transform: translateX(44px); }
  100% { opacity: 1; transform: none; }
}
@keyframes mo-back { 
  0% { opacity: 0.2; transform: translateX(-44px); }
  100% { opacity: 1; transform: none; }
}
@keyframes mo-zoom { 
  0% { opacity: 0; transform: scale(0.9); }
  100% { opacity: 1; transform: none; }
}
@keyframes mo-flip { 
  0% { opacity: 0; transform: perspective(900px) rotateY(-62deg); }
  100% { opacity: 1; transform: none; }
}
@keyframes mo-sheet { 
  0% { transform: translateY(100%); }
  100% { transform: none; }
}
@keyframes mo-lift { 
  0% { transform: translateY(34%); opacity: 0.5; }
  100% { transform: none; opacity: 1; }
}
@keyframes mo-dim { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes min { 
  0% { opacity: 0; transform: translateY(8px) scale(0.97); }
}
@keyframes sigw { 
  0% { transform: scaleY(0.3); }
  60% { transform: scaleY(1.25); }
  100% { transform: scaleY(1); }
}
@keyframes pgrow { 
  0% { }
}
@keyframes gePbar { 
  0% { transform: translateX(-110%); }
  100% { transform: translateX(260%); }
}
@keyframes sigf { 
  0% { opacity: 0.4; }
  100% { opacity: 1; }
}
@keyframes dkIn { 
  0% { opacity: 0; transform: translateY(4px); }
  100% { opacity: 1; transform: none; }
}
@keyframes dkFill { 
  0% { transform: scaleX(0); }
  100% { transform: scaleX(1); }
}