:root{
  --bg:#F5F6F8; --surface:#FFFFFF; --ink:#1D2133; --muted:#5E6478; --line:#DDE0E7;
  --rel:#5B2A86; --rel-bg:#EFE6F7;
  --civ:#24578C; --civ-bg:#E3EDF7;
  --fac:#9A6A06; --fac-bg:#FBF0D6;
  --df:#17705F; --df-bg:#DDF1EC;
  --lit:#8A5BB0;
  --act:#0B4FA0;
  --cur:#F39200; --cur-bg:#FFF1DC;
  --warn:#B3261E;
  --brand:#0B4FA0;
  --focus:#2563EB;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#14161F; --surface:#1C1F2B; --ink:#ECEDF3; --muted:#A1A6B8; --line:#2F3342;
    --rel:#C9A4EC; --rel-bg:#33244A; --civ:#8DB9E8; --civ-bg:#1D2F45;
    --fac:#E8C066; --fac-bg:#3D3115; --df:#7FD1BF; --df-bg:#163A33; --lit:#B994DB; --act:#7FB0F0; --cur:#FFAE3B; --cur-bg:#3E2A0C; --warn:#F08A80; --brand:#7FB0F0; --focus:#7AA7FF;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#14161F; --surface:#1C1F2B; --ink:#ECEDF3; --muted:#A1A6B8; --line:#2F3342;
  --rel:#C9A4EC; --rel-bg:#33244A; --civ:#8DB9E8; --civ-bg:#1D2F45;
  --fac:#E8C066; --fac-bg:#3D3115; --df:#7FD1BF; --df-bg:#163A33; --lit:#B994DB; --act:#7FB0F0; --cur:#FFAE3B; --cur-bg:#3E2A0C; --warn:#F08A80; --brand:#7FB0F0; --focus:#7AA7FF;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 "Figtree",system-ui,-apple-system,"Segoe UI",sans-serif}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px 60px}
h1,h2{font-family:"Literata",Georgia,"Times New Roman",serif;font-weight:700;margin:0}
h1{font-size:clamp(28px,4.4vw,44px);line-height:1.1;letter-spacing:-.01em}
h2{font-size:22px;line-height:1.25}
/* hero */
.hero{background:linear-gradient(160deg,#0D3473 0%,#0A2550 60%,#081C3D 100%);color:#EEF4FC;padding:22px 0 0;position:relative}
.hero .in{max-width:1180px;margin:0 auto;padding:0 20px}
.nav{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:14px}
.brand{display:inline-block;line-height:0;border-radius:4px}
.brand img{height:35px;width:auto;max-width:70vw;display:block}
.brand:focus-visible{outline:2px solid #fff;outline-offset:4px}
.nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav a{color:#BFD3F2;text-decoration:none}
.nav a:hover,.nav a:focus-visible{color:#fff;text-decoration:underline;outline:none}
.hero-body{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:40px;align-items:end;padding:64px 0 44px}
.hero h1{font-size:clamp(34px,5.2vw,62px);line-height:1.04;letter-spacing:-.015em;color:#fff}
.hero h1 .sub{display:block;font-family:"Figtree",system-ui,sans-serif;font-weight:600;font-size:.4em;letter-spacing:.08em;text-transform:uppercase;color:#BFD3F2;margin-top:16px;line-height:1.2}
.hero h1 .yr{display:block;font-weight:500;font-size:.62em;letter-spacing:0;color:#8EC1FF;margin-top:6px;line-height:1.15}
.lead{font-size:17px;line-height:1.55;color:#DCE7F7;max-width:46ch;margin:0 0 22px}
.cta{display:flex;gap:10px;flex-wrap:wrap}
.cta a{display:inline-block;padding:12px 20px;border-radius:8px;font-weight:600;text-decoration:none}
.cta .go{background:#FFFFFF;color:#0A2550}
.cta .ghost{border:1px solid #4F78B8;color:#fff}
.cta a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.status{margin-top:22px;font-size:14px;color:#A9C3EA}
.status b{color:#fff;font-weight:600}
.next{margin-top:6px;font-size:14px;color:#A9C3EA}
.next b{color:#FFFFFF;font-weight:600}
/* faixa do ano litúrgico */
.season{padding:0 0 26px}
.season p{font-size:13px;color:#A9C3EA;margin:0 0 8px}
.band{display:flex;height:44px;border-radius:6px;overflow:hidden}
.band i{display:block;height:100%;position:relative}
.band i span{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-style:normal;font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;max-width:calc(100% - 12px)}
.s-branco{background:#F6F1E4;color:#5B4A1E} .s-verde{background:#3F7D4E;color:#EAF5EC} .s-roxo{background:#7A4AA8;color:#F6EEFF} .s-vermelho{background:#C0392B;color:#fff}
.ticks{display:grid;grid-template-columns:repeat(12,1fr);font-size:11.5px;color:#9DB7E0;margin-top:6px}
.ticks span{border-left:1px solid #2B4C80;padding-left:4px}
.today-mark{position:absolute;top:-6px;bottom:-6px;width:2px;background:#F4C95D}
section.block{scroll-margin-top:16px}
.block-head{margin:56px 0 4px}
.block-head p{color:var(--muted);margin:6px 0 0;max-width:62ch}
@media (max-width:820px){.hero-body{grid-template-columns:1fr;padding:40px 0 30px;gap:24px}.band i span{display:none}}
.legend{display:flex;flex-wrap:wrap;gap:10px 18px;margin:18px 0 6px;font-size:13.5px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:7px}
.sw{width:14px;height:14px;border-radius:3px;display:inline-block}
.sw.rel{background:var(--rel)} .sw.civ{background:var(--civ)} .sw.fac{background:var(--fac)} .sw.df{background:var(--df)}
.sw.lit{background:transparent;border:2px solid var(--lit);border-radius:50%}
.sw.act{background:var(--act);width:7px;height:7px;border-radius:50%}
.sw.cur{background:var(--cur);border-radius:50%}

.year{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:16px}
.month{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 12px 10px}
.month header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.month header button{all:unset;cursor:pointer;font-family:"Literata",Georgia,serif;font-weight:700;font-size:17px;border-radius:4px}
.month header button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.month header small{font-size:12px;color:var(--muted)}
.month.sel{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center;font-size:12.5px}
.grid .wd{color:var(--muted);font-size:11px;padding:2px 0}
.d{position:relative;all:unset;box-sizing:border-box;text-align:center;padding:5px 0 7px;border-radius:5px;cursor:pointer;font-variant-numeric:tabular-nums}
.d{position:relative}
.d:hover{background:var(--bg)}
.d:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.d.sun{color:var(--muted)}
.d.rel{background:var(--rel);color:#fff;font-weight:600}
.d.civ{background:var(--civ);color:#fff;font-weight:600}
.d.fac{background:var(--fac-bg);color:var(--fac);font-weight:600;box-shadow:inset 0 0 0 1px var(--fac)}
.d.df{background:var(--df);color:#fff;font-weight:600}
.d.lit::before{content:"";position:absolute;inset:2px 4px;border:1.5px solid var(--lit);border-radius:50%;pointer-events:none}
.d.has::after{content:"";position:absolute;left:50%;bottom:2px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--act)}
.d.rel.has::after,.d.civ.has::after,.d.df.has::after{background:#fff}
.d.cur{box-shadow:inset 0 0 0 2px var(--cur)}
.d.cur:not(.rel):not(.civ):not(.df){background:var(--cur);color:#1F1300;font-weight:700;box-shadow:none}
.d.cur.has::after{background:#1F1300}
.d.cur.rel.has::after,.d.cur.civ.has::after,.d.cur.df.has::after{background:var(--cur)}
.mlist li.cur{color:var(--cur);font-weight:600}
.mlist li.cur b{color:var(--cur)}
tr.cur td:first-child{box-shadow:inset 4px 0 0 var(--cur)}
tr.cur td{background:var(--cur-bg)}
:root[data-theme="dark"] .d.rel,:root[data-theme="dark"] .d.civ,:root[data-theme="dark"] .d.df{color:#14161F}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .d.rel,:root:not([data-theme="light"]) .d.civ,:root:not([data-theme="light"]) .d.df{color:#14161F}}
.mlist{margin:8px 0 0;padding:8px 0 0;border-top:1px dashed var(--line);list-style:none;font-size:12.5px;color:var(--muted)}
.mlist li{display:flex;gap:6px;line-height:1.35;margin-bottom:3px}
.mlist li b{color:var(--ink);font-weight:600;min-width:20px;font-variant-numeric:tabular-nums}

.sheet{margin-top:56px}
.sheet-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:12px}
.tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
select,input,textarea,button{font:inherit;color:inherit}
.btn{border:1px solid var(--line);background:var(--surface);padding:8px 14px;border-radius:7px;cursor:pointer;font-weight:500}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
:root[data-theme="dark"] .btn.primary{color:#14161F}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn.primary{color:#14161F}}
.btn:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.tools select{border:1px solid var(--line);background:var(--surface);padding:8px 10px;border-radius:7px}
.scroller{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;min-width:980px;font-size:14px}
th{text-align:left;font-weight:600;font-size:12.5px;color:var(--muted);padding:10px 8px;border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0}
td{border-bottom:1px solid var(--line);padding:0;vertical-align:top}
tr:last-child td{border-bottom:0}
td input,td select,td textarea{width:100%;border:0;background:transparent;padding:10px 8px;border-radius:0;resize:vertical}
td textarea{min-height:42px;line-height:1.4;display:block}
td input:focus,td select:focus,td textarea:focus{outline:2px solid var(--focus);outline-offset:-2px;background:var(--bg)}
td.wk{padding:10px 8px;color:var(--muted);white-space:nowrap;font-size:13px}
td.del{width:40px;text-align:center;white-space:nowrap}
td.del button.armed{background:var(--warn);color:#fff;font-size:12.5px;font-weight:600;padding:7px 10px;border-radius:6px;margin:5px}
td.del button.armed:hover{color:#fff}
td.del button{all:unset;cursor:pointer;padding:10px;color:var(--muted);font-size:18px;line-height:1}
td.del button:hover{color:var(--warn)}
td.del button:focus-visible{outline:2px solid var(--focus)}
.flag{display:block;margin:-4px 8px 8px;font-size:12px;font-weight:600;padding:2px 7px;border-radius:4px;width:max-content;max-width:calc(100% - 16px)}
.flag.rel{background:var(--rel-bg);color:var(--rel)} .flag.civ{background:var(--civ-bg);color:var(--civ)}
.flag.fac{background:var(--fac-bg);color:var(--fac)} .flag.df{background:var(--df-bg);color:var(--df)} .flag.lit{background:var(--rel-bg);color:var(--lit)}
.st-Ideia{color:var(--muted)} .st-Confirmado{color:var(--df);font-weight:600} .st-Realizado{color:var(--civ)} .st-Cancelado{color:var(--warn);text-decoration:line-through}
.empty{padding:36px 20px;text-align:center;color:var(--muted)}
.empty .btn{margin-top:10px}
.note{margin-top:12px;font-size:13px;color:var(--muted)}
.banner{margin:14px 0 0;padding:10px 14px;border-radius:8px;background:var(--fac-bg);color:var(--fac);font-size:14px;display:none}

.hol{margin-top:56px}
.hol-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0 28px;margin-top:12px;padding:0;list-style:none}
.hol-list li{display:grid;grid-template-columns:62px 1fr;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.hol-list time{font-weight:600;font-variant-numeric:tabular-nums}
.hol-list small{display:block;color:var(--muted);font-size:12.5px}
.tag{font-size:11.5px;font-weight:600;padding:1px 6px;border-radius:4px;margin-left:6px;white-space:nowrap}
.tag.rel{background:var(--rel-bg);color:var(--rel)} .tag.civ{background:var(--civ-bg);color:var(--civ)} .tag.fac{background:var(--fac-bg);color:var(--fac)} .tag.df{background:var(--df-bg);color:var(--df)} .tag.lit{background:var(--rel-bg);color:var(--lit)}
footer{margin-top:36px;font-size:12.5px;color:var(--muted);max-width:75ch}
@media (max-width:640px){.top{grid-template-columns:1fr}.status{text-align:left}.wrap{padding:20px 14px 48px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* acesso para edição */
.auth{display:flex;gap:6px;align-items:center;font-size:13.5px;color:var(--muted)}
.auth input{border:1px solid var(--line);background:var(--surface);padding:8px 10px;border-radius:7px;width:150px}
.auth input:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.auth .ok{color:var(--df);font-weight:600}
.auth button.link{all:unset;cursor:pointer;color:var(--brand);text-decoration:underline;font-size:13.5px}
