/* Série Temporadas · Monte meu roteiro v3 · Material 3 com a identidade da série (14/11/2026). Spec: especialista UX, gate antes de publicar. */
@font-face{font-family:"DM Serif Display";font-display:swap;src:url("fonts/DMSerifDisplay-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:"DM Serif Display";font-display:swap;src:url("fonts/DMSerifDisplay-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+1E00-1EFF}
@font-face{font-family:"Oswald";font-weight:500;font-display:swap;src:url("fonts/Oswald-500-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Oswald";font-weight:500;font-display:swap;src:url("fonts/Oswald-500-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+1E00-1EFF}
@font-face{font-family:"Material Symbols Outlined";font-display:block;src:url("fonts/material-symbols.ttf") format("truetype")}
:root{
  --surface:#FBF8EF;--sc-low:#F6F1E3;--sc:#F0E9D6;--sc-high:#E8DFC8;--on-surface:#24231F;--on-var:#5C584E;--outline:#CFC5AE;
  --primary:#BC454E;--on-primary:#fff;--p-cont:#F6D9DB;--on-p-cont:#5A1A20;--s-cont:#F2C766;--on-s-cont:#24231F;--inverse:#24231F;--inv-primary:#F2C766;--error:#B3261E;
  --display:"DM Serif Display",Georgia,serif;--label:"Oswald","Arial Narrow",Arial,sans-serif;--body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --e1:0 1px 2px rgba(36,35,31,.12),0 1px 3px 1px rgba(36,35,31,.08);--e3:0 4px 8px 3px rgba(36,35,31,.12),0 1px 3px rgba(36,35,31,.18);
  --dec:cubic-bezier(.05,.7,.1,1);--acc:cubic-bezier(.3,0,.8,.15)}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface);color:var(--on-surface);font:16px/24px var(--body);-webkit-tap-highlight-color:transparent}
.ms{font-family:"Material Symbols Outlined";font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;direction:ltr;-webkit-font-feature-settings:"liga";font-feature-settings:"liga";-webkit-font-smoothing:antialiased;flex:none}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--on-surface);outline-offset:2px}
.tela{max-width:560px;margin:0 auto;padding:0 16px 112px;min-height:100vh}
[hidden]{display:none!important}
[tabindex="-1"]:focus{outline:none}
.vis{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* top app bar */
.bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:4px;height:64px;margin:0 -16px;padding:0 4px 0 4px;background:var(--surface);transition:box-shadow .2s}
.bar.rolou{background:var(--sc-low);box-shadow:var(--e1)}
.bar .tt{flex:1;min-width:0;font:500 14px/20px var(--label);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:12px}
.bar .tt.serif{font:400 22px/28px var(--display);letter-spacing:0;text-transform:none;padding-left:4px}
.ib{width:48px;height:48px;border:0;border-radius:50%;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative;text-decoration:none}
@media(hover:hover){.ib:hover{background:rgba(36,35,31,.08)}.item:hover{background:rgba(36,35,31,.06)}}.ib:active{background:rgba(36,35,31,.12)}
/* tipografia */
.display{font:400 32px/40px var(--display);margin:8px 0 16px}
.headline{font:400 24px/32px var(--display);margin:0}
.title{font:400 20px/28px var(--display);margin:0}
.lbl{font:500 14px/20px var(--label);letter-spacing:.08em;text-transform:uppercase}
.sec{margin:24px 0 12px;display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.sec .lbl{color:var(--on-var)}
.var{color:var(--on-var)}
/* perfil */
.perfil{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--outline);border-radius:16px}
.perfil img{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
.perfil b{display:block;font:400 20px/26px var(--display)}
/* chips */
.chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:8px;font:500 13px/18px var(--label);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;border:1px solid transparent}
.chip.feita{background:var(--sc-high);color:var(--on-surface)}
.chip.agora{background:var(--s-cont);color:var(--on-s-cont)}
.chip.agora:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--primary);animation:pulso 1.6s infinite}
.chip.rodada{background:var(--p-cont);color:var(--on-p-cont)}
.chip.depois{background:var(--sc);color:var(--on-var)}
.chip.pulei{background:#E3E8F2;color:#2E3A55}
@keyframes pulso{0%{box-shadow:0 0 0 0 rgba(188,69,78,.5)}70%{box-shadow:0 0 0 7px rgba(188,69,78,0)}100%{box-shadow:0 0 0 0 rgba(188,69,78,0)}}
.filtros{display:flex;gap:8px;overflow-x:auto;padding:4px 0 12px;margin:0 -16px;padding-left:16px;padding-right:16px;scrollbar-width:none}
.filtros::-webkit-scrollbar{display:none}
.fchip{flex:none;height:40px;padding:0 16px;border-radius:8px;border:1px solid var(--outline);background:transparent;font:500 14px var(--body);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.fchip[aria-pressed=true]{background:var(--s-cont);border-color:var(--s-cont)}
/* listas */
.lista{list-style:none;margin:0;padding:0;background:var(--sc-low);border-radius:16px;overflow:hidden}
.lista li+li{border-top:1px solid var(--sc-high)}
.item{display:flex;align-items:center;gap:16px;min-height:64px;padding:8px 8px 8px 16px;text-decoration:none;width:100%;background:transparent;border:0;text-align:left;cursor:pointer}
.item:active{background:rgba(36,35,31,.1)}
.item .sg{width:44px;height:40px;border-radius:12px;background:var(--sc-high);display:flex;align-items:center;justify-content:center;font:500 15px var(--label);letter-spacing:.04em;flex:none}
.item .tx{flex:1;min-width:0}.item .tx b{display:block;font:400 18px/24px var(--display)}.item .tx small{display:block;font-size:14px;line-height:20px;color:var(--on-var)}
.item .ms.ch{color:var(--on-var)}
.item .ic{width:40px;height:40px;border-radius:50%;background:var(--sc-high);display:flex;align-items:center;justify-content:center;flex:none}
.item .ok{color:var(--primary)}
/* cards */
.card{background:var(--sc);border-radius:16px;padding:16px;box-shadow:var(--e1)}
.card.out{background:transparent;border:1px solid var(--outline);box-shadow:none}
.rod-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:12px}
.cidades{display:grid;gap:12px}
.cc{background:var(--surface);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.cc img{width:100%;height:150px;flex:none;object-fit:cover;display:block}
.helper{font-size:13px;line-height:16px;color:var(--on-var);margin:4px 16px 0}
.cc .cb{padding:12px 16px 16px}
.cc .cb .linha{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.cc .pct{font:500 22px var(--label)}
.cc .lin{font-size:14px;line-height:20px;color:var(--on-var);margin:2px 0 0}
.prog{height:8px;border-radius:4px;background:var(--sc-high);margin-top:10px;overflow:hidden}
.prog i{display:block;height:100%;width:0;border-radius:4px;background:var(--outline);transition:width .6s var(--dec)}
.cc.lider .prog i{background:var(--primary)}
.cc.meu{background:var(--s-cont)}.cc.meu .lin{color:var(--on-s-cont)}
.cc.mini{flex-direction:row;align-items:center;gap:12px;padding:8px 12px}.cc.mini .cb{padding:0;flex:1}.cc.mini img{display:none}
.voto-ok{display:inline-flex;align-items:center;gap:6px;font:500 14px var(--body);color:var(--on-s-cont)}
.cc .acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:24px;border:0;cursor:pointer;font:500 15px/20px var(--body);text-decoration:none;position:relative;overflow:hidden;transition:box-shadow .2s}
.btn .ms{font-size:20px}
.btn.f{background:var(--primary);color:var(--on-primary)}.btn.f:hover{box-shadow:var(--e1)}
.btn.t{background:var(--p-cont);color:var(--on-p-cont)}
.btn.o{background:transparent;border:1px solid var(--outline);color:var(--primary)}
.btn.x{background:transparent;color:var(--primary);padding:0 12px}
.btn.dark{background:var(--inverse);color:#fff}
.btn.full{width:100%}
.btn:active:after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.12)}
.btn[disabled]{opacity:.38;cursor:default}
.linha-btn{display:flex;gap:8px;flex-wrap:wrap}.linha-btn .btn{flex:1}
/* FAB */
.fab{position:fixed;right:16px;bottom:calc(16px + var(--ck,0px));z-index:30;display:inline-flex;align-items:center;gap:12px;height:56px;padding:0 20px 0 16px;border-radius:16px;border:0;background:var(--primary);color:#fff;box-shadow:var(--e3);font:500 16px var(--body);cursor:pointer;transition:transform .3s var(--dec)}
@media(min-width:592px){.fab{right:calc(50% - 264px)}}
.fab.esc{transform:translateY(160px)}.fab.icone{padding:0;width:56px;justify-content:center}.fab.icone .fl{display:none}
/* sheets e diálogo */
.veu{position:fixed;inset:0;background:rgba(36,35,31,.32);z-index:40;opacity:0;transition:opacity .2s}
.veu.on{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-width:560px;margin:0 auto;background:var(--sc-low);border-radius:28px 28px 0 0;box-shadow:var(--e3);max-height:92vh;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .3s var(--dec)}
.sheet.on{transform:none}
.sheet.cheia{top:0;max-height:none;border-radius:0}
@media(min-width:592px){.sheet.cheia{top:24px;border-radius:28px 28px 0 0}}
.sheet .alca{width:32px;height:4px;border-radius:2px;background:var(--outline);margin:12px auto 4px;flex:none}
.sheet .sh-top{display:flex;align-items:center;gap:4px;padding:4px 8px 0;flex:none}
.sheet .sh-top .title{flex:1}
.sheet .sh-corpo{padding:8px 24px 24px;overflow:auto;flex:1}
.sheet .sh-pe{padding:12px 24px calc(16px + env(safe-area-inset-bottom));display:flex;gap:8px;justify-content:space-between;align-items:center;border-top:1px solid var(--sc-high);flex:none;background:var(--sc-low)}
.passos{list-style:none;margin:8px 0 16px;padding:0;display:grid;gap:16px}
.passos li{display:flex;gap:16px;align-items:flex-start}
.passos .n{width:40px;height:40px;border-radius:50%;background:var(--p-cont);color:var(--on-p-cont);display:flex;align-items:center;justify-content:center;flex:none}
.dialog{position:fixed;left:24px;right:24px;top:50%;z-index:41;max-width:400px;margin:0 auto;background:var(--sc-high);border-radius:28px;padding:24px;box-shadow:var(--e3);transform:translateY(-40%);opacity:0;transition:transform .25s var(--dec),opacity .2s}
.dialog.on{transform:translateY(-50%);opacity:1}
.dialog h2{font:400 24px/32px var(--display);margin:0 0 12px}
.dialog .acoes{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
/* stepper */
.stp{display:flex;align-items:center;gap:12px;margin:4px 0 16px}
.stp .barra{flex:1;height:4px;border-radius:2px;background:var(--sc-high);overflow:hidden}
.stp .barra i{display:block;height:100%;background:var(--primary);transition:width .3s var(--dec)}
.passo-anim{animation:entra .3s var(--dec)}
@keyframes entra{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
.sug{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.schip{min-height:40px;padding:8px 16px;border-radius:8px;border:1px solid var(--outline);background:transparent;cursor:pointer;font:15px var(--body);display:inline-flex;align-items:center;gap:6px;position:relative}
.schip:after{content:"";position:absolute;inset:-4px 0}
.schip small{font:500 14px var(--label);color:var(--on-var)}
.schip[aria-pressed=true]{background:var(--s-cont);border-color:var(--s-cont)}
.campo{position:relative;margin-top:8px}
.campo input,.campo select{width:100%;height:56px;padding:0 16px;border:1px solid var(--outline);border-radius:4px;background:transparent;font:16px var(--body);color:var(--on-surface)}
.campo input:focus,.campo select:focus{outline:0;border:2px solid var(--primary);padding:0 15px}
.campo label{position:absolute;left:12px;top:-9px;padding:0 4px;background:var(--sc-low);font-size:12px;line-height:16px;color:var(--on-var);transition:all .15s;pointer-events:none}
.campo input:placeholder-shown:not(:focus)+label{top:16px;font-size:16px;line-height:24px}
.escolha{display:grid;gap:8px;margin:16px 0}.escolha label{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 16px;border:1px solid var(--outline);border-radius:12px;cursor:pointer}.escolha input{width:20px;height:20px;accent-color:var(--primary)}.escolha label:has(input:checked){background:var(--s-cont);border-color:var(--s-cont)}
.res{list-style:none;padding:0;margin:8px 0 0}
.res li{display:flex;align-items:center;gap:12px;min-height:56px;border-bottom:1px solid var(--sc-high)}
.res li .tx{flex:1}.res li small{display:block;color:var(--on-var);font-size:13px}
.vazio{color:var(--on-var);font-size:15px}
/* snackbar e cookies */
.snack{position:fixed;left:16px;right:16px;bottom:calc(88px + var(--ck,0px));z-index:50;max-width:528px;margin:0 auto;background:var(--inverse);color:#fff;border-radius:4px;padding:14px 16px;display:flex;align-items:center;gap:12px;box-shadow:var(--e3);transform:translateY(20px);opacity:0;transition:all .25s var(--dec);pointer-events:none}
.snack.on{transform:none;opacity:1;pointer-events:auto}
body.semfab .snack{bottom:calc(16px + var(--ck,0px))}
.snack span{flex:1}.snack button{background:none;border:0;color:var(--inv-primary);font:500 14px var(--body);cursor:pointer;min-height:40px;padding:0 8px}
.cookies{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--inverse);color:#fff;padding:8px 12px;font-size:13px;display:flex;gap:8px;align-items:center}
.cookies p{margin:0;flex:1}.cookies button{font:500 13px var(--body);background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7);border-radius:16px;padding:0 14px;min-height:36px;cursor:pointer}
body.modal .cookies{display:none}
.offline{background:var(--error);color:#fff;text-align:center;font-size:14px;padding:6px}
/* skeleton */
.sk{background:linear-gradient(90deg,var(--sc) 0,var(--sc-high) 50%,var(--sc) 100%);background-size:200% 100%;animation:sk 1.2s infinite;border-radius:8px}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}
.rodape{margin-top:32px;text-align:center;font-size:13px;line-height:20px;color:var(--on-var)}
.rodape a{color:var(--on-var);display:inline-block;padding:12px 4px}
.creditos{font-size:12px}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.cat-big{display:flex;align-items:center;gap:10px;color:var(--primary)}.cat-big .ms{font-size:36px}.cat-big span:last-child{font:400 44px/48px var(--display);letter-spacing:.01em}
.regra{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:var(--sc-low);font-size:14px;line-height:20px;color:var(--on-var)}