:root{
  --creme:#EEE4DA; --paper:#F7F1EB; --sand:#D8C4AC; --pink:#C8A49F; --burg:#4D0E13; --burg-2:#6A1820;
  --muted:#6B3A3E; --ink:#4D0E13; --white:#FFFFFF;
  --serif:'Cormorant Garamond', Georgia, serif; --sans:'Jost', system-ui, -apple-system, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--creme);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--burg)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.1}
h1{font-size:34px} h2{font-size:26px;font-weight:500} h3{font-size:20px;font-weight:500}
em{font-style:italic}
.eyebrow{font-size:10px;letter-spacing:.26em;font-weight:500;text-transform:uppercase;margin:0}
.muted{color:var(--muted)}
.small{font-size:13px}
.hidden{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 22px;border-radius:999px;border:none;background:var(--burg);color:var(--creme);font-weight:500;font-size:15px;cursor:pointer;text-decoration:none;transition:background-color .15s, transform .15s}
.btn:hover{background:var(--burg-2);color:var(--creme)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.6;cursor:default}
.btn.light{background:var(--creme);color:var(--burg)}
.btn.light:hover{background:var(--white);color:var(--burg)}
.btn.ghost{background:transparent;color:var(--burg);border:1px solid var(--pink)}
.btn.ghost:hover{background:var(--sand);color:var(--burg)}
.btn.ghost-light{background:transparent;color:var(--creme);border:1px solid var(--pink)}
.btn.small{min-height:40px;padding:0 16px;font-size:13px}
.btn.block{width:100%}
.link-btn{background:none;border:none;padding:8px 4px;min-height:40px;color:var(--burg);text-decoration:underline;cursor:pointer;font-size:13px}
:focus-visible{outline:2px solid var(--burg);outline-offset:2px}

/* formulários */
label.field{display:flex;flex-direction:column;gap:6px;font-size:13px}
.input{height:46px;border:1px solid var(--pink);border-radius:12px;padding:0 12px;background:var(--white);color:var(--ink);font-size:16px;width:100%}
textarea.input{height:auto;min-height:80px;padding:10px 12px;resize:vertical}
.dark .input{border:none;background:var(--creme)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.msg{font-size:13px;margin:0}
.msg.error{color:var(--burg);font-weight:500}

/* cartões */
.card{background:var(--paper);border-radius:24px;padding:18px 20px}
.card.dark{background:var(--burg);color:var(--creme)}
.card.dark .eyebrow{color:var(--sand)}
.card.sand{background:var(--sand)}
.card.pink{background:var(--pink)}
.stat{font-family:var(--serif);font-size:38px;line-height:1.1;display:block;margin-top:4px}
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:500;background:var(--sand);white-space:nowrap}
.pill.outline{background:transparent;border:1px solid var(--pink);font-weight:400}
.pill.alert{background:var(--pink)}
.bar{height:8px;border-radius:999px;background:var(--sand);overflow:hidden}
.bar>span{display:block;height:100%;background:var(--burg);border-radius:999px}

/* marca */
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:inherit}
.brand .wm{display:flex;flex-direction:column;line-height:1}
.brand .wm small{font-size:9px;letter-spacing:.45em}
.brand .wm span{font-family:var(--serif);font-style:italic;font-weight:300;font-size:28px}

/* ===== portal da mentorada ===== */
.app{max-width:480px;margin:0 auto;min-height:100vh;padding:0 0 110px;position:relative}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 6px}
.avatar{width:40px;height:40px;border-radius:999px;background:var(--pink);display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:500}
.view{padding:0 20px;display:flex;flex-direction:column;gap:14px}
.tabbar{position:fixed;left:0;right:0;bottom:0;background:var(--paper);border-top:1px solid var(--sand);padding:8px 12px calc(14px + env(safe-area-inset-bottom));z-index:10}
.tabbar nav{max-width:480px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.tabbar a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:var(--muted);text-decoration:none;min-height:52px}
.tabbar a .ic{padding:4px 16px;border-radius:999px;display:inline-flex}
.tabbar a[aria-current="page"]{color:var(--burg);font-weight:500}
.tabbar a[aria-current="page"] .ic{background:var(--sand)}
.list{display:flex;flex-direction:column;gap:6px}
.task{all:unset;box-sizing:border-box;width:100%;min-height:58px;display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:18px;background:var(--paper);cursor:pointer}
.task:focus-visible{outline:2px solid var(--burg)}
.check{flex:0 0 auto;width:26px;height:26px;border-radius:999px;border:1.5px solid var(--burg);display:inline-flex;align-items:center;justify-content:center}
.task.done .check{background:var(--burg)}
.task.done .t{text-decoration:line-through;color:var(--muted);font-weight:400}
.task .t{font-size:15px;font-weight:500;display:block}
.task .d{font-size:12px;color:var(--muted);display:block}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--sand)}
.row:last-child{border-bottom:none}
.date-badge{flex:0 0 auto;width:48px;text-align:center;line-height:1}
.date-badge b{display:block;font-family:var(--serif);font-weight:400;font-size:26px}
.date-badge small{font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.chart{display:flex;align-items:flex-end;gap:10px;height:130px;margin-top:10px}
.chart .col{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;font-size:11px}
.chart .b{width:100%;border-radius:10px 10px 4px 4px;background:var(--pink)}
.chart .col:last-child .b{background:var(--burg)}
.welcome{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.welcome .card{max-width:420px;text-align:center;padding:36px 28px;display:flex;flex-direction:column;align-items:center;gap:14px}

/* ===== painel ===== */
.admin{display:flex;flex-wrap:wrap;min-height:100vh}
.side{flex:1 1 220px;max-width:100%;background:var(--burg);color:var(--creme);padding:26px 22px;display:flex;flex-direction:column;gap:26px}
.side nav{display:flex;flex-direction:column;gap:4px}
.side nav a{color:var(--creme);opacity:.85;text-decoration:none;padding:11px 16px;border-radius:999px;font-size:15px}
.side nav a:hover{opacity:1}
.side nav a[aria-current="page"]{background:var(--creme);color:var(--burg);opacity:1;font-weight:500}
.main{flex:999 1 560px;min-width:0;padding:clamp(18px,3vw,40px);display:flex;flex-direction:column;gap:18px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.split{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.split>*{flex:1 1 320px;min-width:0}
.split>.wide{flex:2 1 460px}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:11px;letter-spacing:.14em;color:var(--muted);font-weight:500;padding:10px 8px;text-transform:uppercase;white-space:nowrap}
td{padding:11px 8px;border-top:1px solid var(--sand);vertical-align:middle}
.cell-btn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border-radius:10px;min-height:32px}
.cell-btn:hover{background:var(--sand)}
.dot{width:22px;height:22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.dot.on{background:var(--burg)}
.dot.off{border:1.5px solid var(--pink)}
.linkbox{display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:var(--creme);border-radius:14px;padding:10px 12px;word-break:break-all;font-size:13px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--burg);color:var(--creme);padding:12px 20px;border-radius:999px;font-size:14px;z-index:50;box-shadow:0 8px 24px rgba(77,14,19,.25)}
.empty{padding:22px;text-align:center;color:var(--muted);font-size:14px}
@media (max-width:640px){ .side{padding:18px 16px;gap:14px} .side nav{flex-direction:row;flex-wrap:wrap} .side .foot{display:none} }