.phone-shell > .page.aide-page.active { box-sizing: border-box; width: 100%; padding: 26px 18px calc(96px + env(safe-area-inset-bottom)) !important; background: var(--surface); }
.aide-intro { display: grid; gap: 10px; padding: 4px 2px 26px; }
.aide-intro span, .ziwei-heading > span, .ziwei-result-heading > span { color: #8a725c; font-size: 10px; font-weight: 750; letter-spacing: .18em; }
.aide-intro h2, .ziwei-heading h2, .ziwei-result-heading h2 { margin: 0; color: var(--ink); font-family: Georgia, "Noto Serif SC", serif; font-size: 29px; font-weight: 500; line-height: 1.24; }
.aide-intro p, .ziwei-heading p, .ziwei-result-heading p { max-width: 34em; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.aide-privacy-note { color: var(--muted); font-size: 10px; }
.aide-project-row { display: grid; grid-template-columns: 48px 1fr 18px; align-items: center; gap: 14px; width: 100%; min-height: 86px; padding: 14px; border: 1px solid var(--line); border-radius: 19px; color: var(--ink); background: var(--surface-strong); text-align: left; }
.aide-project-primary { grid-template-columns: 58px 1fr 24px; min-height: 118px; margin-top: 6px; padding: 18px; border-color: color-mix(in srgb, #b99778 44%, var(--line)); box-shadow: 0 12px 34px rgba(68, 51, 38, .08); transition: transform .18s ease, border-color .18s ease; }
.aide-project-primary:active { transform: scale(.985); }
.aide-project-primary:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 30%, transparent); outline-offset: 3px; }
.aide-project-row > span:nth-child(2) { display: grid; gap: 5px; }
.aide-project-row strong { font-size: 15px; }
.aide-project-row small { color: var(--muted); font-size: 11px; line-height: 1.45; }
.aide-project-row i { color: var(--muted); font-size: 22px; font-style: normal; }
.aide-project-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; color: #6e5344; background: #eadfd3; font-family: Georgia, serif; font-size: 20px; }
.aide-project-primary .aide-project-mark { width: 58px; height: 58px; border-radius: 18px; font-size: 24px; }
.aide-project-primary strong { font-family: Georgia, "Noto Serif SC", serif; font-size: 19px; font-weight: 600; }
.aide-project-primary small { max-width: 28em; font-size: 12px; line-height: 1.6; }
.aide-privacy-note { margin: 18px 8px 0; line-height: 1.65; text-align: center; }
.aide-screen { position: fixed; top: 0; bottom: 0; left: 50%; z-index: 180; width: min(100%, 520px); height: 100dvh; box-sizing: border-box; overflow-y: auto; overscroll-behavior: contain; padding: 0 18px calc(24px + env(safe-area-inset-bottom)); color: var(--ink); background: var(--surface); transform: translateX(-50%); }
.aide-screen-topbar { position: sticky; top: 0; z-index: 5; display: grid; grid-template-columns: 72px 1fr 72px; align-items: center; height: 58px; margin: 0 -18px; padding: env(safe-area-inset-top) 18px 0; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(14px); }
.aide-screen-topbar strong { text-align: center; font-size: 15px; }
.aide-screen-topbar button { min-height: 44px; padding: 0; border: 0; color: var(--accent); background: transparent; font: inherit; font-size: 12px; }
.aide-screen-topbar button:last-child { text-align: right; }
.aide-composer { position: sticky; bottom: 0; z-index: 4; display: grid; grid-template-columns: 1fr 46px; gap: 8px; padding: 9px 0 max(9px, env(safe-area-inset-bottom)); background: var(--surface); }
.aide-composer textarea { min-height: 46px; max-height: 118px; resize: none; padding: 12px 15px; border: 1px solid var(--line); border-radius: 20px; color: var(--ink); background: var(--surface-strong); font: inherit; font-size: 13px; outline: 0; }
.aide-composer button, .ziwei-submit { border: 0; color: #fff; background: #28231f; font: inherit; font-weight: 700; }
.aide-composer button { width: 46px; height: 46px; border-radius: 50%; font-size: 22px; }
.ziwei-form, .ziwei-result { display: grid; gap: 18px; padding: 30px 2px 24px; }
.ziwei-heading, .ziwei-result-heading { display: grid; gap: 9px; }
.ziwei-calendar-switch { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; border-radius: 13px; background: var(--surface-strong); }
.ziwei-calendar-switch button { min-height: 40px; border: 0; border-radius: 10px; color: var(--muted); background: transparent; font: inherit; }
.ziwei-calendar-switch button.active { color: var(--ink); background: var(--surface); box-shadow: 0 2px 10px rgba(40,35,31,.08); }
.ziwei-form > label:not(.ziwei-check) { display: grid; gap: 8px; }
.ziwei-form label > span, .ziwei-form legend { color: var(--muted); font-size: 11px; }
.ziwei-form input[type="date"], .ziwei-form select { width: 100%; min-width: 0; max-width: 100%; min-height: 49px; padding: 0 13px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: var(--surface-strong); font: inherit; }
.ziwei-form fieldset { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; border: 0; }
.ziwei-form legend { grid-column: 1/-1; margin-bottom: 8px; }
.ziwei-form fieldset label { position: relative; display: grid; place-items: center; min-height: 44px; border: 1px solid var(--line); border-radius: 13px; }
.ziwei-form fieldset input { position: absolute; opacity: 0; }
.ziwei-form fieldset label:has(input:checked) { border-color: #b99778; background: #eadfd3; }
.ziwei-check { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; padding: 13px; border-radius: 14px; background: var(--surface-strong); }
.ziwei-check input { width: 18px; height: 18px; accent-color: #8a725c; }
.ziwei-check span { line-height: 1.55; }
.ziwei-submit { min-height: 50px; border-radius: 15px; }
.ziwei-form > small, .ziwei-result > small { color: var(--muted); font-size: 10px; line-height: 1.55; text-align: center; }
.ziwei-form a { color: inherit; }
.ziwei-core { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.ziwei-core article { display: grid; gap: 4px; min-width: 0; padding: 10px 8px; border-radius: 13px; background: var(--surface-strong); }
.ziwei-core span { color: var(--muted); font-size: 9px; }.ziwei-core strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.ziwei-palaces { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; }
.ziwei-palaces > button { display: grid; grid-template-columns: 1fr auto; gap: 5px 8px; min-width: 0; min-height: 72px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: var(--surface); text-align: left; }
.ziwei-palaces > button.active { border-color: #b99778; background: color-mix(in srgb, #eadfd3 58%, var(--surface)); box-shadow: inset 0 0 0 1px color-mix(in srgb, #b99778 34%, transparent); }
.ziwei-palaces span { font-size: 12px; font-weight: 750; }.ziwei-palaces b { color: var(--muted); font-size: 10px; }
.ziwei-palaces small { grid-column: 1/-1; overflow: hidden; color: #8a725c; font-size: 10px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.ziwei-horoscope-panel { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 17px; background: var(--surface-strong); }
.ziwei-horoscope-panel label { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 11px; }
.ziwei-horoscope-panel input { min-height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: var(--surface); font: inherit; }
.ziwei-horoscope-summary { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.ziwei-horoscope-summary article { display: grid; gap: 2px; padding: 9px 10px; border-radius: 11px; background: var(--surface); }
.ziwei-horoscope-summary span, .ziwei-palace-detail section > span { color: var(--muted); font-size: 9px; }.ziwei-horoscope-summary strong { font-size: 13px; }.ziwei-horoscope-summary small { color: #8a725c; font-size: 10px; }
.ziwei-horoscope-summary .ziwei-mutagens { grid-column: 1/-1; }.ziwei-mutagens p { display: flex; flex-wrap: wrap; gap: 5px; margin: 4px 0 0; }.ziwei-mutagens b { padding: 3px 7px; border-radius: 999px; color: #76523f; background: #efe2d6; font-size: 9px; }
.ziwei-palace-detail { display: grid; gap: 12px; padding: 17px; border-radius: 17px; background: #28231f; color: #f8f1e8; }
.ziwei-palace-detail header { display: flex; justify-content: space-between; align-items: start; gap: 12px; }.ziwei-palace-detail header > span { display: grid; gap: 2px; }.ziwei-palace-detail header small { color: #c8b5a2; font-size: 9px; }.ziwei-palace-detail header strong { font-family: Georgia, "Noto Serif SC", serif; font-size: 19px; font-weight: 500; }.ziwei-palace-detail header > b { color: #c8b5a2; font-size: 10px; }
.ziwei-palace-detail section { display: grid; grid-template-columns: 38px 1fr; gap: 8px; align-items: start; }.ziwei-palace-detail section > span { padding-top: 4px; color: #c8b5a2; }.ziwei-palace-detail section p { display: flex; flex-wrap: wrap; gap: 5px; margin: 0; }.ziwei-palace-detail section i { padding: 3px 7px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; font-size: 10px; font-style: normal; }.ziwei-palace-detail section i.mutagen { color: #2b241f; background: #efd9bf; }.ziwei-palace-detail section em { color: #8f8175; font-style: normal; }
.ziwei-palace-detail footer { display: flex; flex-wrap: wrap; gap: 6px 12px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.1); color: #c8b5a2; font-size: 9px; }.ziwei-palace-detail aside { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 9px 10px; border-radius: 10px; background: rgba(255,255,255,.07); font-size: 9px; }.ziwei-palace-detail aside span { margin-right: auto; }.ziwei-palace-detail aside b { color: #efd9bf; }
.ziwei-reading { display: grid; gap: 12px; }.ziwei-reading > header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }.ziwei-reading > header span { font-size: 14px; font-weight: 750; }.ziwei-reading > header small { color: var(--muted); font-size: 9px; }
.ziwei-messages { display: grid; gap: 10px; }.ziwei-message { max-width: 94%; padding: 15px 16px; border-radius: 16px; background: var(--surface-strong); font-size: 12px; line-height: 1.72; }.ziwei-message.user { justify-self: end; border-bottom-right-radius: 5px; background: #eadfd3; }.ziwei-message.assistant { border-left: 2px solid #b99778; border-bottom-left-radius: 5px; }.ziwei-message.pending { color: var(--muted); animation: aide-pulse 1.2s ease-in-out infinite alternate; }.ziwei-message p { margin: 0 0 9px; }.ziwei-message p:last-child { margin-bottom: 0; }
.ziwei-question-chips { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }.ziwei-question-chips button { flex: 0 0 auto; min-height: 34px; padding: 0 11px; border: 1px solid var(--line); border-radius: 17px; color: var(--ink); background: var(--surface); font: inherit; font-size: 10px; }
.ziwei-result-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; }.ziwei-delete { min-height: 44px; padding: 0 15px; border: 1px solid color-mix(in srgb, #c44d5e 28%, var(--line)); border-radius: 14px; color: #c44d5e; background: transparent; font: inherit; }
.ziwei-history { display: grid; gap: 20px; padding: 30px 2px; }.ziwei-history-list, #ziwei-history-list { display: grid; gap: 8px; }.ziwei-history #ziwei-history-list > article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 14px; }.ziwei-history article > span { display: grid; gap: 3px; }.ziwei-history article strong { font-size: 12px; }.ziwei-history article small, .ziwei-history p { color: var(--muted); font-size: 10px; }.ziwei-history article button { min-height: 34px; padding: 0 12px; border: 0; border-radius: 17px; color: #fff; background: #28231f; }
.ziwei-restart { min-height: 44px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: transparent; font: inherit; }
.aide-busy { position: fixed; inset: 0; z-index: 8; display: grid; place-content: center; justify-items: center; gap: 11px; padding: 28px; background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(12px); text-align: center; }
.aide-busy span { width: 28px; height: 28px; border: 2px solid var(--line); border-top-color: #8a725c; border-radius: 50%; animation: aide-spin .8s linear infinite; }
.aide-busy strong { font-size: 14px; }.aide-busy small { color: var(--muted); font-size: 10px; }
body.aide-open { overflow: hidden !important; overscroll-behavior: none; }
body[data-theme="dark"] .aide-project-mark, body[data-theme="dark"] .ziwei-form fieldset label:has(input:checked) { color: #2b241f; }
@keyframes aide-spin { to { transform: rotate(360deg); } } @keyframes aide-pulse { from { opacity: .5; } to { opacity: 1; } }
@media (min-width: 760px) { .aide-page { max-width: 780px; margin: 0 auto; }.ziwei-palaces { grid-template-columns: repeat(3,1fr); } }
@media (prefers-reduced-motion: reduce) { .aide-project-primary { transition: none; }.aide-busy span, .ziwei-message.pending { animation-duration: 2s; } }