:root{--bg:#f6f8ff;--card:#fff;--text:#0f172a;--muted:#64748b;--line:#e2e8f0;--primary:#2563eb;--primary2:#1d4ed8;--shadow:0 10px 30px rgba(2,8,23,.08);--radius:18px}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;background:var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}

/* Landing page styles */
.wrap{max-width:480px;margin:0 auto;padding:24px 20px;min-height:100vh;display:flex;flex-direction:column}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}

/* Header - centered layout */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.top-centered{display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:32px;text-align:center;padding-top:40px}
.logo-large{width:144px;height:auto;background:#fff;border-radius:24px;padding:12px}
.brand-sub{color:var(--muted);font-size:15px;font-weight:500;letter-spacing:0.5px}
.brand-free{color:var(--primary);font-size:13px;font-weight:600;margin-top:4px}

/* Brand elements */
.brand{display:flex;align-items:center;gap:10px}
.logo{width:44px;height:44px;border-radius:12px}
.logo-sm{width:34px;height:34px;border-radius:10px}
.brand-title{font-weight:950;font-size:16px}

/* Actions/buttons */
.actions{display:flex;gap:10px;margin-top:8px}
.btn{border:1px solid var(--line);background:#fff;padding:14px 28px;border-radius:14px;font-weight:700;font-size:16px;cursor:pointer;transition:all 0.2s ease}
.btn.primary{border-color:transparent;background:var(--primary);color:#fff}
.btn.primary:hover{background:var(--primary2);transform:scale(1.02)}
.btn.primary:active{transform:scale(0.98)}

/* Hero section */
.hero{text-align:center;flex:1}
.hero h1{margin:0 0 12px 0;font-size:24px;line-height:1.3;font-weight:800}
.hero p{color:var(--muted);margin:0 0 20px 0;line-height:1.5;font-size:16px}
.note{margin-top:16px;color:var(--muted);font-size:13px;padding:12px;background:var(--bg);border-radius:12px}

/* Footer */
.footer{padding:20px;color:var(--muted);font-size:12px;text-align:center;margin-top:auto}

/* App shell styles */
.app{max-width:820px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}
.appbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 14px 8px}
.appbar-left{display:flex;align-items:center;gap:10px}
.app-title{font-weight:950}
.app-sub{color:var(--muted);font-size:12px}
.chip{border:1px solid var(--line);background:#fff;padding:8px 10px;border-radius:999px;font-weight:900;cursor:pointer}
.content{padding:0 14px 90px;display:flex;flex-direction:column;gap:12px}

/* Forms */
label{display:block;font-weight:950;font-size:13px;margin:10px 0 6px}
input,textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-size:16px;background:#fff}
textarea{resize:vertical;min-height:120px}
.sep{border:none;border-top:1px solid var(--line);margin:14px 0}
.row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.h2{font-weight:950;font-size:18px}
.muted{color:var(--muted);font-size:13px}

/* Grid layout */
.grid2{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:600px){.grid2{grid-template-columns:1fr 1fr}}

/* Boxes and lists */
.box{border:1px solid var(--line);border-radius:16px;padding:12px;background:linear-gradient(180deg,#ffffff,#f7faff)}
.box-title{font-weight:950;margin-bottom:8px}
.list{display:flex;flex-direction:column;gap:8px}
.item{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff;display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.item .t{font-weight:950}
.item .s{color:var(--muted);font-size:12px;margin-top:2px}
.badge{font-size:11px;font-weight:950;padding:6px 8px;border-radius:999px;background:#eef2ff;color:#1d4ed8}
.badge.gray{background:#f1f5f9;color:#334155}
.item.selected{outline:3px solid #93c5fd;border-color:#93c5fd}

/* Bottom nav */
.bottom{position:fixed;left:0;right:0;bottom:0;background:#ffffffcc;backdrop-filter:blur(10px);border-top:1px solid var(--line);display:flex;gap:8px;padding:10px 12px;padding-bottom:max(10px, env(safe-area-inset-bottom))}
.navbtn{flex:1;border:1px solid var(--line);background:#fff;padding:12px;border-radius:14px;font-weight:950;cursor:pointer;font-size:14px}
.navbtn.active{background:var(--primary);color:#fff;border-color:transparent}

/* Toast */
.toast{position:fixed;top:12px;left:50%;transform:translateX(-50%);background:#0f172a;color:#fff;padding:12px 16px;border-radius:14px;display:none;max-width:90vw;z-index:9999}

/* Responsive adjustments for larger screens */
@media(min-width:600px){
  .wrap{max-width:560px;padding:40px 24px}
  .top-centered{padding-top:60px;gap:20px}
  .logo-large{width:168px}
  .brand-sub{font-size:17px}
  .hero h1{font-size:28px}
  .hero p{font-size:17px}
  .btn{padding:16px 36px;font-size:17px}
}

/* Motivation card styles */
.motivation-card{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:#fff;text-align:center;padding:20px}
.motivation-text{font-size:17px;line-height:1.5;font-weight:500;margin-bottom:12px}
.principle-text{font-size:14px;opacity:0.9;font-style:italic}

/* Calendar styles */
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:12px}
.calendar-day{border:1px solid var(--line);border-radius:10px;padding:8px 4px;text-align:center;cursor:pointer;min-height:60px;background:#fff}
.calendar-day:hover{background:var(--bg)}
.calendar-day.today{border-color:var(--primary);border-width:2px}
.calendar-day.selected{background:var(--primary);color:#fff}
.calendar-day .day-num{font-weight:700;font-size:14px}
.calendar-day .day-name{font-size:10px;color:var(--muted);margin-bottom:4px}
.calendar-day.selected .day-name{color:#fff;opacity:0.8}
.calendar-day .day-count{font-size:11px;margin-top:4px;color:var(--primary)}
.calendar-day.selected .day-count{color:#fff}

/* Live Coach chat styles */
.coach-card{display:flex;flex-direction:column;height:calc(100vh - 180px);max-height:600px}
.chat-messages{flex:1;overflow-y:auto;padding:12px 0;display:flex;flex-direction:column;gap:10px;min-height:200px}
.chat-message{max-width:85%;padding:10px 14px;border-radius:14px;font-size:15px;line-height:1.5;word-wrap:break-word}
.chat-message.user{align-self:flex-end;background:var(--primary);color:#fff;border-bottom-right-radius:4px}
.chat-message.assistant{align-self:flex-start;background:#f1f5f9;color:var(--text);border-bottom-left-radius:4px}
.chat-message .msg-time{font-size:10px;opacity:0.7;margin-top:4px;display:block}
.chat-composer{display:flex;gap:10px;margin-top:12px;align-items:flex-end}
.chat-composer textarea{flex:1;min-height:44px;resize:none}
.chat-composer .btn{min-width:70px;padding:12px 16px}
.chat-typing{padding:10px 14px;border-radius:14px;background:#f1f5f9;align-self:flex-start;color:var(--muted);font-style:italic}
.chat-empty{text-align:center;padding:40px 20px;color:var(--muted)}
.chat-empty-title{font-size:18px;font-weight:700;margin-bottom:8px;color:var(--text)}
.quick-prompts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:16px}
.quick-prompt{border:1px solid var(--line);background:#fff;padding:8px 12px;border-radius:999px;font-size:13px;cursor:pointer}
.quick-prompt:hover{background:var(--bg)}

/* Safe area for iPhone notch/home indicator */
@supports(padding: max(0px)) {
  .wrap{padding-bottom:max(24px, env(safe-area-inset-bottom))}
  .bottom{padding-bottom:max(10px, env(safe-area-inset-bottom))}
}

/* Landing page - new positioning styles */
.brand-title{font-weight:950;font-size:28px;color:var(--text)}
.brand-tagline{font-size:18px;color:var(--primary);font-weight:600;letter-spacing:0.3px}
.hero-sub{font-size:15px;color:var(--muted);margin-top:8px}

/* Pillars section */
.pillars{display:flex;flex-direction:column;gap:12px;margin:24px 0}
.pillar-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;display:flex;gap:12px;align-items:flex-start}
.pillar-icon{font-weight:950;font-size:18px;color:var(--primary);min-width:32px}
.pillar-card h3{margin:0 0 6px 0;font-size:15px;font-weight:700}
.pillar-card p{margin:0;font-size:13px;color:var(--muted);line-height:1.5}

/* CTA section */
.cta-section{text-align:center;margin:24px 0}
.cta-section h2{margin:0 0 12px 0;font-size:20px;font-weight:800}
.cta-section p{color:var(--muted);margin:0 0 20px 0;line-height:1.5}

/* Trust section */
.trust-section{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;padding:20px;color:var(--muted);font-size:12px}
.trust-item{display:flex;align-items:center;gap:6px}
.trust-item::before{content:"";width:8px;height:8px;background:var(--primary);border-radius:50%}

/* Intelligence UI styles */
.insight-card{background:linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%);color:#fff;border-radius:var(--radius);padding:20px}
.insight-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.insight-label{font-size:12px;text-transform:uppercase;letter-spacing:1px;opacity:0.7}
.insight-value{font-size:24px;font-weight:800}
.insight-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px}
.insight-stat{text-align:center;padding:12px;background:rgba(255,255,255,0.1);border-radius:12px}
.insight-stat-label{font-size:11px;opacity:0.7;margin-bottom:4px}
.insight-stat-value{font-size:18px;font-weight:700}

/* Signal badges */
.signal-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:700}
.signal-badge.signal{background:#dcfce7;color:#166534}
.signal-badge.uncertain{background:#fef9c3;color:#854d0e}
.signal-badge.noise{background:#fee2e2;color:#991b1b}

/* Entry card */
.entry-card{border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:12px;background:#fff}
.entry-date{font-size:12px;color:var(--muted);margin-bottom:8px}
.entry-content{margin-bottom:12px}
.entry-section{margin-bottom:10px}
.entry-section-label{font-size:11px;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:4px}
.entry-insight{background:var(--bg);border-radius:12px;padding:12px;margin-top:12px}
.entry-insight p{margin:0;font-size:14px;line-height:1.5}

/* Decision memory */
.decision-item{border-left:3px solid var(--primary);padding-left:12px;margin-bottom:12px}
.decision-title{font-weight:700;margin-bottom:4px}
.decision-context{font-size:13px;color:var(--muted)}
.decision-emotional{font-size:12px;color:var(--primary);margin-top:4px}

/* Report card */
.report-card{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:#fff;border-radius:var(--radius);padding:20px;margin-bottom:16px}
.report-period{font-size:12px;opacity:0.8;margin-bottom:8px}
.report-title{font-size:18px;font-weight:700;margin-bottom:16px}
.report-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.report-metric{text-align:center}
.report-metric-value{font-size:24px;font-weight:800}
.report-metric-label{font-size:11px;opacity:0.8}
.report-summary{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,0.2);font-size:14px;line-height:1.6}