/* App shell, Today, Calendar, Profile and first-run setup. Tokens are defined for both themes;
   theme.js sets html[data-theme]. Class names are prefixed a- so they cannot clash with chat.html / profiles.js. */
:root{
  --a-bg:#151027; --a-card:#211c34; --a-hero:#2c263f; --a-chip:#37314a; --a-line:#3b364f;
  --a-text:#e7deff; --a-sub:#d4c4b0; --a-muted:#a99d8a; --a-gold:#f8bc51; --a-on-gold:#422c00;
  --a-good:#a1d3a0; --a-bad:#ffb4ab; --a-warm:#fdb699; --a-glow:rgba(248,188,81,.16);
}
html[data-theme="light"]{
  --a-bg:#faf5e9; --a-card:#ffffff; --a-hero:#fff3d6; --a-chip:#f4ead2; --a-line:#e6dcc4;
  --a-text:#2a2140; --a-sub:#4d4360; --a-muted:#6b6275; --a-gold:#8a5a00; --a-on-gold:#ffffff;
  --a-good:#2d6a35; --a-bad:#9a2b22; --a-warm:#8a3f1f; --a-glow:rgba(138,90,0,.08);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--a-bg);color:var(--a-text);font-family:Inter,system-ui,sans-serif;overscroll-behavior:none}
a{text-decoration:none;color:inherit}
button{font-family:inherit;color:inherit}
.a-serif{font-family:'Playfair Display',Georgia,serif}

.a-app{position:fixed;left:0;right:0;top:0;height:var(--vh,100dvh);display:flex;flex-direction:column;overflow:hidden;background:var(--a-bg)}
.a-pages{flex:1;min-height:0;position:relative}
.a-page{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(20px,env(safe-area-inset-top)) 20px 24px;display:none}
.a-page.active{display:block}
#page-ask{padding:0;overflow:hidden}
#page-ask.active{display:flex;flex-direction:column}
.a-kb .a-tabbar{display:none}

/* tab bar */
.a-tabbar{flex-shrink:0;display:flex;border-top:1px solid var(--a-line);background:var(--a-card);padding-bottom:env(safe-area-inset-bottom)}
.a-tab{flex:1;min-height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11.5px;color:var(--a-muted);background:none;border:0;cursor:pointer}
.a-tab svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.a-tab.active{color:var(--a-gold);font-weight:600}

/* header */
.a-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.a-where{font-size:13px;color:var(--a-muted);display:flex;align-items:center;gap:6px;min-height:20px}
.a-where svg{width:14px;height:14px;fill:none;stroke:var(--a-gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.a-where button{background:none;border:0;padding:0;font-size:13px;color:var(--a-muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.a-hello{font-family:'Playfair Display',serif;font-size:24px;font-weight:600;margin-top:2px}
.a-icon-btn{width:44px;height:44px;border-radius:22px;border:1px solid var(--a-line);background:var(--a-card);color:var(--a-gold);font-size:18px;cursor:pointer;flex-shrink:0}

/* hero */
.a-hero{margin-top:18px;border-radius:24px;padding:20px;background:var(--a-hero);border:1px solid var(--a-line);position:relative;overflow:hidden}
.a-hero::before{content:"";position:absolute;top:-80px;right:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,var(--a-glow),transparent 65%);pointer-events:none}
.a-eyebrow{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--a-gold);font-weight:600}
.a-tithi{font-family:'Playfair Display',serif;font-size:30px;line-height:1.2;font-weight:600;margin-top:8px;position:relative}
.a-limbs{font-size:16px;color:var(--a-sub);margin-top:4px;position:relative}
.a-pills{display:flex;gap:10px;margin-top:16px;position:relative}
.a-pill{flex:1;min-width:0;border-radius:16px;padding:12px 14px;background:var(--a-chip)}
.a-pill small{display:block;font-size:12px;color:var(--a-muted)}
.a-pill b{display:block;font-size:15px;font-weight:600;margin-top:3px}
.a-pill span{display:block;font-size:12px;color:var(--a-muted);margin-top:2px}
.a-pill.bad b{color:var(--a-bad)} .a-pill.good b{color:var(--a-good)}
.a-flag{margin-top:12px;font-size:13.5px;color:var(--a-sub);position:relative}
.a-flag b{color:var(--a-warm)}

/* ask bar */
.a-askbar{margin-top:14px;display:flex;align-items:center;gap:8px;height:52px;border-radius:26px;padding:0 6px 0 18px;background:var(--a-card);border:1px solid var(--a-line)}
.a-askbar input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--a-text);font:15px Inter,sans-serif}
.a-askbar input::placeholder{color:var(--a-muted)}
.a-askbar button{width:40px;height:40px;border-radius:20px;border:0;background:var(--a-gold);color:var(--a-on-gold);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.a-askbar svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.a-chips{display:flex;gap:8px;margin-top:10px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.a-chips::-webkit-scrollbar{display:none}
.a-chip{flex-shrink:0;padding:10px 14px;border-radius:18px;background:var(--a-chip);border:0;color:var(--a-text);font-size:13.5px;cursor:pointer}

/* sections and cards */
.a-h{margin:22px 0 0;font-size:13px;font-weight:600;color:var(--a-muted);letter-spacing:.06em;text-transform:uppercase}
.a-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.a-card{border-radius:18px;padding:14px;background:var(--a-card);border:1px solid var(--a-line);min-width:0}
.a-card small{display:block;font-size:12px;color:var(--a-muted)}
.a-card b{display:block;font-size:17px;font-weight:600;margin-top:4px}
.a-card b.good{color:var(--a-good)} .a-card b.bad{color:var(--a-bad)} .a-card b.best{color:var(--a-gold)}
.a-card span{display:block;font-size:12px;color:var(--a-muted);margin-top:2px}
.a-block{margin-top:12px;border-radius:18px;padding:16px;background:var(--a-card);border:1px solid var(--a-line)}
.a-block h3{margin:0;font-size:14px;font-weight:600}
.a-lines{display:flex;flex-direction:column;gap:9px;margin-top:10px;font-size:14px;line-height:1.45;color:var(--a-sub)}
.a-line{display:flex;gap:10px}
.a-line i{font-style:normal;font-weight:700;flex-shrink:0;min-width:42px}
.a-line i.do{color:var(--a-good)} .a-line i.avoid{color:var(--a-bad)} .a-line i.note{color:var(--a-gold)}
.a-more{margin-top:12px;border-radius:18px;border:1px dashed var(--a-line);color:var(--a-sub);font-size:14px}
.a-more summary{padding:14px 16px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.a-more summary::-webkit-details-marker{display:none}
.a-more[open] summary svg{transform:rotate(180deg)}
.a-more summary svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.a-more .a-inner{padding:0 14px 14px}
.a-rows{display:flex;flex-direction:column}
.a-row{display:flex;justify-content:space-between;gap:12px;padding:11px 2px;border-top:1px solid var(--a-line);font-size:14px}
.a-row:first-child{border-top:0}
.a-row small{color:var(--a-muted);font-size:12px}
.a-row span:first-child{color:var(--a-muted)} .a-row span:last-child{text-align:right}
.a-note{margin:14px 2px 0;font-size:11.5px;color:var(--a-muted);line-height:1.5}
.a-btn{display:flex;align-items:center;justify-content:center;height:52px;width:100%;border-radius:26px;border:0;background:var(--a-gold);color:var(--a-on-gold);font-weight:600;font-size:16px;cursor:pointer}
.a-btn.ghost{background:none;border:1px solid var(--a-line);color:var(--a-text);font-weight:500}
.a-btn.small{height:46px;font-size:14.5px}
.a-btn:disabled{opacity:.6}
.a-empty{margin-top:24px;text-align:center;color:var(--a-sub);font-size:15px;line-height:1.6}

/* calendar */
.a-calhead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.a-calhead .a-month{font-family:'Playfair Display',serif;font-size:24px;font-weight:600}
.a-calnav{display:flex;gap:6px}
.a-calnav button{width:44px;height:44px;border-radius:22px;border:1px solid var(--a-line);background:var(--a-card);cursor:pointer;display:flex;align-items:center;justify-content:center}
.a-calnav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.a-dow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:16px;text-align:center;font-size:12px;color:var(--a-muted)}
.a-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-top:8px}
.a-day{height:56px;border-radius:14px;border:1.5px solid transparent;background:var(--a-card);color:var(--a-text);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:0}
.a-day.blank{background:none;cursor:default}
.a-day .n{font-size:15px;font-weight:600}
.a-day .t{font-size:9.5px;color:var(--a-muted)}
.a-day .dot{width:5px;height:5px;border-radius:50%;background:transparent}
.a-day.ek .dot{background:var(--a-gold)} .a-day.fm .dot{background:var(--a-warm)}
.a-day.today{border-color:var(--a-gold)}
.a-day.sel{background:var(--a-gold);color:var(--a-on-gold)}
.a-day.sel .t{color:var(--a-on-gold)} .a-day.sel.ek .dot,.a-day.sel.fm .dot{background:var(--a-on-gold)}
.a-legend{display:flex;gap:14px;margin-top:12px;font-size:11.5px;color:var(--a-muted);padding:0 4px;flex-wrap:wrap}
.a-legend span{display:flex;align-items:center;gap:5px}
.a-legend i{width:7px;height:7px;border-radius:50%;display:inline-block}
.a-daycard{margin-top:18px;border-radius:22px;padding:18px;background:var(--a-card);border:1px solid var(--a-line)}
.a-daycard .t{font-family:'Playfair Display',serif;font-size:24px;margin-top:6px}
.a-daycard .l{font-size:14px;color:var(--a-sub);margin-top:4px}
.a-daycard .a-pills{margin-top:14px}

/* profile */
.a-title{font-family:'Playfair Display',serif;font-size:24px;font-weight:600}
.a-acct{display:flex;align-items:center;gap:14px;margin-top:16px}
.a-avatar{width:56px;height:56px;border-radius:28px;background:var(--a-hero);border:1px solid var(--a-line);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:24px;color:var(--a-gold);flex-shrink:0}
.a-setrows{margin-top:10px;border-radius:20px;background:var(--a-card);border:1px solid var(--a-line)}
.a-setrow{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px;font-size:15px;background:none;border:0;border-top:1px solid var(--a-line);text-align:left;cursor:pointer}
.a-setrow:first-child{border-top:0}
.a-setrow span:last-child{color:var(--a-sub);text-align:right}
.a-seg{display:flex;gap:6px}
.a-seg button{padding:8px 14px;border-radius:16px;border:1px solid var(--a-line);background:none;font-size:13.5px;cursor:pointer;color:var(--a-sub)}
.a-seg button.on{background:var(--a-gold);color:var(--a-on-gold);border-color:var(--a-gold);font-weight:600}
#page-profiles{margin-top:6px}

/* ask locked */
.a-locked{margin:auto;max-width:340px;text-align:center;padding:32px 20px;display:none}
.a-locked p{font-size:14px;line-height:1.6;color:var(--a-sub);margin:0 0 20px}
#ask-frame{flex:1;width:100%;border:0;display:none;background:var(--a-bg)}

/* first-run setup */
.a-setup{position:fixed;inset:0;z-index:700;background:var(--a-bg);display:none;flex-direction:column;padding:max(28px,env(safe-area-inset-top)) 28px max(28px,env(safe-area-inset-bottom));overflow-y:auto}
.a-setup.show{display:flex}
.a-steps{display:flex;gap:8px}
.a-steps i{flex:1;height:4px;border-radius:2px;background:var(--a-chip)} .a-steps i.on{background:var(--a-gold)}
.a-step-n{margin-top:14px;font-size:13px;color:var(--a-muted);letter-spacing:.08em;text-transform:uppercase}
.a-setup h1{font-family:'Playfair Display',serif;font-size:30px;line-height:1.25;font-weight:600;margin:22px 0 0}
.a-setup p{margin:14px 0 0;font-size:16px;line-height:1.6;color:var(--a-sub)}
.a-bigicon{margin-top:56px;width:88px;height:88px;border-radius:50%;background:var(--a-card);border:1px solid var(--a-line);display:flex;align-items:center;justify-content:center}
.a-bigicon svg{width:40px;height:40px;fill:none;stroke:var(--a-gold);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.a-grow{flex:1;min-height:24px}
.a-err{margin-top:12px;font-size:14px;color:var(--a-bad);min-height:20px}
.a-search{width:100%;height:50px;border-radius:14px;border:1px solid var(--a-line);background:var(--a-card);color:var(--a-text);padding:0 16px;font:16px Inter,sans-serif;margin-top:18px}
.a-results{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.a-res{text-align:left;padding:14px 16px;border-radius:14px;border:1px solid var(--a-line);background:var(--a-card);font-size:15px;cursor:pointer}
.a-res small{display:block;color:var(--a-muted);font-size:12px;margin-top:2px}

/* theme.css adds a text label to every [data-theme-toggle]; ours are icon buttons whose glyph is set in JS */
.a-icon-btn[data-theme-toggle]::before,html[data-theme="light"] .a-icon-btn[data-theme-toggle]::before,
.theme-fab[data-theme-toggle]::before,html[data-theme="light"] .theme-fab[data-theme-toggle]::before{content:none}
#page-profiles .pf-theme{display:none}
#page-profiles .pf-title{background:none;padding-left:0;padding-right:0;margin-top:18px}
