/* A web layout on wide screens; the mobile app navigation stays below 1100px. */
.seo-guide{max-width:1120px;margin:28px auto 20px;border-top:1px solid var(--line);padding-top:18px;color:#645f53;font-size:13px}.seo-guide summary{cursor:pointer;font-weight:600;color:#4c6655;padding:7px 0}.seo-guide h1,.seo-guide h2{font:500 23px/1.5 AnVanSerif,serif;letter-spacing:0}.seo-guide p{line-height:1.85}.seo-links{display:flex;flex-wrap:wrap;gap:10px 20px;margin:15px 0}.seo-links a{color:#8c4b37;text-underline-offset:3px}.seo-guide [hidden]{display:none!important}
@media(min-width:1100px){
 .app-shell body>header{position:sticky;top:0;z-index:65;max-width:none;height:104px;padding:23px 40px;background:#f6f1e7f2;backdrop-filter:blur(16px);border-bottom:1px solid #d6cbb8}
 .app-shell .brandline{display:none}.app-shell .brand{font-size:21px;letter-spacing:2px}
 .app-shell .app-nav{top:22px;bottom:auto;left:50%;width:600px;border-radius:18px;padding:5px;background:#ebe5d9dc;box-shadow:inset 0 1px 2px #fff9,0 4px 15px #4b422a0a;z-index:70}
 .app-shell .app-nav a{flex-direction:row;gap:9px;min-height:48px;padding:9px 10px;font-size:13px;border-radius:13px}.app-shell .app-nav a svg{width:22px;height:22px;flex-basis:22px}.app-shell .app-nav-indicator{border-radius:13px;top:5px;bottom:5px;left:5px;width:calc((100% - 10px)/5)}
 .app-shell main{max-width:1440px;width:100%;padding:28px 48px 45px;margin:auto}.app-shell .app-screen{max-width:none;margin:0 auto;padding:0}.app-shell .app-screen>section{max-width:none}
 .app-shell #view-today:not([hidden]){display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:24px;align-items:stretch}
 #view-today>.home-portal{grid-column:1;margin:0;min-height:335px;padding:30px 30px 88px}.home-portal .home-portal-title h1{font-size:40px;line-height:1.3}.home-portal-copy{max-width:85%}.home-portal .home-date{font-size:13px;margin-top:20px}.home-portal-facts{margin-top:19px}.home-portal-facts b{font-size:10px}.home-portal-facts strong{font-size:14px}.home-portal .home-weather{left:25px;right:25px;bottom:18px;font-size:12px}
 #view-today>.home-omen{grid-column:2;margin:0;padding:30px;grid-template-columns:minmax(0,1fr) 150px;min-height:335px}.home-omen-copy h2{font-size:34px;line-height:1.35}.home-omen-copy>p{font-size:14px;line-height:1.7}.home-casting-art{width:145px;height:170px}#home-omen #start{width:100%;min-height:52px;font-size:15px}
 #view-today>.fortune-tabs,#view-today>[role=tabpanel]{grid-column:1/-1;width:100%;max-width:none;margin:0}.fortune-tabs{gap:16px!important}.fortune-tabs button{min-height:78px}.fortune-tab-text strong{font-size:17px}
 .natal-section,.pick-section,.love-section,.tarot-section,.num-section,.stars-section,.relax-section{width:100%;max-width:none;margin:0 auto 24px}
 .app-shell :is(.tarot-header,.num-heading,.stars-top,.relax-heading,.pick-heading,.love-heading,.natal-heading){min-height:180px;padding:30px 38px;margin-bottom:24px}.app-shell :is(.tarot-header,.num-heading,.stars-top,.relax-heading,.pick-heading,.love-heading) h2{font-size:43px;line-height:1.3}
 #result{max-width:1150px;margin:25px auto}.reading-life-grid{gap:20px}.natal-diagram{max-width:1120px;margin:auto}.natal-form{max-width:100%;padding:28px}.natal-overview-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .stars-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tarot-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.relax-tracks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px}
 .app-shell .audio-mini{bottom:18px;max-width:520px;left:auto;right:25px;transform:none}.app-shell footer{padding-bottom:25px}.app-shell #back-to-top{bottom:28px}
}
@media(min-width:1600px){.app-shell main{padding-left:40px;padding-right:40px}.app-shell .app-nav{width:680px}}
/* Real heading semantics on direct SEO pages. */
.app-shell :is(.tarot-header,.num-heading,.stars-top,.relax-heading) h1{font:500 38px/1.3 AnVanSerif,'Be Vietnam Pro',serif;color:inherit;letter-spacing:-.6px;margin:8px 0 7px}
@media(max-width:700px){.app-shell :is(.tarot-header,.num-heading,.stars-top,.relax-heading) h1{font-size:28px;line-height:1.3;margin:4px 0}}
@media(min-width:1100px){.app-shell :is(.tarot-header,.num-heading,.stars-top,.relax-heading) h1{font-size:43px}}
@media(min-width:1100px){.fortune-tabs,.natal-section,.pick-section,.love-section,#result,#calendar-section{scroll-margin-top:125px}}
/* A useful welcome before a numerology profile exists. */
.num-empty{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:18px 30px;padding:28px;border:1px solid #d7c4a5;border-radius:20px;background:linear-gradient(120deg,#fffaf0,#f0e8d7);box-shadow:0 8px 25px #70542d0a}
.num-empty[hidden]{display:none!important}.num-empty-copy{align-self:center;min-width:0}.num-empty-copy h3{font:500 27px/1.4 AnVanSerif,serif;color:#355747;margin:8px 0 10px}.num-empty-copy>p{font-size:14px;line-height:1.7;margin:0 0 18px;max-width:540px;color:#756955}.num-empty-copy .eyebrow{font-size:9px;color:#9b5b40}
.num-empty #num-add-profile{background:#a94f39;border-color:#a94f39;color:#fff9ef;font-size:14px;padding:12px 19px;border-radius:24px;box-shadow:0 4px 12px #9f4d3420}.num-empty #num-add-profile:hover{background:#8f402f}
.num-empty-art{width:175px;height:175px;align-self:center;justify-self:center;color:#ac8750;opacity:.8}.num-empty-art text{font-family:AnVanSerif,serif;fill:#8b5a3e;font-size:38px}
.num-empty-topics{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding-top:18px;border-top:1px solid #d9ccb4}.num-empty-topics>div{padding:14px 16px;border-radius:12px;background:#fffcf3bb;border:1px solid #dfd2bb}.num-empty-topics svg{width:22px;height:22px;color:#a96945;margin-bottom:5px}.num-empty-topics strong{display:block;font-size:14px;font-weight:600;color:#4b5a49}.num-empty-topics p{font-size:12px;line-height:1.6;margin:5px 0 0;color:#81735e}
@media(max-width:700px){.num-empty{grid-template-columns:1fr;padding:21px 18px;gap:18px}.num-empty-copy h3{font-size:23px}.num-empty-copy>p{font-size:13px;margin-bottom:14px}.num-empty-art{display:none}.num-empty-topics{gap:8px;padding-top:14px}.num-empty-topics>div{padding:12px 9px}.num-empty-topics strong{font-size:12px}.num-empty-topics p{font-size:11px;line-height:1.5}}
/* Three related features share An Vận's warm terracotta palette. */
.fortune-tabs :is(#fortune-tab-pick,#fortune-tab-love,#fortune-tab-natal){background:linear-gradient(125deg,#b96b4e,#a4513d);border-color:#a65a40;color:#fff7e8;box-shadow:0 6px 15px #8e483a1c,inset 0 1px 0 #fff4d733;transition:background .2s,box-shadow .2s,transform .2s}
.fortune-tabs :is(#fortune-tab-pick,#fortune-tab-love,#fortune-tab-natal) svg{color:#f9dfb1}.fortune-tabs :is(#fortune-tab-pick,#fortune-tab-love,#fortune-tab-natal) .fortune-tab-text small{color:#f5e5cf}
.fortune-tabs :is(#fortune-tab-pick,#fortune-tab-love,#fortune-tab-natal)[aria-selected=true]{background:linear-gradient(125deg,#91442f,#783628);border-color:#743729;color:#fff8e9;box-shadow:0 7px 18px #7d3e2a2b,inset 0 0 0 1px #f0d2a270}
@media(hover:hover){.fortune-tabs :is(#fortune-tab-pick,#fortune-tab-love,#fortune-tab-natal):hover{transform:translateY(-2px);box-shadow:0 9px 20px #8e483a30}}
/* Standalone navigation pills on PC only. Mobile glass navigation is untouched. */
@media(min-width:1100px){
 .app-shell .app-nav{gap:10px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
 .app-shell .app-nav::before,.app-shell .app-nav-indicator{display:none}
 .app-shell .app-nav a{position:relative;min-height:53px;gap:8px;padding:10px 11px;border:1px solid #d7c4a6;border-radius:28px;background:linear-gradient(135deg,#fffaf0,#f0e5d2);color:#76583f;box-shadow:0 3px 9px #7357330c;transition:transform .22s,box-shadow .22s,background .22s,color .22s,border-color .22s}
 .app-shell .app-nav a svg{transition:transform .25s;color:#a86445}
 .app-shell .app-nav a[aria-current=page]{background:linear-gradient(125deg,#42624d,#2e4d3d);color:#fff5de;border-color:#34523e;box-shadow:0 5px 13px #29493624}
 .app-shell .app-nav a[aria-current=page] svg{color:#e5c58b}
 .app-shell .app-nav a:hover{transform:translateY(-3px);background:linear-gradient(135deg,#f7e9d4,#e8c9a5);border-color:#ba936a;box-shadow:0 7px 15px #79562e22;color:#904c33}
 .app-shell .app-nav a:hover svg{transform:translateY(-1px) rotate(-7deg)}
 .app-shell .app-nav a[aria-current=page]:hover{background:linear-gradient(125deg,#4b6d54,#355541);color:#fff5de}
 .app-shell .app-nav a:active{transform:translateY(0)}
 .app-shell .app-nav.is-scrubbing a{transform:none}.app-shell .app-nav.is-scrubbing a[aria-current=page]{color:#fff5de}
}
@media(min-width:1200px){.app-shell .app-nav{width:650px}}
@media(prefers-reduced-motion:reduce){.num-empty *,.fortune-tabs :is(#fortune-tab-pick,#fortune-tab-love,#fortune-tab-natal),.app-shell .app-nav a,.app-shell .app-nav a svg{transition:none!important;animation:none!important}.app-shell .app-nav a:hover,.app-shell .app-nav a:hover svg{transform:none}}