.calendar-page,.feature-page { width:min(100%,760px); margin:0 auto; padding:8px 18px calc(96px + env(safe-area-inset-bottom)); box-sizing:border-box; }
.calendar-intro { display:flex; align-items:center; gap:14px; margin:10px 0 22px; }
.calendar-intro h1,.feature-page h1 { margin:0; font-size:24px; }
.calendar-intro p,.feature-subtitle { margin:5px 0 0; color:var(--SecondaryTextColor); font-size:13px; }
.calendar-month-nav { display:grid; grid-template-columns:42px 1fr 42px; align-items:center; text-align:center; margin:12px 0; }
.calendar-month-nav strong { text-transform:capitalize; font-size:18px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; padding:10px; border:1px solid var(--BorderPurple); border-radius:20px; background:var(--CardBackground); }
.calendar-weekday { text-align:center; color:var(--SecondaryTextColor); font-size:11px; padding:4px 0 8px; }
.calendar-day { min-width:0; min-height:54px; border:0; border-radius:12px; background:transparent; color:var(--PrimaryTextColor); position:relative; padding:7px 2px 4px; display:flex; align-items:center; flex-direction:column; gap:4px; cursor:pointer; }
.calendar-day.empty { pointer-events:none; }
.calendar-day.selected { background:var(--AccentPurple); color:#fff; }
.calendar-day.today:not(.selected) { outline:1px solid var(--AccentPurple); }
.calendar-day-number { font-size:13px; }
.calendar-day-dots { display:flex; height:5px; gap:2px; }
.calendar-day-dots i { display:block; width:4px; height:4px; border-radius:50%; background:var(--MagentaBright); }
.calendar-day.selected .calendar-day-dots i { background:#fff; }
.calendar-day-count { position:absolute; right:3px; top:2px; font-size:8px; opacity:.72; }
.calendar-selected-heading { display:flex; align-items:end; justify-content:space-between; gap:10px; margin:24px 0 12px; }
.calendar-selected-heading small { color:var(--SecondaryTextColor); letter-spacing:1px; font-size:9px; }
.calendar-selected-heading h2 { text-transform:capitalize; font-size:18px; margin:4px 0 0; }
.calendar-selected-heading .btn { white-space:nowrap; }
.calendar-event-row { display:flex; gap:14px; border:1px solid var(--BorderPurple); border-radius:16px; padding:14px; margin:9px 0; background:var(--CardBackground); }
.calendar-event-date { min-width:66px; display:flex; flex-direction:column; justify-content:center; align-items:center; border-right:1px solid var(--BorderPurple); padding-right:12px; color:var(--AccentPurple); }
.calendar-event-date strong { font-size:17px; }
.calendar-event-date span { font-size:9px; letter-spacing:.8px; }
.calendar-event-copy { display:flex; flex-direction:column; gap:4px; text-align:left; border:0; background:transparent; color:inherit; padding:0; flex:1; }
.calendar-event-copy strong { font-size:15px; }
.calendar-event-copy span,.calendar-event-copy small { font-size:12px; color:var(--SecondaryTextColor); }
.calendar-memory-image { display:block; width:100%; border-radius:14px; margin:10px 0; object-fit:cover; max-height:300px; }
.meta-detail-summary,.meta-detail-section { padding:16px 0; border-bottom:1px solid var(--BorderPurple); }
.meta-detail-summary { display:grid; gap:8px; }
.meta-detail-section h3 { font-size:16px; margin:0 0 12px; }
.meta-detail-section h4 { font-size:14px; margin:18px 0 8px; }
.meta-history-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--BorderPurple); }
.meta-history-row > div { display:flex; flex-direction:column; gap:4px; min-width:0; }
.meta-history-row small { color:var(--SecondaryTextColor); font-size:11px; overflow-wrap:anywhere; }
.nav-unread-badge { margin-left:auto; background:#e53967; color:#fff; font-size:10px; font-weight:700; line-height:19px; min-width:19px; height:19px; border-radius:12px; text-align:center; padding:0 5px; }
.drawer-language { padding:12px 18px; display:grid; gap:7px; color:var(--SecondaryTextColor); font-size:12px; }
.drawer-language select { border:1px solid var(--BorderPurple); background:var(--CardBackground); color:var(--PrimaryTextColor); border-radius:10px; padding:8px; }
.trilha-shell { height:calc(100dvh - 142px - env(safe-area-inset-bottom)); min-height:420px; padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
.trilha-shell iframe { width:100%; height:100%; border:0; }
.cropper-preview-wrap { width:min(100%,640px); height:min(62vh,520px); margin:0 auto; overflow:hidden; background:#160f18; border-radius:12px; }
.cropper-preview-wrap img { display:block; max-width:100%; max-height:100%; }
:root .page-header.article-page-header { width:min(calc(100% - 40px),780px); }
:root .article-detail-page { width:min(calc(100% - 40px),780px); padding:12px 0 calc(112px + env(safe-area-inset-bottom)); }
:root .article-paper { --article-inset:clamp(22px,4.5vw,48px); box-sizing:border-box; overflow:hidden; padding:var(--article-inset); border:1px solid var(--h-border); border-radius:24px; color:var(--h-text); background:var(--h-surface); box-shadow:var(--h-shadow); }
:root .article-hero-image { display:block; width:100%; height:clamp(180px,36vw,340px); margin:0 0 26px; border-radius:16px; object-fit:cover; background:var(--h-raised); }
:root .article-meta { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
:root .article-kicker { display:inline-flex; align-items:center; width:max-content; margin:0; padding:7px 11px; border-radius:999px; color:var(--h-accent); background:var(--h-soft); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:1.3px; }
:root .article-date { color:var(--h-muted); font-size:12px; }
:root .article-paper .article-title { margin:18px 0 14px; color:var(--h-text); font-family:var(--h-serif); font-size:clamp(32px,5vw,46px); font-weight:400; line-height:1.12; letter-spacing:-.55px; overflow-wrap:anywhere; }
:root .article-byline { display:flex; align-items:center; flex-wrap:wrap; gap:9px 16px; color:var(--h-muted); font-size:13px; }
:root .article-read-time { display:inline-flex; align-items:center; gap:6px; }
:root .article-read-time .fa { color:var(--h-accent); font-size:11px; }
:root .article-deck { margin:26px 0 0; padding:17px 18px; border-left:3px solid var(--h-accent); border-radius:0 14px 14px 0; color:var(--h-muted); background:var(--h-bg); font-size:15px; line-height:1.75; }
:root .article-body { margin-top:26px; padding-top:24px; border-top:1px solid var(--h-border); color:var(--h-text); font-family:var(--font-opensans); font-size:16px; line-height:1.9; white-space:pre-line; overflow-wrap:anywhere; }
:root .article-source { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:30px; padding-top:20px; border-top:1px solid var(--h-border); }
:root .article-source > span { color:var(--h-muted); font-size:12px; }
:root .article-source a { display:inline-flex; align-items:center; gap:8px; color:var(--h-accent); font-size:13px; font-weight:700; }
:root .article-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0; }
:root .article-actions .btn { min-width:0; padding-inline:12px; }
:root .article-status { margin:10px 0; padding:12px 16px; border:1px solid var(--h-border); border-radius:14px; color:var(--h-muted); background:var(--h-surface); font-size:13px; }
@media (max-width:819px) {
    :root .page-header.article-page-header { width:100%; }
    :root .article-detail-page { width:calc(100% - 32px); padding:12px 0 calc(104px + env(safe-area-inset-bottom)); }
}
@media (max-width:520px) {
    :root .article-paper { --article-inset:20px; border-radius:20px; }
    :root .article-hero-image { height:clamp(160px,54vw,250px); border-radius:13px; margin-bottom:22px; }
    :root .article-paper .article-title { font-size:32px; line-height:1.14; }
    :root .article-byline { font-size:12px; }
    :root .article-deck { margin-top:22px; padding:15px; font-size:14px; }
    :root .article-body { margin-top:22px; padding-top:20px; font-size:16px; line-height:1.85; }
    :root .article-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
    :root .article-actions .btn-primary-grad { grid-column:1/-1; }
}
.community-post-text { white-space:pre-wrap; }
.post-comment { padding:10px 0; border-top:1px solid var(--BorderPurple); }
.post-comment p { margin:5px 0; white-space:pre-wrap; }
.trip-summary-card { width:100%; display:flex; gap:14px; text-align:left; padding:0; overflow:hidden; margin:12px 0; border:1px solid var(--BorderPurple); border-radius:18px; background:var(--CardBackground); color:var(--PrimaryTextColor); cursor:pointer; }
.trip-summary-card > img { width:120px; min-height:126px; object-fit:cover; }
.trip-summary-icon { width:120px; display:grid; place-items:center; background:var(--SurfaceDark); font-size:36px; }
.trip-summary-copy { display:flex; flex-direction:column; gap:5px; padding:14px 12px 14px 0; }
.trip-summary-copy small { color:var(--SecondaryTextColor); }
.trip-filters { display:flex; overflow:auto; gap:7px; padding:7px 0; }
.filter-chip { display:inline-block; border:1px solid var(--BorderPurple); border-radius:20px; padding:6px 10px; color:var(--SecondaryTextColor); font-size:11px; white-space:nowrap; background:transparent; }
.filter-chip.active { background:var(--AccentPurple); color:#fff; }
.trip-photo-grid,.memory-grid,.memory-media-grid,.date-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:12px 0; }
.trip-photo-grid > div { position:relative; }
.trip-photo-grid img,.memory-grid img,.memory-media-grid img,.memory-media-grid video,.date-photo-grid img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:12px; background:var(--SurfaceDark); }
.memory-card { border:1px solid var(--BorderPurple); border-radius:14px; overflow:hidden; background:var(--CardBackground); color:var(--PrimaryTextColor); text-align:left; padding:0 0 10px; }
.memory-card strong,.memory-card small { display:block; padding:5px 10px 0; }
.memory-card small { color:var(--SecondaryTextColor); font-size:11px; }
.memory-pinned { width:100%; display:flex; border:0; padding:0; background:var(--CardBackground); color:var(--PrimaryTextColor); border-radius:18px; overflow:hidden; text-align:left; }
.memory-pinned img { width:40%; min-height:120px; object-fit:cover; }
.memory-pinned span { display:flex; flex-direction:column; justify-content:center; gap:8px; padding:14px; }
.memory-video,.memory-media-grid video,.course-video video,.course-video iframe { width:100%; aspect-ratio:16/9; border:0; border-radius:12px; background:#000; }
.memory-media-grid figure { margin:0; min-width:0; }
.memory-media-grid figcaption { font-size:11px; color:var(--SecondaryTextColor); padding:4px; }
.date-avatar { width:46px; height:46px; border-radius:50%; object-fit:cover; background:var(--SurfaceDark); }
.date-photo-grid img { aspect-ratio:1; }
.date-chat-messages { display:flex; flex-direction:column; gap:8px; max-height:48vh; overflow:auto; }
.date-chat-message { max-width:85%; align-self:flex-start; background:var(--SurfaceDark); border-radius:15px; padding:10px 12px; display:flex; flex-direction:column; gap:3px; }
.date-chat-message.mine { align-self:flex-end; background:var(--AccentPurple); color:#fff; }
.date-chat-message small { font-size:10px; opacity:.72; text-align:right; }
.kali-disclaimer { border:1px solid var(--BorderPurple); padding:12px; border-radius:13px; font-size:11px; color:var(--SecondaryTextColor); }
.kali-messages { display:flex; flex-direction:column; gap:10px; margin:16px 0; }
.kali-message { max-width:92%; border-radius:18px; padding:13px; background:var(--CardBackground); border:1px solid var(--BorderPurple); }
.kali-message.mine { align-self:flex-end; background:var(--AccentPurple); color:#fff; }
.kali-message-label { font-size:10px; opacity:.72; margin-bottom:5px; }
.kali-message-text { white-space:pre-wrap; line-height:1.5; }
.kali-message details { margin-top:10px; font-size:11px; opacity:.85; }
.kali-composer { position:sticky; bottom:calc(78px + env(safe-area-inset-bottom)); display:grid; grid-template-columns:1fr auto; gap:8px; padding:10px; background:var(--PageBackgroundColor); border:1px solid var(--BorderPurple); border-radius:17px; }
.kali-question small { color:var(--AccentPurple); letter-spacing:1px; }
.suggestion-chip { margin:4px; border:1px solid var(--BorderPurple); border-radius:20px; padding:8px 12px; background:var(--SurfaceDark); color:var(--PrimaryTextColor); }
.course-video { padding:12px 0; border-top:1px solid var(--BorderPurple); }
.sticker-preview { width:100%; max-height:360px; object-fit:contain; background:var(--SurfaceDark); border-radius:16px; }
.roulette-svg { width:180px; display:block; margin:16px auto; }
.roulette-svg.spinning { animation:roulette-spin 1.3s cubic-bezier(.12,.65,.12,1); }
.roulette-result { text-align:center; font-size:18px; font-weight:700; margin:10px 0; }
.match-options { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; margin:14px 0; }
.match-option { border:1px solid var(--BorderPurple); border-radius:12px; padding:10px; background:var(--SurfaceDark); color:var(--PrimaryTextColor); }
.match-option.selected { background:var(--AccentPurple); color:white; }
.match-results { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.match-results span { padding:8px 12px; border-radius:16px; background:#3c9d70; color:#fff; }
.ten-date-item { border-bottom:1px solid var(--BorderPurple); padding:9px 0; }
@keyframes roulette-spin { from { transform:rotate(0); } to { transform:rotate(1440deg); } }
.feature-card { border:1px solid var(--BorderPurple); border-radius:18px; padding:16px; background:var(--CardBackground); margin:10px 0; color:var(--PrimaryTextColor); }
.feature-card button,.feature-card select { max-width:100%; }
.feature-card h2,.feature-card h3 { margin:0 0 10px; }
.feature-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.feature-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--BorderPurple); }
.feature-row:last-child { border-bottom:0; }
.feature-muted { color:var(--SecondaryTextColor); font-size:12px; }
.feature-image { width:100%; max-height:320px; object-fit:cover; border-radius:14px; }
.date-candidate { overflow:hidden; border-radius:24px; background:var(--CardBackground); border:1px solid var(--BorderPurple); }
.date-candidate img { width:100%; height:min(58vh,520px); object-fit:cover; display:block; }
.date-candidate-copy { padding:16px; }
.date-actions { display:flex; justify-content:center; gap:22px; padding:18px; }
.date-actions button { width:58px; height:58px; border-radius:50%; border:0; font-size:24px; color:white; background:var(--AccentPurple); }
.chat-page { padding-bottom:calc(82px + env(safe-area-inset-bottom)); }
.chat-connection-state { text-align:center; font-size:10px; color:var(--SecondaryTextColor); padding:2px 8px 7px; }
.chat-connection-state.connected { color:#28D764; }
@media (max-width:420px) { .calendar-day { min-height:46px; } .calendar-grid { gap:2px; padding:7px; } .calendar-selected-heading h2 { font-size:15px; } }