/* Ritmo: Material 3 (estilo Flutter), neutro, com cor só nos ícones e categorias. */
:root{--bg:#f8f8fa;--card:#ffffff;--card2:#eeeef2;--tx:#1b1b1f;--mut:#6e6e78;--bd:#e4e4ea;--pri:#1b1b1f;--onpri:#ffffff;--ok:#2e7d32;--bad:#c62828;--warn:#b26a00;--r:24px;
 --sans:"Google Sans","Product Sans",Roboto,"SF Pro Text",system-ui,-apple-system,"Segoe UI",sans-serif;--ease:cubic-bezier(.2,.9,.25,1);--el1:0 1px 2px rgba(0,0,0,.05),0 1px 3px rgba(0,0,0,.04)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#111114;--card:#1c1c21;--card2:#29292f;--tx:#ececf1;--mut:#9a9aa6;--bd:#2c2c33;--pri:#ececf1;--onpri:#111114;--ok:#81c784;--bad:#ef9a9a;--warn:#ffcc80;--el1:none}}
:root[data-theme=dark]{--bg:#111114;--card:#1c1c21;--card2:#29292f;--tx:#ececf1;--mut:#9a9aa6;--bd:#2c2c33;--pri:#ececf1;--onpri:#111114;--ok:#81c784;--bad:#ef9a9a;--warn:#ffcc80;--el1:none}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.5 var(--sans);-webkit-font-smoothing:antialiased}
main{max-width:860px;margin:0 auto;padding:20px 16px 130px}
/* barra de navegação M3 */
#nav{position:fixed;z-index:20;display:flex;background:var(--card)}
@media(min-width:760px){#nav{top:0;left:0;right:0;padding:8px 24px;justify-content:center;gap:6px;box-shadow:var(--el1)}main{padding-top:86px}}
@media(max-width:759px){#nav{bottom:0;left:0;right:0;padding:10px 4px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -1px 0 var(--bd)}}
#nav button{flex:1;background:none;border:0;color:var(--mut);padding:0;font:500 12px var(--sans);display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;min-height:0;white-space:nowrap}
#nav button span{display:flex;align-items:center;justify-content:center;width:62px;height:32px;border-radius:16px;transition:background .35s var(--ease)}
#nav button.on{color:var(--tx);font-weight:700}#nav button.on span{background:var(--card2)}
#nav button svg{transition:transform .45s cubic-bezier(.3,1.7,.5,1)}#nav button.on svg{transform:scale(1.12)}
@media(min-width:760px){#nav button{flex:0 0 auto;flex-direction:row;font-size:14px;gap:6px;padding:4px 14px 4px 4px;border-radius:20px}#nav button span{width:40px}#nav button.on{background:var(--card2)}#nav button.on span{background:none}}
/* tipografia */
h1{font-size:30px;font-weight:600;margin:0 0 8px;letter-spacing:-.01em}h2{font-size:21px;font-weight:600;margin:0 0 12px;letter-spacing:-.01em}
h3{margin:0 0 10px;font-size:13px;color:var(--mut);font-weight:600}
.big{font-size:28px;font-weight:600;letter-spacing:-.02em}.mut{color:var(--mut);font-size:13px}.pos{color:var(--ok)}.neg{color:var(--bad)}.warn{color:var(--warn)}
.num{font-variant-numeric:tabular-nums;text-align:right}
/* superfícies */
.card{background:var(--card);border-radius:var(--r);padding:18px;margin-bottom:14px;box-shadow:var(--el1)}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.grid>.card{margin:0}
.two{display:grid;gap:14px;grid-template-columns:2fr 1fr}@media(max-width:800px){.two{grid-template-columns:1fr}}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
/* controles */
input,select,textarea{font:inherit;color:var(--tx);background:var(--card2);border:0;border-radius:14px;padding:10px 14px;min-height:46px;transition:box-shadow .2s,background .2s}
input:focus,select:focus,textarea:focus{outline:0;box-shadow:inset 0 0 0 2px var(--pri);background:var(--card)}
input[type=checkbox]{min-height:0;width:20px;height:20px;accent-color:var(--pri)}
button{font:500 14px var(--sans);color:var(--tx);background:var(--card2);border:0;border-radius:20px;padding:9px 18px;min-height:40px;cursor:pointer;transition:transform .18s var(--ease),background .25s,opacity .2s,box-shadow .25s}
button:active{transform:scale(.95)}
button.p{background:var(--pri);color:var(--onpri)}@media(hover:hover){button:hover{opacity:.88}}
button.d{color:var(--bad)}button.g{background:none;box-shadow:inset 0 0 0 1px var(--bd)}
a{color:inherit;text-decoration:none}
/* chips de abas */
.tabs{display:flex;gap:8px;margin-bottom:16px;overflow-x:auto;padding:2px}
.tabs button{background:var(--card);box-shadow:inset 0 0 0 1px var(--bd);white-space:nowrap;min-height:36px;padding:6px 16px}
.tabs button.on{background:var(--pri);color:var(--onpri);box-shadow:none}
/* listas */
.chk{display:flex;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--bd)}.chk:last-child{border-bottom:0}.chk>span{flex:1}.chk.done>span{text-decoration:line-through;color:var(--mut)}
.bar{height:8px;background:var(--card2);border-radius:4px;overflow:hidden;margin:6px 0 12px}.bar i{display:block;height:100%;background:var(--pri);border-radius:4px}.bar i.over{background:var(--bad)}.bar i.mid{background:var(--warn)}
.tw{overflow:auto;max-height:68vh;border-radius:var(--r);background:var(--card);box-shadow:var(--el1)}
table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--bd);padding:6px 10px;text-align:left;white-space:nowrap}
th{position:sticky;top:0;background:var(--card);z-index:1;font-size:12px;font-weight:600;color:var(--mut)}
td input,td select{width:100%;background:transparent;padding:4px;min-height:0;border-radius:6px}
/* folha inferior, FAB, toast */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.36);z-index:50;display:flex;align-items:flex-end;justify-content:center;animation:fadein .25s}
.modal>div{background:var(--bg);border-radius:28px 28px 0 0;padding:12px 20px 24px;width:min(560px,100%);max-height:90vh;overflow:auto;animation:sheet .5s var(--ease)}
.modal>div::before{content:"";display:block;width:36px;height:4px;border-radius:2px;background:var(--bd);margin:0 auto 14px}
@media(min-width:760px){.modal{align-items:center}.modal>div{border-radius:28px}.modal>div::before{display:none}}
.fab{position:fixed;right:16px;bottom:96px;z-index:15;width:56px;height:56px;border-radius:18px;font-size:26px;padding:0;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.micfab{right:16px;bottom:164px;width:48px;height:48px;border-radius:16px;background:var(--card);color:var(--tx);box-shadow:0 3px 10px rgba(0,0,0,.12)}
@media(min-width:760px){.fab{bottom:28px}.micfab{bottom:96px}}
.fab:active{transform:scale(.9)}
#toast{position:fixed;left:50%;bottom:104px;transform:translateX(-50%);background:var(--tx);color:var(--bg);padding:12px 18px;border-radius:14px;z-index:60;display:none;font-size:14px;animation:up .4s var(--ease)}
#toast button{color:var(--bg);background:none;text-decoration:underline;padding:0 6px;min-height:0}
#lock{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:20px}
.lk{width:min(330px,100%);display:flex;flex-direction:column;gap:12px;text-align:center}
.lg{color:var(--tx);display:flex;justify-content:center}
.vr{width:100px;height:100px;border-radius:50%;background:var(--card2);color:var(--tx);display:flex;align-items:center;justify-content:center;margin:14px auto;cursor:pointer;transition:background .3s,color .3s}
.vr.on{background:var(--pri);color:var(--onpri);animation:ring 1.5s infinite}
.ic{display:block}
/* movimento */
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fadein{from{opacity:0}}
@keyframes sheet{from{opacity:.4;transform:translateY(60px)}}
@keyframes grow{from{transform:scaleX(0)}}
@keyframes pop{0%{transform:scale(.6)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
@keyframes ring{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--pri) 35%,transparent)}100%{box-shadow:0 0 0 30px transparent}}
@keyframes draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.rv{opacity:0;transform:translateY(14px)}
.rv.in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i,0)*60ms)}
#app.enter .bar i{transform-origin:left;animation:grow 1s var(--ease) .25s both}
input[type=checkbox]:checked{animation:pop .3s var(--ease)}
.lg svg path:last-child{stroke-dasharray:100;animation:draw 1.3s var(--ease) both}
.lk>*{animation:up .6s var(--ease) both}.lk>*:nth-child(2){animation-delay:.08s}.lk>*:nth-child(3){animation-delay:.16s}.lk>*:nth-child(4){animation-delay:.24s}.lk>*:nth-child(5){animation-delay:.32s}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
