:root{color-scheme:light;--bg:#f4efe5;--bg2:#e9ddca;--surface:rgba(255,252,245,.72);--ink:#402f28;--muted:#806e64;--accent:#955a3c;--accent2:#c89265;--gold:#d9af70;--track:rgba(96,66,48,.12);--shadow:0 24px 70px rgba(90,61,42,.14);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
:root[data-text-size=standard]{font-size:16px}:root[data-text-size=large]{font-size:18px}:root[data-text-size=extra-large]{font-size:21px}
:root[data-text-size=large] .tap-area h1{font-size:clamp(2rem,7.2vw,2.7rem)}:root[data-text-size=extra-large] .tap-area h1{font-size:clamp(2.45rem,9vw,3.35rem);font-weight:600}
.tap-area h1{width:100%;max-width:100%;text-align:center;line-height:1.25;text-wrap:balance}
:root[data-text-size=large] .total-today{font-size:clamp(1.2rem,4.5vw,1.5rem);font-weight:500}:root[data-text-size=extra-large] .total-today{font-size:clamp(1.5rem,5.8vw,1.9rem);font-weight:600}
.total-today{font-size:clamp(1.1rem,4vw,1.3rem);font-weight:500}
:root[data-theme=dark]{color-scheme:dark;--bg:#191714;--bg2:#27211c;--surface:rgba(47,40,34,.76);--ink:#f1e7d6;--muted:#b8a89a;--accent:#d7986d;--accent2:#b97855;--gold:#d6ae71;--track:rgba(255,239,214,.12);--shadow:0 24px 70px rgba(0,0,0,.35)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]){color-scheme:dark;--bg:#191714;--bg2:#27211c;--surface:rgba(47,40,34,.76);--ink:#f1e7d6;--muted:#b8a89a;--accent:#d7986d;--accent2:#b97855;--gold:#d6ae71;--track:rgba(255,239,214,.12);--shadow:0 24px 70px rgba(0,0,0,.35)}}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;overscroll-behavior:none}body{font-family:ui-serif,Georgia,"Noto Serif Devanagari","Nirmala UI",serif;background:radial-gradient(circle at 50% 15%,var(--bg2),var(--bg) 48%);color:var(--ink);-webkit-tap-highlight-color:transparent}.app-shell{height:100dvh;min-height:520px;display:grid;grid-template-rows:auto 1fr auto;padding:calc(12px + var(--safe-top)) clamp(14px,4vw,36px) calc(10px + var(--safe-bottom));overflow:hidden}.topbar,.footer-actions{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3}.topbar time{font:500 clamp(.72rem,2.5vw,.87rem) ui-sans-serif,system-ui,sans-serif;letter-spacing:.045em;color:var(--muted)}button{font:inherit;color:inherit}.icon-button{border:0;background:var(--surface);width:42px;height:42px;border-radius:50%;font:1.25rem ui-sans-serif,system-ui;cursor:pointer;box-shadow:0 4px 18px rgba(60,40,28,.08)}.tap-area{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(9px,2vh,18px);outline:0;touch-action:manipulation;user-select:none;-webkit-user-select:none;cursor:pointer}.tap-area h1{margin:0 0 clamp(4px,1.2vh,14px);font-size:clamp(1.55rem,5vw,2.25rem);font-weight:500;letter-spacing:.06em}.mala-ring{width:min(48vw,31vh,280px);aspect-ratio:1;position:relative;transition:transform .16s ease}.mala-ring.pulse{transform:scale(.975)}.mala-ring svg{width:100%;height:100%;transform:rotate(-90deg);filter:drop-shadow(0 12px 24px rgba(100,70,48,.09))}.ring-track,.ring-progress{fill:none;stroke-width:5;stroke-linecap:round}.ring-track{stroke:var(--track);stroke-dasharray:1 5}.ring-progress{stroke:var(--accent);stroke-dasharray:647.17;stroke-dashoffset:647.17;transition:stroke-dashoffset .22s ease}.count-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column}.count-center strong{font:300 clamp(4.2rem,17vw,7.6rem)/.85 ui-sans-serif,system-ui,sans-serif;letter-spacing:-.06em}.count-center span{font:400 clamp(1rem,3.6vw,1.35rem) ui-sans-serif,system-ui;color:var(--muted);margin-top:.5em}.mala-count{font:500 clamp(1.1rem,4vw,1.4rem) ui-sans-serif,system-ui;letter-spacing:.04em}.total-today{font:400 clamp(.9rem,3.2vw,1.03rem) ui-sans-serif,system-ui;color:var(--muted)}.tap-hint{margin-top:clamp(4px,1vh,12px);font:400 .78rem ui-sans-serif,system-ui;color:var(--muted);letter-spacing:.04em;opacity:.8}.goal-wrap{width:min(72vw,360px);font:500 .72rem ui-sans-serif,system-ui;color:var(--muted);margin-top:4px}.goal-copy{display:flex;justify-content:space-between;margin-bottom:7px}.sync-state{opacity:.7}.sync-state.saving{color:var(--accent)}.sync-state.error{color:#a13d35;font-weight:700}.goal-track{height:3px;background:var(--track);border-radius:5px;overflow:hidden}.goal-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--accent2),var(--gold));border-radius:5px;transition:width .35s ease}.feedback{position:absolute;left:50%;top:54%;font:600 1.25rem ui-sans-serif,system-ui;color:var(--accent);opacity:0;pointer-events:none}.feedback.show{animation:rise .55s ease-out}.completion{position:absolute;inset:auto;top:47%;padding:13px 24px;border-radius:999px;background:var(--surface);box-shadow:var(--shadow);font:500 1rem ui-sans-serif,system-ui;opacity:0;transform:translateY(8px);pointer-events:none}.completion.show{animation:complete 1.8s ease}.footer-actions{font:500 .72rem ui-sans-serif,system-ui;color:var(--muted)}.quiet-button{border:0;background:transparent;padding:10px;cursor:pointer;color:var(--muted)}.connection.offline{color:#a13d35}.backdrop{position:fixed;inset:0;background:rgba(20,15,12,.36);backdrop-filter:blur(3px);z-index:9}.panel{position:fixed;z-index:10;right:0;top:0;height:100dvh;width:min(92vw,430px);overflow:auto;background:var(--bg);box-shadow:-20px 0 80px rgba(20,15,12,.25);padding:calc(18px + var(--safe-top)) 22px calc(30px + var(--safe-bottom));transform:translateX(105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);font-family:ui-sans-serif,system-ui,sans-serif}.panel.open{transform:none}.panel-head,.section-title{display:flex;align-items:center;justify-content:space-between}.panel-head h2{font:500 1.6rem ui-serif,Georgia,serif;margin:0}.tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--track);padding:4px;border-radius:14px;margin:24px 0}.tab{border:0;background:transparent;padding:10px;border-radius:11px;cursor:pointer}.tab.active{background:var(--surface);box-shadow:0 2px 10px rgba(50,35,25,.08)}.tab-content{display:none}.tab-content.active{display:block}.panel section{padding:6px 0 18px;border-bottom:1px solid var(--track);margin-bottom:13px}.panel h3{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:12px 0}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-grid.lifetime{grid-template-columns:repeat(2,1fr)}.stat-grid article{background:var(--surface);border-radius:15px;padding:13px}.stat-grid b{display:block;font-size:1.15rem}.stat-grid span{font-size:.7rem;color:var(--muted)}.best-day,.danger-zone p,.empty{font-size:.78rem;color:var(--muted)}.export{font-size:.76rem;color:var(--accent)}.history{max-height:42vh;overflow:auto}.history-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:11px 2px;border-bottom:1px solid var(--track)}.history-row b{font-size:.86rem}.history-row span{font-size:.76rem;color:var(--muted)}label{display:grid;gap:7px;font-size:.8rem;color:var(--muted);margin:15px 0}input,select{width:100%;border:1px solid var(--track);background:var(--surface);color:var(--ink);padding:12px;border-radius:11px;font:1rem ui-sans-serif,system-ui}.switch-row{display:flex;align-items:center;justify-content:space-between}.switch-row span{display:grid;color:var(--ink)}.switch-row small{color:var(--muted);margin-top:2px}.switch-row input{width:44px;height:24px;accent-color:var(--accent)}.primary-button,.danger-button{border:0;border-radius:11px;padding:12px 15px;cursor:pointer}.primary-button{background:var(--accent);color:#fff}.danger-button{background:transparent;border:1px solid #a94d45;color:#a94d45}.toast{position:fixed;z-index:20;left:50%;bottom:calc(20px + var(--safe-bottom));transform:translate(-50%,20px);background:var(--ink);color:var(--bg);padding:11px 17px;border-radius:99px;font:500 .78rem ui-sans-serif,system-ui;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}
.login-view{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 50% 20%,var(--bg2),var(--bg) 55%)}.login-view.hidden{display:none}.login-card{width:min(100%,360px);background:var(--surface);backdrop-filter:blur(18px);border:1px solid var(--track);border-radius:28px;padding:30px;box-shadow:var(--shadow);font-family:ui-sans-serif,system-ui}.login-card h1{text-align:center;font:500 1.75rem ui-serif,Georgia,serif;margin:10px 0}.login-card>p{text-align:center;color:var(--muted);font-size:.82rem}.login-card .primary-button{width:100%;margin-top:8px}.login-mark{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;margin:auto;background:var(--accent);color:#fff;font:500 1.15rem ui-serif,serif}.login-error{min-height:1.2em;color:#a13d35!important}.panel-head small{color:var(--muted)}.user-help{font-size:.76rem;color:var(--muted)}.user-list{display:grid;gap:8px}.user-row{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:8px;padding:10px;background:var(--surface);border-radius:12px}.user-row input,.user-row select{margin:0;padding:9px;font-size:.82rem}.user-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:4px}.user-actions button{padding:7px 10px;font-size:.76rem}.user-actions button:disabled{opacity:.45;cursor:not-allowed}
.user-naam-picker{border:1px solid var(--track);border-radius:13px;margin:16px 0;padding:5px 12px 10px}.user-naam-picker legend{padding:0 6px;font-size:.8rem;color:var(--muted)}.user-naam-picker>p{margin:3px 0 8px;font-size:.72rem;color:var(--muted)}.user-naam-picker>div{display:grid;gap:5px}.user-naam-picker label{display:flex;align-items:center;gap:10px;margin:0;padding:8px;border-radius:10px;background:var(--surface);color:var(--ink)}.user-naam-picker input{width:18px;height:18px;margin:0;accent-color:var(--accent)}.user-naam-picker span{display:grid;min-width:0}.user-naam-picker small{color:var(--muted);overflow-wrap:anywhere}
.period-stats{display:grid;gap:8px}.period-stats article{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface);border-radius:15px;padding:12px 14px}.period-stats article div{display:flex;align-items:baseline;gap:6px}.period-stats span,.period-stats small,.period-stats p{font-size:.7rem;color:var(--muted)}.period-stats b{font-size:1.15rem}.period-stats p{margin:0;text-align:right}
@keyframes rise{0%{opacity:0;transform:translate(-50%,0)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-45px)}}@keyframes complete{0%,100%{opacity:0;transform:translateY(8px)}15%,80%{opacity:1;transform:none}}
@media (max-height:650px){.app-shell{min-height:440px}.tap-area{gap:6px}.tap-area h1{font-size:1.35rem}.mala-ring{width:min(35vw,38vh,190px)}.tap-hint{display:none}}@media (orientation:landscape) and (max-height:600px){.tap-area{display:grid;grid-template-columns:auto auto;grid-template-rows:repeat(4,auto);column-gap:30px}.tap-area h1{grid-column:1;grid-row:1}.mala-ring{grid-column:1;grid-row:2/5}.mala-count,.total-today,.tap-hint,.goal-wrap{grid-column:2}.goal-wrap{width:min(34vw,320px)}}@media(max-width:380px),(max-height:560px){:root[data-text-size=extra-large]{font-size:19px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}