:root,[data-style=girl]{--paper:#fbf7f0;--paper-2:#fffdf9;--ink:#4b3f3b;--ink-soft:#7d6f68;--dot:#e6dccf;--accent:#c0506a;--accent-fill:#e48ea0;--btn:#fde89a;--chip:#f6c3c9;--p1:#f6c3c9;--p2:#c9def3;--p3:#cfe6c6;--p4:#fde89a;--p5:#ddd0f1;--p6:#f8d3b6;--font-display:"Aref Ruqaa", "Marhey", serif;--font-body:"Marhey", system-ui, sans-serif;--font-hand:"Caveat", cursive;--wobble:255px 14px 225px 16px / 16px 225px 14px 255px;--wobble-2:14px 225px 16px 255px / 225px 16px 255px 14px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-style=boy]{--paper:#f4f8fb;--paper-2:#fbfdff;--ink:#22344b;--ink-soft:#5a6b7d;--dot:#d6e1ea;--accent:#d9822b;--accent-fill:#f2a65a;--btn:#9fc9e8;--chip:#bfe3d3;--p1:#9fc9e8;--p2:#bfe3d3;--p3:#e9dcc3;--p4:#c9d3dc;--p5:#f6c9a0;--p6:#b8d4ea}[data-season=ramadan],[data-season=eid-fitr],[data-season=eid-adha]{--paper:#2b2d52;--paper-2:#fdf6e7;--ink:#fdf6e7;--ink-soft:#d9d3ee;--dot:#ffffff14;--accent:#f3c96b;--accent-fill:#f3c96b;--btn:#f3c96b}[data-season=ramadan] .card,[data-season^=eid] .card{color:#4b3f3b;--ink:#4b3f3b;--ink-soft:#6b5d57}[data-season=national-day],[data-season=founding-day]{--paper:#f3f8f2;--dot:#d3e4d0;--accent:#1f7a4a;--accent-fill:#4fa36f;--btn:#cfe6c6;--chip:#cfe6c6}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background-color:var(--paper);background-image:radial-gradient(var(--dot) 1.2px, transparent 1.3px);color:var(--ink);font-family:var(--font-body);-webkit-tap-highlight-color:transparent;background-size:22px 22px;font-size:16px;line-height:1.6}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2.5px dashed var(--accent);outline-offset:3px}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.shell{flex-direction:column;gap:14px;max-width:560px;margin:0 auto;padding:18px 18px 110px;display:flex}h1,.display{font-family:var(--font-display);text-wrap:balance;margin:0;font-weight:700;line-height:1.3}.hand{font-family:var(--font-hand)}.muted{color:var(--ink-soft);font-size:14px}.card{background:var(--paper-2);border:2px solid var(--ink);border-radius:var(--wobble);padding:14px 16px;position:relative;box-shadow:3px 4px #00000014}.card.alt{border-radius:var(--wobble-2)}.tape{opacity:.85;background:repeating-linear-gradient(45deg, var(--p4) 0 6px, var(--paper-2) 6px 12px);width:84px;height:20px;position:absolute;top:-10px;left:30%;transform:rotate(-3deg)}.btn{border:2.5px solid var(--ink);border-radius:var(--wobble);background:var(--btn);min-height:48px;box-shadow:3px 4px 0 var(--ink);cursor:pointer;padding:0 18px;font-weight:600}.btn.ghost{background:var(--paper-2);box-shadow:none}.btn:disabled{opacity:.6;cursor:default}.chip{border:1.8px solid var(--ink);background:var(--paper-2);cursor:pointer;border-radius:999px;align-items:center;gap:4px;min-height:36px;padding:0 12px;font-size:14px;display:inline-flex}.chip[aria-pressed=true]{background:var(--chip)}.field{flex-direction:column;gap:4px;display:flex}.field label{font-size:14px;font-weight:500}.field input,.field textarea,.field select{border:2px solid var(--ink);background:var(--paper-2);min-height:48px;color:var(--ink);border-radius:14px;padding:0 12px}.field textarea{resize:vertical;min-height:110px;padding:10px 12px}.check-row{align-items:center;gap:8px;min-height:48px;display:flex}.check-row .title{flex:1;min-width:0}.check-row.done .title{color:var(--ink-soft);text-decoration:line-through;-webkit-text-decoration-color:var(--accent-fill);text-decoration-color:var(--accent-fill);text-decoration-thickness:2px}.cb{cursor:pointer;background:0 0;border:none;flex:none;place-items:center;width:44px;height:44px;padding:0;display:grid}.cb path.tick{stroke-dasharray:40;stroke-dashoffset:40px;transition:stroke-dashoffset .3s ease-out}.done .cb path.tick{stroke-dashoffset:0}.snooze{border:1.8px solid var(--ink);border-radius:var(--wobble-2);cursor:pointer;place-items:center;width:38px;height:38px;display:grid;transform:rotate(4deg)}.period{color:var(--ink-soft);align-items:center;gap:6px;margin-top:6px;font-size:13px;display:flex}.period b{color:var(--ink)}.period:after{content:"";border-top:1.5px dashed var(--dot);flex:1}.progress{border:2px solid var(--ink);border-radius:var(--wobble);background:var(--paper-2);height:16px;overflow:hidden}.progress>i{background:repeating-linear-gradient(-45deg, var(--accent-fill) 0 8px, var(--paper-2) 8px 11px);height:100%;transition:width .4s;display:block}nav.tabs{z-index:20;background:var(--paper-2);color:var(--ink);border-top:2px solid var(--ink);scrollbar-width:none;scroll-snap-type:x proximity;padding:6px 8px calc(10px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0;gap:2px;display:flex;position:fixed;bottom:0;left:0;right:0;overflow-x:auto}nav.tabs::-webkit-scrollbar{display:none}nav.tabs a{scroll-snap-align:center;min-height:52px;color:var(--ink-soft);white-space:nowrap;border-radius:var(--wobble);flex-direction:column;flex:1 0 64px;justify-content:center;align-items:center;padding:0 4px;font-size:11.5px;text-decoration:none;display:flex}nav.tabs a.active{color:var(--ink);background:var(--btn);font-weight:600}nav.tabs a.active svg{transform:rotate(-6deg)scale(1.08)}nav.tabs a svg{transition:transform .2s}.fab{left:18px;bottom:calc(90px + env(safe-area-inset-bottom));z-index:25;border:2.5px solid var(--ink);background:var(--accent-fill);width:64px;height:64px;box-shadow:3px 4px 0 var(--ink);cursor:pointer;color:#fff;border-radius:50%;place-items:center;display:grid;position:fixed}.sheet-bg{z-index:30;background:#00000059;position:fixed;inset:0}.sheet{z-index:31;background:var(--paper-2);max-width:560px;max-height:88%;color:var(--ink);border:2px solid var(--ink);padding:18px 18px calc(18px + env(safe-area-inset-bottom));border-bottom:none;border-radius:22px 22px 0 0;flex-direction:column;gap:12px;margin:0 auto;display:flex;position:fixed;bottom:0;left:0;right:0;overflow-y:auto}.menu{z-index:35;background:var(--paper-2);width:250px;color:var(--ink);border:2px solid var(--ink);border-radius:14px;gap:2px;padding:8px;display:grid;position:fixed;box-shadow:3px 5px #0000002e}.menu button.opt{text-align:start;cursor:pointer;background:0 0;border:none;border-radius:10px;min-height:40px;padding:0 8px}.menu button.opt:hover,.menu button.opt:focus-visible{background:var(--btn)}.menu .danger{color:#b3364f}.toast{z-index:40;background:var(--ink);color:var(--paper-2);border-radius:999px;padding:6px 16px;font-size:14px;position:fixed;top:14px;left:50%;transform:translate(-50%)}.error{color:#b3364f;font-size:14px}@keyframes wig{0%{transform:rotate(-6deg)}to{transform:rotate(6deg)}}.wig{transform-origin:50% 80%;animation:1.6s ease-in-out infinite alternate wig}.agent-fab{right:18px;bottom:calc(90px + env(safe-area-inset-bottom));z-index:25;border:2.5px solid var(--ink);background:var(--p5);color:#4b3f3b;width:84px;height:84px;box-shadow:3px 4px 0 var(--ink);cursor:pointer;border-radius:50%;align-content:center;place-items:center;gap:0;padding:0;display:grid;position:fixed}.agent-fab:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,3px)}.agent-fab span{color:#4b3f3b;text-align:center;font-size:10.5px;font-weight:700;line-height:1.15}.sticky-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px;padding:10px 2px 4px;display:grid}@media (width>=640px){.sticky-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.sticky{color:#4b3f3b;clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%);min-height:140px;padding:24px 12px 14px;position:relative;box-shadow:2px 6px 10px #00000024}.sticky:after{content:"";background:linear-gradient(135deg,#0000002e 50%,#0000 50%);width:22px;height:22px;position:absolute;bottom:0;right:0}.sticky .t{font-family:var(--font-hand);font-size:21px;line-height:1.25}.sticky .b{white-space:pre-wrap;margin-top:4px;font-size:13.5px}.sticky .pin{border:2px solid #4b3f3b;border-radius:50%;width:18px;height:18px;margin-left:-9px;position:absolute;top:-9px;left:50%}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}.shell{padding-top:max(18px, env(safe-area-inset-top));padding-left:max(16px, env(safe-area-inset-left));padding-right:max(16px, env(safe-area-inset-right))}@media (width<=640px){input,select,textarea{font-size:16px!important}}button,a,.chip{touch-action:manipulation}.sheet{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;max-height:92dvh}.menu{max-width:calc(100vw - 16px)}@media (width<=380px){nav.tabs a{font-size:10.5px}nav.tabs{padding-left:4px;padding-right:4px}}@media (display-mode:standalone){.toast{top:calc(10px + env(safe-area-inset-top))}}
