/* Enquadramento visual de mockup para a prévia em desktop. */
body{min-height:100vh;background:linear-gradient(135deg,#dce6f4,#f5f7fb 48%,#d7e1f0)}
.app-shell{position:relative;width:min(390px,calc(100vw - 28px));min-height:844px;margin:28px auto;background:#fff;border:10px solid #101b33;border-radius:38px;overflow:hidden;box-shadow:0 22px 55px rgba(18,37,71,.28)}
.app-shell:before{content:"";position:absolute;z-index:20;top:0;left:50%;width:116px;height:23px;transform:translateX(-50%);border-radius:0 0 15px 15px;background:#101b33}
.app-shell:after{content:"";position:absolute;z-index:21;top:9px;left:50%;width:7px;height:7px;transform:translateX(38px);border-radius:50%;background:#334364}
@media(max-width:700px){body{background:#fff}.app-shell{width:100%;min-height:100vh;margin:0;border:0;border-radius:0;box-shadow:none}.app-shell:before,.app-shell:after{display:none}}

/* Escala compacta para a leitura confortável em uma tela de celular. */
.app-shell .topbar{height:64px;padding-left:18px;padding-right:18px;gap:12px}
.app-shell .event-switcher{margin-right:auto;text-align:left}
.app-shell .brand{font-size:18px}
.app-shell .brand-mark{width:24px;height:24px}
.app-shell main{padding-left:20px;padding-right:20px;padding-bottom:28px}
.app-shell .welcome{min-height:255px;padding-top:30px;padding-bottom:28px}
.app-shell .welcome h1{font-size:27px;line-height:1.08;letter-spacing:-1px}
.app-shell .intro{font-size:13px;line-height:1.45;margin-top:14px;max-width:275px}
.app-shell .welcome-art{width:112px;height:90px;font-size:52px}
.app-shell .tabs{gap:18px;margin-top:20px;margin-bottom:24px}
.app-shell .tab{font-size:11px;padding-bottom:11px}
.app-shell .section-heading h2{font-size:20px}
.app-shell .kicker{font-size:9px;margin-bottom:8px}
.app-shell .date-button{font-size:11px;padding:8px 10px}
.app-shell .filter{font-size:10px;padding:8px 10px}
.app-shell .session{grid-template-columns:78px 5px 1fr;gap:9px;padding:13px 11px}
.app-shell .time{font-size:11px}.app-shell .time strong{font-size:16px}
.app-shell .session h3{font-size:14px;line-height:1.25;margin-top:7px}
.app-shell .session p{font-size:11px}
.app-shell .session-actions{gap:6px;margin-top:11px}
.app-shell .reminder,.app-shell .availability{font-size:10px}
.app-shell .reminder-control{margin-top:9px;color:#8a96a8}.app-shell .reminder-control small{display:block;font-size:9px;font-weight:800;line-height:1;margin-bottom:5px}.app-shell .reminder-options{display:flex;align-items:center;gap:3px;white-space:nowrap}.app-shell .reminder-time{padding:3px 4px;border:1px solid #dbe5f2;border-radius:4px;background:#fff;color:#718096;font-size:9px;cursor:pointer}.app-shell .reminder-time.selected{border-color:#2aa97e;background:#dff7ec;color:#217d60;font-weight:800}
.app-shell .attendance-control{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.app-shell .attendance-control button{border:1px solid #dbe5f2;border-radius:5px;background:#fff;color:#617089;padding:5px 6px;font-size:9px;font-weight:800;cursor:pointer}.app-shell .attendance-control .going.is-set{border-color:#8fb6e5;background:#eaf3ff;color:#3366a8}.app-shell .attendance-control .arrived{display:none;border-color:#82c9ad;background:#e5f8f0;color:#257a5f}.app-shell .attendance-control .arrived.visible{display:block}.app-shell .attendance-control .arrived.is-set{background:#2aa97e;color:#fff;border-color:#2aa97e}.app-shell .attendance-list{display:grid;gap:10px;margin-top:22px}.app-shell .attendance-card{padding:14px;border:1px solid #dbe5f2;border-radius:11px;background:#fff}.app-shell .attendance-card strong{display:block;font-size:13px}.app-shell .attendance-card span{display:block;margin-top:4px;color:#68758b;font-size:11px}.app-shell .empty-state{padding:25px 15px;border:1px dashed #cbd8e9;border-radius:11px;color:#8290a3;text-align:center;font-size:12px}
.app-shell .session.next{border-color:#f3aaa5;background:#fffdfd;box-shadow:0 0 0 2px rgba(245,109,105,.08)}.app-shell .session.next .session-line{background:#f56d69}.app-shell .next-badge{display:inline-block;margin-right:4px;padding:4px 6px;border-radius:4px;background:#fff0ef;color:#c85450;font-size:9px;font-weight:900;letter-spacing:.7px}
.app-shell .session.status-live{border-color:#f3aaa5;background:#fffdfd;box-shadow:0 0 0 2px rgba(245,109,105,.08)}.app-shell .session.status-live .session-line{background:#f56d69}.app-shell .session.status-ended{opacity:.68}.app-shell .status-badge{display:inline-block;margin-right:4px;padding:4px 6px;border-radius:4px;background:#eef3f8;color:#62758c;font-size:9px;font-weight:900;letter-spacing:.7px}.app-shell .status-badge.live{background:#fff0ef;color:#c85450}.app-shell .status-badge.next{background:#e9f2ff;color:#3366a8}.app-shell .status-badge.ended{background:#edf0f3;color:#66717f}
.app-shell .premium-banner{margin-left:20px;margin-right:20px;padding:12px 13px}
.app-shell .premium-banner strong{font-size:11px}.app-shell .premium-banner p{font-size:10px}
