:root {
    --ink: #f1f7ff;
    --muted: #9aa7b7;
    --muted-2: #6f7b8a;
    --line: rgba(255,255,255,.105);
    --line-strong: rgba(72,225,255,.34);
    --surface: rgba(14,18,25,.82);
    --surface-strong: rgba(20,26,35,.94);
    --surface-soft: rgba(255,255,255,.055);
    --bg: #040609;
    --graphite: #090d12;
    --panel: #101721;
    --aqua: #22ddff;
    --aqua-soft: #8defff;
    --pink: #ff4f92;
    --violet: #a45cff;
    --lime: #b5ff12;
    --green: #32e59c;
    --orange: #ff8b3d;
    --red: #ff5d6c;
    --shadow: 0 28px 90px rgba(0,0,0,.48);
    --glow: 0 0 48px rgba(34,221,255,.13);
    --radius: 28px;
    --container: min(1180px, calc(100vw - 36px));
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
    color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    background:
        radial-gradient(circle at 18% -8%, rgba(34,221,255,.12), transparent 34rem),
        radial-gradient(circle at 86% 10%, rgba(255,79,146,.08), transparent 30rem),
        linear-gradient(180deg, #030507 0%, #070a0e 45%, #030507 100%);
    overflow-x: hidden;
}
body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .26;
    background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(to bottom, black, transparent 88%);
}
.ambient { position: fixed; width: 36rem; height: 36rem; border-radius: 50%; filter: blur(90px); opacity: .10; pointer-events: none; z-index: -1; }
.ambient-a { top: -18rem; left: -10rem; background: var(--aqua); }
.ambient-b { top: 18rem; right: -22rem; background: var(--pink); }

a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
main, .site-header, .site-footer { width: var(--container); margin-inline: auto; }
main { position: relative; z-index: 1; }

.site-header {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    position: sticky;
    top: 10px;
    z-index: 50;
    margin-top: 10px;
    padding: 10px 12px;
}
.glass-nav {
    background: rgba(8,12,17,.78);
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 22px;
    box-shadow: 0 16px 50px rgba(0,0,0,.35);
    backdrop-filter: blur(24px) saturate(145%);
    -webkit-backdrop-filter: blur(24px) saturate(145%);
}
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; min-width: max-content; }
.brand-mark {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-weight: 950;
    color: #001318;
    background: linear-gradient(145deg, #d8fbff, var(--aqua) 45%, #4db6ff 73%, var(--violet));
    box-shadow: 0 0 0 1px rgba(255,255,255,.32) inset, 0 12px 34px rgba(34,221,255,.22);
}
.brand-copy { display: flex; align-items: baseline; gap: 5px; }
.brand-copy strong { font-size: 18px; letter-spacing: -.04em; }
.brand-copy small { font-size: 8px; font-weight: 900; letter-spacing: .14em; color: var(--aqua); text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: 2px; }
.site-nav > a, .logout-form button, .nav-dropdown-trigger {
    border: 0;
    background: transparent;
    text-decoration: none;
    color: #b5bfca;
    padding: 10px 11px;
    border-radius: 999px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 750;
    transition: .18s ease;
}
.site-nav > a:hover, .site-nav > a.active, .logout-form button:hover, .nav-dropdown-trigger:hover, .nav-dropdown.open .nav-dropdown-trigger {
    color: #f7fdff;
    background: rgba(34,221,255,.085);
    box-shadow: 0 0 0 1px rgba(34,221,255,.08) inset;
}
.logout-form { margin: 0; }
.nav-toggle {
    display: none;
    border: 1px solid var(--line);
    background: var(--surface-soft);
    color: var(--ink);
    border-radius: 999px;
    padding: 9px 14px;
}
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 5px; }
.nav-dropdown-trigger span { color: var(--aqua); }
.nav-dropdown-menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%) translateY(-5px);
    width: 340px;
    padding: 9px;
    border-radius: 22px;
    border: 1px solid var(--line);
    background: rgba(6,10,15,.97);
    backdrop-filter: blur(26px);
    box-shadow: var(--shadow);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: .16s ease;
}
.nav-dropdown.open .nav-dropdown-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.nav-dropdown-menu a { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 12px; border-radius: 15px; text-decoration: none; }
.nav-dropdown-menu a:hover { background: rgba(255,255,255,.055); }
.nav-dropdown-menu span { display: grid; gap: 2px; }
.nav-dropdown-menu b { font-size: 14px; }
.nav-dropdown-menu small { font-size: 11px; color: var(--muted); }
.nav-dropdown-menu em { font-size: 9px; font-style: normal; text-transform: uppercase; letter-spacing: .09em; color: var(--aqua); padding: 5px 7px; border-radius: 999px; background: rgba(34,221,255,.08); white-space: nowrap; }

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(34,221,255,.66);
    background: linear-gradient(135deg, #0fc7e4, #45e6ff 45%, #63c7ff);
    color: #001116;
    text-decoration: none;
    font-weight: 900;
    border-radius: 999px;
    padding: 13px 20px;
    cursor: pointer;
    box-shadow: 0 12px 32px rgba(34,221,255,.17), inset 0 1px rgba(255,255,255,.5);
    transition: .18s transform, .18s box-shadow, .18s opacity;
}
.button:hover { transform: translateY(-2px); box-shadow: 0 16px 42px rgba(34,221,255,.25), inset 0 1px rgba(255,255,255,.5); }
.button.secondary { color: #dffbff; background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.14); box-shadow: none; }
.button.light { background: #f8feff; border-color: #fff; color: #071016; }
.button.ghost { background: transparent; color: #e9faff; border-color: rgba(255,255,255,.24); box-shadow: none; }
.button.small { padding: 9px 14px; font-size: 13px; }
.button.full { width: 100%; }
.button.disabled { opacity: .48; cursor: default; pointer-events: none; }

.glass-card, .feature-card, .pricing-card, .profile-card, .settings-card, .settings-aside, .faq-item, .current-membership, .security-note {
    background: linear-gradient(150deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    backdrop-filter: blur(22px) saturate(120%);
    -webkit-backdrop-filter: blur(22px) saturate(120%);
}
.eyebrow { margin: 0 0 10px; color: var(--aqua); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .15em; }
h1, h2, h3, p { text-wrap: pretty; }
h1, h2, h3 { color: #f4fbff; }
h1 { margin: 0; font-size: clamp(50px, 7vw, 94px); line-height: .98; letter-spacing: -.062em; }
h2 { letter-spacing: -.045em; }
p { color: var(--muted); }
.notice { margin: 22px auto 0; max-width: 880px; padding: 13px 18px; border-radius: 16px; border: 1px solid var(--line); background: rgba(255,255,255,.055); color: #dce7ef; }
.notice.success { border-color: rgba(50,229,156,.35); background: rgba(50,229,156,.08); }
.notice.error { border-color: rgba(255,93,108,.4); background: rgba(255,93,108,.09); }
.notice.info { border-color: rgba(34,221,255,.32); background: rgba(34,221,255,.07); }

.hero {
    min-height: 720px;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    align-items: center;
    gap: clamp(35px, 6vw, 88px);
    padding: 58px 0 80px;
}
.hero-copy { position: relative; z-index: 2; }
.hero h1 span { color: var(--aqua); text-shadow: 0 0 44px rgba(34,221,255,.2); }
.lede { max-width: 690px; font-size: clamp(17px, 2vw, 21px); line-height: 1.64; color: #aeb9c6; margin: 25px 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.trust-row span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; font-size: 11px; color: #8996a5; background: rgba(255,255,255,.025); }
.device-stage { min-height: 650px; display: grid; place-items: center; position: relative; }
.orb { position: absolute; border-radius: 50%; filter: blur(50px); }
.orb-one { width: 280px; height: 280px; background: rgba(34,221,255,.15); top: 55px; right: 20px; }
.orb-two { width: 260px; height: 260px; background: rgba(255,79,146,.10); bottom: 45px; left: 15px; }
.phone-shell { width: min(345px, 90vw); padding: 9px; border-radius: 48px; background: linear-gradient(145deg, #2a3440, #050608 30%, #1d242d 73%, #050608); box-shadow: 0 45px 100px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.13); transform: rotate(2.2deg); position: relative; }
.phone-top { width: 105px; height: 25px; border-radius: 999px; background: #010203; position: absolute; top: 16px; left: 50%; transform: translateX(-50%); z-index: 3; }
.phone-screen { min-height: 620px; border-radius: 40px; overflow: hidden; padding: 24px 18px 16px; background: radial-gradient(circle at 70% 5%, rgba(34,221,255,.16), transparent 14rem), radial-gradient(circle at 20% 70%, rgba(255,79,146,.08), transparent 14rem), #05080c; border: 1px solid rgba(255,255,255,.06); }
.mock-status { display: flex; justify-content: space-between; font-size: 9px; font-weight: 800; padding: 0 6px 36px; color: #dce8ef; }
.mock-greeting small { color: var(--aqua); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; }
.mock-greeting strong { display: block; font-size: 25px; line-height: 1.08; letter-spacing: -.05em; margin-top: 7px; }
.mock-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; padding: 4px; margin: 22px 0 14px; border-radius: 999px; background: rgba(255,255,255,.055); }
.mock-toggle span { text-align: center; padding: 8px; border-radius: 999px; font-size: 10px; font-weight: 850; color: #8895a4; }
.mock-toggle .active { color: #001318; background: var(--aqua); box-shadow: 0 0 22px rgba(34,221,255,.22); }
.mock-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.mock-grid div { min-height: 105px; border-radius: 20px; padding: 14px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid rgba(255,255,255,.09); background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.02)); }
.mock-grid b { color: var(--aqua); font-size: 22px; }
.mock-grid span { font-size: 12px; font-weight: 850; }
.mock-grid div:nth-child(2) b { color: var(--pink); }
.mock-grid div:nth-child(3) b { color: var(--green); }
.mock-grid div:nth-child(4) b { color: var(--orange); }
.mock-insight { display: grid; gap: 4px; margin-top: 10px; padding: 14px; border: 1px solid rgba(34,221,255,.15); border-radius: 18px; background: rgba(34,221,255,.055); }
.mock-insight span, .mock-insight small { font-size: 8px; color: var(--muted); }
.mock-insight strong { font-size: 11px; }
.mock-tabbar { display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 18px; padding: 12px 8px; border-radius: 20px; border: 1px solid rgba(255,255,255,.07); background: rgba(2,4,7,.72); text-align: center; color: #8b98a6; }
.mock-tabbar span:first-child { color: var(--aqua); }
.signal-strip { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: rgba(255,255,255,.025); margin-bottom: 95px; }
.signal-strip span { padding: 15px; text-align: center; font-size: 11px; font-weight: 800; color: #8e9aa8; border-right: 1px solid var(--line); }
.signal-strip span:last-child { border-right: 0; }

.section { padding: 70px 0 110px; }
.section-heading { max-width: 780px; margin-bottom: 35px; }
.section-heading.compact { max-width: 630px; }
.section-heading.centered { margin-inline: auto; text-align: center; }
.section-heading h2, .showcase-copy h2, .mode-section h2, .trust-section h2 { font-size: clamp(39px, 5vw, 63px); margin: 0; }
.section-heading p:not(.eyebrow), .showcase-copy > p:not(.eyebrow), .trust-section > div > p:not(.eyebrow) { font-size: 17px; line-height: 1.7; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.feature-card { padding: 24px; min-height: 235px; border-radius: 24px; transition: .2s ease; }
.feature-card:hover { transform: translateY(-4px); border-color: rgba(34,221,255,.22); box-shadow: var(--shadow), var(--glow); }
.feature-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: rgba(34,221,255,.09); color: var(--aqua); font-size: 20px; border: 1px solid rgba(34,221,255,.12); }
.feature-card h3 { font-size: 19px; margin: 42px 0 8px; }
.feature-card p { line-height: 1.55; font-size: 14px; margin: 0; }

.mode-section { padding: 70px 0 115px; }
.mode-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mode-panels article { min-height: 430px; border-radius: 32px; padding: 34px; display: flex; flex-direction: column; justify-content: flex-end; border: 1px solid var(--line); overflow: hidden; position: relative; }
.personal-panel { background: radial-gradient(circle at 75% 15%, rgba(34,221,255,.24), transparent 18rem), linear-gradient(145deg, #071218, #091b21); }
.professional-panel { background: radial-gradient(circle at 80% 10%, rgba(164,92,255,.24), transparent 19rem), linear-gradient(145deg, #0a0912, #171025); }
.mode-panels article > span { color: var(--aqua); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .14em; }
.professional-panel > span { color: #c4a6ff; }
.mode-panels h3 { font-size: 38px; margin: 12px 0; max-width: 520px; }
.mode-panels p { line-height: 1.6; max-width: 560px; }
.mini-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 20px; }
.mini-grid b { padding: 10px 7px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.07); font-size: 10px; text-align: center; }

.showcase-section { display: grid; grid-template-columns: .9fr 1.1fr; gap: 65px; align-items: center; padding: 75px 0 125px; }
.clean-list { list-style: none; padding: 0; display: grid; gap: 11px; color: #b4bfca; }
.clean-list li::before { content: "✓"; color: var(--aqua); font-weight: 900; margin-right: 10px; }
.showcase-media { display: grid; grid-template-columns: 1.2fr .8fr; gap: 12px; }
.media-stack { display: grid; gap: 12px; }
.media-card { min-height: 220px; border: 1px solid var(--line); border-radius: 28px; padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; background: radial-gradient(circle at 80% 12%, rgba(34,221,255,.14), transparent 14rem), linear-gradient(145deg, #101722, #080c12); box-shadow: var(--shadow); }
.media-card.media-large { min-height: 470px; background: radial-gradient(circle at 60% 10%, rgba(255,79,146,.10), transparent 16rem), radial-gradient(circle at 10% 80%, rgba(34,221,255,.15), transparent 18rem), #0b1118; }
.media-card.dark { background: radial-gradient(circle at 80% 10%, rgba(164,92,255,.16), transparent 12rem), #090811; }
.media-card span { color: var(--aqua); font-size: 11px; font-weight: 900; }
.media-card strong { font-size: 25px; margin-top: 7px; }
.media-card small { color: var(--muted); margin-top: 5px; }

.membership-section { padding: 80px 0 80px; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 35px 0 65px; }
.pricing-card { border-radius: 28px; padding: 28px; min-height: 560px; display: flex; flex-direction: column; position: relative; }
.pricing-card.highlighted { border-color: rgba(34,221,255,.6); box-shadow: var(--shadow), 0 0 55px rgba(34,221,255,.11); transform: translateY(-10px); }
.popular-pill { position: absolute; top: 17px; right: 17px; background: var(--aqua); color: #001317; padding: 7px 10px; border-radius: 999px; font-size: 9px; font-weight: 950; text-transform: uppercase; letter-spacing: .09em; }
.plan-kicker { color: var(--aqua); font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; }
.pricing-card h2 { font-size: 32px; margin: 5px 0 8px; }
.pricing-card p { line-height: 1.55; }
.dual-price { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 20px 0; }
.dual-price > div { padding: 13px; border-radius: 16px; background: rgba(255,255,255,.045); border: 1px solid var(--line); }
.dual-price span, .dual-price small { display: block; color: var(--muted); font-size: 9px; }
.dual-price strong { display: block; font-size: 27px; margin: 3px 0; color: #f5fcff; }
.pricing-card ul { list-style: none; padding: 0; margin: 0 0 25px; display: grid; gap: 9px; }
.pricing-card li { color: #b2beca; font-size: 13px; }
.pricing-card li::before { content: "✓"; color: var(--aqua); font-weight: 900; margin-right: 8px; }
.pricing-card > .button, .pricing-card form { margin-top: auto; }
.billing-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.billing-choice .button { padding-inline: 10px; }
.trust-section { margin: 30px 0 120px; padding: 45px; border-radius: 34px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; border: 1px solid var(--line); background: linear-gradient(135deg, rgba(34,221,255,.06), rgba(255,255,255,.025)); }
.trust-cards { display: grid; gap: 9px; }
.trust-cards article { display: flex; justify-content: space-between; align-items: center; padding: 15px 17px; border-radius: 16px; border: 1px solid var(--line); background: rgba(255,255,255,.035); }
.trust-cards b { color: var(--aqua); }
.trust-cards span { color: var(--muted); font-size: 12px; text-align: right; }
.cta-panel { margin: 0 0 115px; padding: 48px; border-radius: 35px; background: radial-gradient(circle at 80% 0%, rgba(34,221,255,.22), transparent 22rem), radial-gradient(circle at 15% 100%, rgba(255,79,146,.13), transparent 22rem), #0b121a; border: 1px solid rgba(34,221,255,.15); display: flex; justify-content: space-between; align-items: center; gap: 34px; box-shadow: var(--shadow); }
.cta-panel h2 { font-size: clamp(35px, 4.5vw, 58px); margin: 0; max-width: 720px; }
.cta-panel p:not(.eyebrow) { max-width: 720px; line-height: 1.6; }

.page-hero { padding: 85px 0 30px; max-width: 940px; }
.page-hero h1 { font-size: clamp(50px, 7vw, 82px); }
.page-hero p:not(.eyebrow) { font-size: 18px; line-height: 1.65; max-width: 790px; }
.page-hero.compact { padding-bottom: 15px; }
.page-hero.compact h1 { font-size: clamp(45px, 6vw, 70px); }

.auth-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(390px, 500px); gap: 40px; align-items: center; min-height: 720px; padding: 55px 0 100px; }
.auth-shell.single { grid-template-columns: minmax(320px, 560px); justify-content: center; }
.auth-visual { min-height: 590px; border-radius: 36px; padding: 48px; display: flex; flex-direction: column; justify-content: flex-end; position: relative; overflow: hidden; border: 1px solid rgba(34,221,255,.13); background: radial-gradient(circle at 80% 14%, rgba(34,221,255,.25), transparent 17rem), radial-gradient(circle at 0% 100%, rgba(164,92,255,.15), transparent 18rem), #081017; box-shadow: var(--shadow); }
.auth-visual.signup { background: radial-gradient(circle at 20% 18%, rgba(34,221,255,.25), transparent 16rem), radial-gradient(circle at 85% 80%, rgba(255,79,146,.13), transparent 17rem), #071016; }
.auth-orbit { position: absolute; width: 250px; height: 250px; top: 40px; right: 45px; border-radius: 50%; border: 1px solid rgba(34,221,255,.16); box-shadow: 0 0 0 35px rgba(34,221,255,.025), 0 0 0 70px rgba(255,255,255,.012), inset 0 0 45px rgba(34,221,255,.08); }
.auth-orbit::after { content: "H"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 82px; font-weight: 950; color: rgba(209,249,255,.87); text-shadow: 0 0 45px rgba(34,221,255,.35); }
.auth-visual h1 { font-size: clamp(46px, 5.5vw, 72px); max-width: 670px; position: relative; }
.auth-visual p { max-width: 620px; line-height: 1.6; position: relative; }
.auth-benefits { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 17px; position: relative; }
.auth-benefits span { padding: 7px 9px; border-radius: 999px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.04); color: #aab8c5; font-size: 10px; }
.auth-card { padding: 34px; border-radius: 30px; }
.auth-card h1 { font-size: 46px; }
.auth-card h2 { font-size: 34px; margin: 2px 0 8px; }
.auth-card > p:not(.eyebrow) { line-height: 1.5; }
.stacked-form { display: grid; gap: 15px; margin-top: 22px; }
.stacked-form label { display: grid; gap: 7px; font-size: 12px; font-weight: 850; color: #c7d0d9; }
.stacked-form input, .stacked-form select, .stacked-form textarea { width: 100%; border: 1px solid rgba(255,255,255,.11); border-radius: 14px; color: #f4faff; background: rgba(255,255,255,.045); padding: 12px 13px; outline: none; }
.stacked-form input:focus, .stacked-form select:focus, .stacked-form textarea:focus { border-color: rgba(34,221,255,.55); box-shadow: 0 0 0 4px rgba(34,221,255,.08); }
.stacked-form input::placeholder { color: #657383; }
.stacked-form small { color: var(--muted); font-weight: 500; }
.legal-consent { display: grid; gap: 8px; margin: 2px 0; }
.consent-row { display: grid !important; grid-template-columns: auto 1fr; align-items: start; gap: 9px !important; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); font-weight: 600 !important; line-height: 1.45; }
.consent-row input { width: 17px !important; height: 17px; margin-top: 2px; accent-color: var(--aqua); }
.consent-row a { color: var(--aqua); }
.form-links { display: flex; justify-content: space-between; gap: 15px; margin-top: 18px; font-size: 13px; }
.form-links a, .form-note a, .profile-card a, .settings-aside a { color: var(--aqua); text-decoration: none; font-weight: 800; }
.form-note { font-size: 13px; }

.current-membership { padding: 24px 26px; border-radius: 25px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 25px 0; }
.current-membership span { color: var(--muted); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .09em; }
.current-membership h2 { margin: 6px 0; font-size: 30px; }
.current-membership p { margin: 4px 0; }
.membership-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.warning-text { color: #ffb36c !important; }
.access-ready { color: var(--green) !important; font-weight: 850; }
.security-note { display: flex; gap: 20px; padding: 29px; margin-bottom: 40px; border-radius: 25px; }
.security-note > span { width: 50px; height: 50px; border-radius: 16px; display: grid; place-items: center; background: rgba(34,221,255,.08); font-size: 24px; color: var(--aqua); flex: none; }
.security-note h2 { margin: 0 0 8px; }
.security-note p { line-height: 1.6; margin: 0; }
.membership-faq { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 100px; }
.membership-faq article { padding: 22px; border-radius: 20px; border: 1px solid var(--line); background: rgba(255,255,255,.025); }
.membership-faq h3 { margin-top: 0; }
.membership-faq p { line-height: 1.55; font-size: 13px; }

.dashboard-hero { padding: 65px 0 25px; display: flex; justify-content: space-between; align-items: end; gap: 30px; }
.dashboard-hero h1 { font-size: clamp(48px, 6vw, 76px); }
.dashboard-hero p:last-child { font-size: 17px; }
.membership-chip { padding: 13px 17px; border-radius: 18px; min-width: 160px; }
.membership-chip span, .membership-chip small { display: block; }
.membership-chip span { font-weight: 900; color: var(--aqua); }
.membership-chip small { color: var(--muted); margin-top: 3px; }
.dashboard-toolbar { display: grid; grid-template-columns: repeat(5, 1fr); gap: 9px; padding: 20px 0 38px; }
.dashboard-toolbar a { text-decoration: none; border: 1px solid var(--line); border-radius: 17px; padding: 13px; display: flex; align-items: center; gap: 9px; font-weight: 800; background: rgba(255,255,255,.03); }
.dashboard-toolbar b { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; color: var(--aqua); background: rgba(34,221,255,.08); }
.mode-dashboard { padding: 18px 0 50px; }
.mode-toggle { display: inline-grid; grid-template-columns: 1fr 1fr; padding: 4px; background: rgba(255,255,255,.055); border: 1px solid var(--line); border-radius: 999px; margin-bottom: 20px; }
.mode-toggle button { border: 0; color: #9ba7b4; background: transparent; padding: 9px 25px; border-radius: 999px; font-weight: 850; cursor: pointer; }
.mode-toggle button.active { color: #001318; background: var(--aqua); box-shadow: 0 0 28px rgba(34,221,255,.16); }
.dashboard-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.dashboard-card { min-height: 300px; padding: 25px; border-radius: 27px; text-decoration: none; display: flex; flex-direction: column; transition: .2s ease; }
.dashboard-card:hover { transform: translateY(-4px); border-color: rgba(34,221,255,.25); }
.dashboard-card > span { font-size: 27px; color: var(--aqua); }
.dashboard-card h2 { margin-top: auto; font-size: 26px; }
.dashboard-card p { line-height: 1.5; }
.dashboard-card b { color: var(--aqua); }
.dark-card { background: radial-gradient(circle at 80% 10%, rgba(164,92,255,.14), transparent 15rem), linear-gradient(150deg, rgba(32,27,47,.9), rgba(7,7,13,.9)); }
.dark-card > span, .dark-card b { color: #be9dff; }
.hidden { display: none !important; }
.dashboard-bottom { display: grid; grid-template-columns: 1.45fr .75fr; gap: 14px; padding: 18px 0 95px; }
.dashboard-bottom article { padding: 28px; border-radius: 25px; }
.dashboard-bottom article.accent { border-color: rgba(50,229,156,.2); background: linear-gradient(140deg, rgba(50,229,156,.08), rgba(255,255,255,.025)); }
.dashboard-bottom h2 { font-size: 29px; }
.dashboard-bottom a { color: var(--aqua); text-decoration: none; font-weight: 850; }

.profile-layout { display: grid; grid-template-columns: 1.45fr .75fr .75fr; gap: 14px; padding: 30px 0 100px; }
.profile-expanded { grid-auto-flow: row dense; }
.profile-card { padding: 26px; border-radius: 25px; }
.hero-card { display: flex; align-items: center; gap: 18px; }
.avatar { width: 82px; height: 82px; border-radius: 27px; display: grid; place-items: center; flex: none; overflow: hidden; color: #001318; background: linear-gradient(145deg, #d2faff, var(--aqua), var(--violet)); font-weight: 950; font-size: 22px; text-transform: uppercase; }
.profile-type { color: var(--aqua) !important; font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .1em; }
.profile-card h2 { margin: 6px 0 8px; }
.profile-card p, .profile-card > span { color: var(--muted); }
.profile-wide { grid-column: span 2; }
.profile-bio { line-height: 1.6; }
.profile-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 18px; }
.profile-facts span { display: grid; gap: 3px; padding: 11px; border-radius: 13px; background: rgba(255,255,255,.035); color: #c2ccd5; font-size: 12px; }
.profile-facts b { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.status-dot { font-size: 11px; color: #9fb0bc !important; }
.status-dot::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--green); margin-right: 6px; box-shadow: 0 0 12px rgba(50,229,156,.55); }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; word-break: break-all; }

.settings-layout { display: grid; grid-template-columns: 1.2fr .75fr; gap: 15px; padding: 30px 0 100px; }
.settings-card, .settings-aside { padding: 28px; border-radius: 25px; }
.settings-aside h2 { margin-top: 0; }
.settings-aside h2:not(:first-child) { margin-top: 32px; }
.settings-aside p { line-height: 1.6; }
.checkbox-row { grid-template-columns: auto 1fr !important; align-items: center; }
.checkbox-row input { width: auto !important; accent-color: var(--aqua); }
.faq-list { display: grid; gap: 10px; padding: 30px 0 55px; }
.faq-item { padding: 0 22px; border-radius: 20px; }
.faq-item summary { cursor: pointer; padding: 20px 0; font-size: 17px; font-weight: 850; }
.faq-item p { line-height: 1.65; padding: 0 0 20px; margin: 0; }
.support-cta { margin-bottom: 95px; padding: 32px; border-radius: 28px; background: radial-gradient(circle at 85% 15%, rgba(34,221,255,.15), transparent 15rem), #0c121a; border: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.support-cta h2 { margin: 0; }

.placeholder-page { min-height: 620px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 70px 0; }
.placeholder-page h1 { font-size: clamp(48px, 7vw, 78px); }
.placeholder-page > p:not(.eyebrow) { max-width: 620px; font-size: 17px; line-height: 1.65; }
.placeholder-icon { width: 88px; height: 88px; border-radius: 29px; display: grid; place-items: center; font-size: 34px; color: var(--aqua); border: 1px solid rgba(34,221,255,.18); background: rgba(34,221,255,.07); box-shadow: var(--glow); }

.app-product-hero { min-height: 650px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 55px; align-items: center; padding: 65px 0 85px; }
.app-product-hero h1 { font-size: clamp(54px, 7vw, 88px); }
.app-product-hero p:not(.eyebrow) { font-size: 18px; line-height: 1.7; max-width: 760px; }
.app-icon-stage { min-height: 430px; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 34px; border: 1px solid var(--line); background: radial-gradient(circle at 50% 45%, rgba(34,221,255,.15), transparent 16rem), rgba(255,255,255,.025); box-shadow: var(--shadow); }
.app-icon { width: 160px; height: 160px; border-radius: 44px; display: grid; place-items: center; font-size: 77px; font-weight: 950; color: #001318; background: linear-gradient(145deg, #d8fbff, var(--aqua) 45%, #4db6ff 70%, var(--violet)); box-shadow: 0 32px 70px rgba(34,221,255,.22), inset 0 1px rgba(255,255,255,.65); }
.app-icon-stage > span { font-size: 25px; font-weight: 900; margin-top: 22px; }
.app-icon-stage > small { color: var(--muted); margin-top: 5px; }
.app-feature-bands { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 50px; }
.app-feature-bands article { padding: 28px; min-height: 250px; border-radius: 25px; border: 1px solid var(--line); background: rgba(255,255,255,.03); }
.app-feature-bands span { color: var(--aqua); font-size: 10px; font-weight: 900; }
.app-feature-bands h2 { margin: 50px 0 10px; font-size: 29px; }
.app-feature-bands p { line-height: 1.6; }
.availability-panel { padding: 31px; border-radius: 27px; display: flex; justify-content: space-between; align-items: center; gap: 25px; margin: 0 0 100px; }
.availability-panel h2 { margin: 0 0 5px; }

.legal-page { max-width: 940px; margin: 70px auto 110px; padding: clamp(28px, 5vw, 58px); border-radius: 32px; }
.legal-page h1 { font-size: clamp(50px, 7vw, 78px); margin-bottom: 10px; }
.legal-page h2 { margin: 40px 0 10px; font-size: 25px; }
.legal-page p { line-height: 1.78; font-size: 15px; color: #a8b5c0; }
.legal-meta { color: #758392 !important; font-size: 12px !important; }
.legal-callout, .privacy-hero-callout { margin: 30px 0; padding: 20px; border-radius: 18px; border: 1px solid rgba(34,221,255,.2); background: rgba(34,221,255,.06); }
.privacy-hero-callout { border-color: rgba(50,229,156,.24); background: rgba(50,229,156,.06); }
.legal-callout strong, .privacy-hero-callout strong { display: block; font-size: 18px; color: #ecfbff; }
.legal-callout p, .privacy-hero-callout p { margin-bottom: 0; }
.legal-page a { color: var(--aqua); }

.site-footer { display: flex; justify-content: space-between; align-items: flex-start; gap: 35px; padding: 40px 0 55px; border-top: 1px solid var(--line); }
.footer-brand-block { max-width: 570px; }
.site-footer p { font-size: 12px; line-height: 1.6; max-width: 530px; }
.privacy-promise { font-size: 10px; color: var(--green); font-weight: 800; }
.footer-links { display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-end; }
.footer-links a { color: #8996a4; text-decoration: none; font-size: 12px; }
.footer-links a:hover { color: var(--aqua); }

@media (max-width: 1050px) {
    .site-header { top: 6px; }
    .nav-toggle { display: block; }
    .site-nav {
        display: none;
        position: absolute;
        top: calc(100% + 8px);
        right: 0;
        width: min(330px, calc(100vw - 36px));
        flex-direction: column;
        align-items: stretch;
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: 22px;
        background: rgba(6,10,15,.98);
        box-shadow: var(--shadow);
        backdrop-filter: blur(24px);
    }
    .site-nav.open { display: flex; }
    .site-nav > a, .logout-form button, .nav-dropdown-trigger { width: 100%; text-align: left; justify-content: space-between; }
    .nav-dropdown-menu { position: static; width: 100%; transform: none; margin-top: 6px; box-shadow: none; background: rgba(255,255,255,.025); display: none; opacity: 1; visibility: visible; pointer-events: auto; }
    .nav-dropdown.open .nav-dropdown-menu { display: block; transform: none; }
    .hero, .showcase-section, .auth-shell, .app-product-hero { grid-template-columns: 1fr; }
    .device-stage { min-height: 620px; }
    .feature-grid, .dashboard-grid { grid-template-columns: repeat(2, 1fr); }
    .profile-layout { grid-template-columns: 1fr 1fr; }
    .profile-layout .hero-card { grid-column: 1 / -1; }
    .profile-wide { grid-column: 1 / -1; }
    .pricing-grid { grid-template-columns: 1fr; max-width: 720px; margin-inline: auto; }
    .pricing-card.highlighted { transform: none; }
    .dashboard-toolbar { grid-template-columns: repeat(3, 1fr); }
    .trust-section { grid-template-columns: 1fr; }
    .membership-faq { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    :root { --container: min(100% - 22px, 1180px); }
    .site-header { min-height: 66px; padding: 8px 9px; border-radius: 19px; }
    .brand-mark { width: 36px; height: 36px; border-radius: 12px; }
    .brand-copy strong { font-size: 16px; }
    .hero { padding-top: 42px; min-height: auto; gap: 20px; }
    .hero h1, .page-hero h1, .auth-visual h1, .dashboard-hero h1, .app-product-hero h1 { font-size: clamp(43px, 13vw, 58px); }
    .lede { font-size: 16px; }
    .hero-actions { display: grid; grid-template-columns: 1fr; }
    .hero-actions .button { width: 100%; }
    .device-stage { min-height: 590px; }
    .phone-shell { width: 285px; transform: none; }
    .phone-screen { min-height: 540px; }
    .signal-strip { grid-template-columns: 1fr 1fr; }
    .signal-strip span { border-bottom: 1px solid var(--line); }
    .feature-grid, .mode-panels, .dashboard-grid, .dashboard-bottom, .settings-layout, .profile-layout, .app-feature-bands, .trust-section { grid-template-columns: 1fr; }
    .feature-card { min-height: 210px; }
    .mode-panels article { min-height: 360px; padding: 27px; }
    .mode-panels h3 { font-size: 31px; }
    .mini-grid { grid-template-columns: 1fr 1fr; }
    .showcase-media { grid-template-columns: 1fr; }
    .media-card.media-large { min-height: 360px; }
    .cta-panel, .site-footer, .current-membership, .dashboard-hero, .support-cta, .availability-panel { align-items: flex-start; flex-direction: column; }
    .cta-panel { padding: 30px; }
    .dashboard-toolbar { grid-template-columns: 1fr 1fr; }
    .auth-shell { padding-top: 35px; }
    .auth-visual { min-height: 420px; padding: 30px; }
    .auth-orbit { width: 175px; height: 175px; right: 25px; top: 25px; }
    .auth-orbit::after { font-size: 57px; }
    .auth-card { padding: 24px; }
    .billing-choice { grid-template-columns: 1fr; }
    .dual-price { grid-template-columns: 1fr 1fr; }
    .profile-layout .hero-card, .profile-wide { grid-column: auto; }
    .hero-card { align-items: flex-start; flex-direction: column; }
    .profile-facts { grid-template-columns: 1fr; }
    .trust-section { padding: 28px; }
    .app-icon-stage { min-height: 350px; }
    .app-icon { width: 130px; height: 130px; border-radius: 36px; font-size: 62px; }
    .legal-page { margin-top: 45px; }
    .footer-links { justify-content: flex-start; }
}

@media (max-width: 390px) {
    .dashboard-toolbar { grid-template-columns: 1fr; }
    .dual-price { grid-template-columns: 1fr; }
    .mock-grid { gap: 7px; }
    .mock-grid div { min-height: 92px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

/* ============================================================
   iOS visual parity patch — Brain.swift dark / Baby Blue system
   ============================================================ */
:root {
    --ios-black: #010101;
    --ios-graphite: #050506;
    --ios-dark-panel: #070808;
    --ios-glass-panel: #131616;
    --ios-dark-grey: #121313;
    --ios-baby-blue: #86d1ff;
    --ios-baby-blue-soft: #bde8ff;
    --ios-pink: #ff8bbd;
    --ios-prism-pink: #ff4185;
    --ios-prism-cyan: #17e0ff;
    --ios-prism-violet: #a35cff;
    --ios-soft-white: #f1f6ff;
    --bg: var(--ios-black);
    --graphite: var(--ios-graphite);
    --panel: var(--ios-dark-panel);
    --aqua: var(--ios-baby-blue);
    --aqua-soft: var(--ios-baby-blue-soft);
    --pink: var(--ios-pink);
    --violet: var(--ios-prism-violet);
    --ink: var(--ios-soft-white);
    --muted: #aab4c0;
    --muted-2: #77828f;
    --line: rgba(134,209,255,.13);
    --line-strong: rgba(134,209,255,.46);
    --surface: rgba(7,8,8,.78);
    --surface-strong: rgba(19,22,22,.94);
    --surface-soft: rgba(255,255,255,.045);
    --shadow: 0 30px 90px rgba(0,0,0,.62);
    --glow: 0 0 54px rgba(134,209,255,.16);
}

html {
    background: var(--ios-black);
}

body {
    background:
        radial-gradient(circle at 15% -7%, rgba(134,209,255,.15), transparent 30rem),
        radial-gradient(circle at 86% 5%, rgba(255,139,189,.08), transparent 27rem),
        radial-gradient(circle at 52% 62%, rgba(163,92,255,.045), transparent 34rem),
        linear-gradient(180deg, #010101 0%, #050606 48%, #010101 100%);
}

body::before {
    opacity: .18;
    background-size: 42px 42px;
    background-image:
        linear-gradient(rgba(134,209,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(134,209,255,.018) 1px, transparent 1px);
}

body::after {
    content: "";
    position: fixed;
    width: 38rem;
    height: 38rem;
    left: 50%;
    top: -28rem;
    transform: translateX(-50%);
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
    background: radial-gradient(circle, rgba(134,209,255,.17), transparent 67%);
    filter: blur(28px);
    animation: iosAuroraDrift 14s ease-in-out infinite alternate;
}

.ambient {
    opacity: .075;
    animation: iosAmbientFloat 16s ease-in-out infinite alternate;
}

.ambient-a { background: var(--ios-baby-blue); }
.ambient-b { background: var(--ios-pink); animation-delay: -5s; }

.site-header {
    isolation: isolate;
    overflow: visible;
    z-index: 1000;
}

.glass-nav {
    background:
        linear-gradient(135deg, rgba(134,209,255,.045), transparent 34%),
        rgba(5,6,6,.87);
    border-color: rgba(134,209,255,.16);
    box-shadow: 0 18px 60px rgba(0,0,0,.54), inset 0 1px rgba(255,255,255,.035);
    backdrop-filter: blur(28px) saturate(132%);
    -webkit-backdrop-filter: blur(28px) saturate(132%);
}

.brand-mark {
    color: #06131c;
    background:
        linear-gradient(145deg, #f3fbff 0%, var(--ios-baby-blue-soft) 30%, var(--ios-baby-blue) 62%, #5aa9ff 100%);
    box-shadow:
        0 0 0 1px rgba(255,255,255,.22),
        0 9px 28px rgba(134,209,255,.22),
        inset 0 1px rgba(255,255,255,.78);
}

.brand-copy small,
.nav-dropdown-trigger span,
.eyebrow,
.feature-icon,
.dashboard-card > span,
.dashboard-card b,
.dashboard-bottom a,
.profile-type {
    color: var(--ios-baby-blue);
}

.site-nav > a,
.logout-form button,
.nav-dropdown-trigger {
    border: 1px solid transparent;
}

.site-nav > a:hover,
.site-nav > a.active,
.logout-form button:hover,
.nav-dropdown-trigger:hover,
.nav-dropdown.open .nav-dropdown-trigger {
    color: #effaff;
    background: rgba(134,209,255,.075);
    border-color: rgba(134,209,255,.12);
    box-shadow: inset 0 1px rgba(255,255,255,.035);
}

/* Safari-safe Apps menu: anchor to the right edge instead of centering off-screen. */
.nav-dropdown {
    position: relative;
    z-index: 1200;
}

.nav-dropdown-menu {
    left: auto;
    right: 0;
    top: calc(100% + 12px);
    width: min(390px, calc(100vw - 32px));
    transform: translateY(-8px) scale(.985);
    transform-origin: top right;
    z-index: 1400;
    padding: 9px;
    border: 1px solid rgba(134,209,255,.18);
    background:
        radial-gradient(circle at 12% 0%, rgba(134,209,255,.12), transparent 13rem),
        rgba(5,7,8,.97);
    box-shadow: 0 26px 80px rgba(0,0,0,.66), 0 0 0 1px rgba(255,255,255,.018) inset;
    backdrop-filter: blur(34px) saturate(138%);
    -webkit-backdrop-filter: blur(34px) saturate(138%);
}

.nav-dropdown.open .nav-dropdown-menu {
    transform: translateY(0) scale(1);
}

.nav-dropdown-menu a {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 11px;
    min-height: 62px;
    padding: 9px 10px;
    border: 1px solid transparent;
}

.nav-dropdown-menu a:hover,
.nav-dropdown-menu a:focus-visible {
    outline: none;
    background: linear-gradient(90deg, rgba(134,209,255,.095), rgba(255,255,255,.028));
    border-color: rgba(134,209,255,.13);
}

.nav-dropdown-menu .app-menu-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    align-self: center;
    border-radius: 12px;
    color: #e8f7ff;
    background: linear-gradient(145deg, rgba(163,92,255,.22), rgba(134,209,255,.08));
    border: 1px solid rgba(255,255,255,.09);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: -.02em;
}

.nav-dropdown-menu .app-menu-icon.available {
    color: #07131c;
    background: linear-gradient(145deg, var(--ios-baby-blue-soft), var(--ios-baby-blue));
    box-shadow: 0 0 24px rgba(134,209,255,.16);
}

.nav-dropdown-menu .app-menu-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.nav-dropdown-menu .app-menu-copy b {
    color: #f4f9ff;
    letter-spacing: -.01em;
}

.nav-dropdown-menu .app-menu-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-dropdown-menu em {
    align-self: center;
    color: var(--ios-baby-blue);
    background: rgba(134,209,255,.075);
    border: 1px solid rgba(134,209,255,.11);
}

.glass-card,
.feature-card,
.pricing-card,
.profile-card,
.settings-card,
.settings-aside,
.faq-item,
.current-membership,
.security-note {
    border-color: rgba(134,209,255,.105);
    background:
        linear-gradient(145deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
        rgba(12,15,17,.82);
    box-shadow: 0 25px 75px rgba(0,0,0,.44), inset 0 1px rgba(255,255,255,.035);
    backdrop-filter: blur(24px) saturate(124%);
    -webkit-backdrop-filter: blur(24px) saturate(124%);
}

.feature-card,
.pricing-card,
.dashboard-card,
.media-card,
.profile-card {
    overflow: hidden;
}

.feature-card::after,
.pricing-card::after,
.dashboard-card::after,
.media-card::after,
.profile-card::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 160px;
    right: -95px;
    top: -100px;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(circle, rgba(134,209,255,.10), transparent 68%);
    transition: transform .45s ease, opacity .45s ease;
}

.feature-card:hover::after,
.pricing-card:hover::after,
.dashboard-card:hover::after,
.media-card:hover::after,
.profile-card:hover::after {
    transform: translate(-15px, 15px) scale(1.22);
}

.button {
    color: #07131c;
    background: linear-gradient(145deg, var(--ios-baby-blue-soft), var(--ios-baby-blue));
    border: 1px solid rgba(255,255,255,.30);
    box-shadow: 0 10px 30px rgba(134,209,255,.15), inset 0 1px rgba(255,255,255,.66);
}

.button:hover {
    box-shadow: 0 13px 38px rgba(134,209,255,.24), inset 0 1px rgba(255,255,255,.72);
}

.button.secondary,
.button.ghost {
    color: var(--ios-soft-white);
    background: rgba(255,255,255,.045);
    border-color: rgba(134,209,255,.13);
    box-shadow: inset 0 1px rgba(255,255,255,.025);
}

.hero h1,
.page-hero h1,
.auth-visual h1,
.dashboard-hero h1,
.app-product-hero h1 {
    letter-spacing: -.055em;
}

.hero h1 span {
    color: var(--ios-baby-blue);
    text-shadow: 0 0 42px rgba(134,209,255,.20);
}

.phone-shell {
    border-color: rgba(134,209,255,.20);
    background: linear-gradient(155deg, #111719, #020303 54%, #0b1012);
    box-shadow: 0 38px 100px rgba(0,0,0,.72), 0 0 70px rgba(134,209,255,.08), inset 0 1px rgba(255,255,255,.10);
    animation: iosPhoneFloat 7s ease-in-out infinite;
}

.mock-toggle .active,
.mode-toggle button.active {
    color: #07131c;
    background: var(--ios-baby-blue);
    box-shadow: 0 0 27px rgba(134,209,255,.17);
}

.pricing-card.highlighted {
    border-color: rgba(134,209,255,.52);
    box-shadow: 0 34px 95px rgba(0,0,0,.58), 0 0 60px rgba(134,209,255,.11);
}

.dual-price > div {
    border-color: rgba(134,209,255,.09);
    background: rgba(134,209,255,.035);
}

.dual-price strong {
    color: var(--ios-baby-blue-soft);
}

.product-security-section {
    border-color: rgba(134,209,255,.13);
    background:
        radial-gradient(circle at 12% 15%, rgba(134,209,255,.09), transparent 18rem),
        linear-gradient(135deg, rgba(255,255,255,.028), rgba(4,5,5,.68));
}

.ios-experience-rail {
    margin: 0 0 115px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.ios-experience-rail article {
    position: relative;
    min-height: 142px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 22px;
    border: 1px solid rgba(134,209,255,.10);
    background: linear-gradient(150deg, rgba(134,209,255,.055), rgba(255,255,255,.018));
    box-shadow: inset 0 1px rgba(255,255,255,.03);
    transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.ios-experience-rail article:hover {
    transform: translateY(-4px);
    border-color: rgba(134,209,255,.27);
    background: linear-gradient(150deg, rgba(134,209,255,.09), rgba(255,255,255,.025));
}

.ios-experience-rail .rail-index {
    color: var(--ios-baby-blue);
    font-size: 9px;
    font-weight: 950;
    letter-spacing: .14em;
}

.ios-experience-rail div {
    display: grid;
    gap: 6px;
}

.ios-experience-rail b {
    font-size: 16px;
    letter-spacing: -.02em;
}

.ios-experience-rail small {
    color: var(--muted);
    line-height: 1.45;
}

.auth-card input,
.auth-card select,
.settings-card input,
.settings-card select,
.settings-card textarea {
    border-color: rgba(134,209,255,.12);
    background: rgba(255,255,255,.045);
    color: #f5f9ff;
    box-shadow: inset 0 1px rgba(255,255,255,.025);
}

.auth-card input:focus,
.auth-card select:focus,
.settings-card input:focus,
.settings-card select:focus,
.settings-card textarea:focus {
    border-color: rgba(134,209,255,.62);
    box-shadow: 0 0 0 3px rgba(134,209,255,.09), 0 0 30px rgba(134,209,255,.06);
}

.privacy-hero-callout {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    border-color: rgba(134,209,255,.22);
    background: linear-gradient(135deg, rgba(134,209,255,.075), rgba(255,255,255,.018));
}

.privacy-lock {
    width: 42px;
    height: 42px;
    flex: none;
    display: grid;
    place-items: center;
    border-radius: 14px;
    color: #07131c;
    background: var(--ios-baby-blue);
    box-shadow: 0 0 28px rgba(134,209,255,.13);
    font-weight: 950;
}

.site-footer {
    border-top-color: rgba(134,209,255,.10);
}

@keyframes iosAuroraDrift {
    from { transform: translateX(-50%) scale(.92); opacity: .58; }
    to { transform: translateX(-47%) scale(1.08); opacity: .86; }
}

@keyframes iosAmbientFloat {
    from { transform: translate3d(-2%, -1%, 0) scale(.96); }
    to { transform: translate3d(5%, 4%, 0) scale(1.06); }
}

@keyframes iosPhoneFloat {
    0%, 100% { transform: translateY(0) rotate(.001deg); }
    50% { transform: translateY(-9px) rotate(.001deg); }
}

@media (max-width: 1050px) {
    .site-nav {
        z-index: 1300;
        overflow: visible;
        border-color: rgba(134,209,255,.14);
        background: rgba(4,6,7,.985);
        box-shadow: 0 24px 80px rgba(0,0,0,.68);
    }

    .nav-dropdown {
        width: 100%;
    }

    .nav-dropdown-menu {
        position: static;
        width: 100%;
        max-width: none;
        margin-top: 7px;
        transform: none;
        border-radius: 17px;
        background: rgba(134,209,255,.025);
        box-shadow: inset 0 1px rgba(255,255,255,.025);
    }

    .nav-dropdown.open .nav-dropdown-menu {
        transform: none;
    }

    .ios-experience-rail {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 720px) {
    :root { --container: min(100% - 20px, 1180px); }

    .site-header {
        top: 5px;
        margin-top: 5px;
    }

    .nav-dropdown-menu a {
        grid-template-columns: 36px minmax(0, 1fr);
    }

    .nav-dropdown-menu em {
        grid-column: 2;
        justify-self: start;
        margin-top: -2px;
    }

    .nav-dropdown-menu .app-menu-copy small {
        white-space: normal;
    }

    .ios-experience-rail {
        grid-template-columns: 1fr;
        margin-bottom: 75px;
    }

    .ios-experience-rail article {
        min-height: 112px;
    }

    .phone-shell {
        animation-duration: 9s;
    }
}

@media (prefers-reduced-motion: reduce) {
    body::after,
    .ambient,
    .phone-shell {
        animation: none !important;
    }
}

/* ============================================================
   HYiYH Cloud Experience — immersive authenticated website
   ============================================================ */
html[data-theme="dark"], html[data-theme="aqua"] {
    --experience-accent: #86d1ff;
    --experience-accent-soft: rgba(134, 209, 255, .16);
    --experience-secondary: #9a75ff;
    --experience-panel: rgba(8, 11, 16, .78);
}
html[data-theme="pink"] { --experience-accent: #ff5d9e; --experience-accent-soft: rgba(255, 93, 158, .16); --experience-secondary: #b97aff; --experience-panel: rgba(17, 7, 14, .82); }
html[data-theme="aurora"] { --experience-accent: #6fffe9; --experience-accent-soft: rgba(111, 255, 233, .15); --experience-secondary: #8c7bff; --experience-panel: rgba(5, 16, 20, .82); }
html[data-theme="light"] { --experience-accent: #087fae; --experience-accent-soft: rgba(8, 127, 174, .12); --experience-secondary: #7450e9; --experience-panel: rgba(255,255,255,.86); --bg: #f5fbff; --panel: #fff; --text: #07131d; --muted: #526573; --line: rgba(14, 79, 111, .14); }
html[data-theme="light"] body { background: radial-gradient(circle at 15% 5%, rgba(134,209,255,.28), transparent 34rem), linear-gradient(#f7fcff, #edf6fb); color: var(--text); }
html[data-theme="light"] .glass-card, html[data-theme="light"] .glass-nav, html[data-theme="light"] .site-footer { background: rgba(255,255,255,.76); box-shadow: 0 24px 70px rgba(47,90,113,.12); }

.experience-body { min-height: 100vh; overflow-x: hidden; background: #010101; }
.experience-main { min-height: 72vh; }
.dream-noise { position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .12; background-image: radial-gradient(rgba(255,255,255,.22) .5px, transparent .5px); background-size: 8px 8px; mask-image: linear-gradient(to bottom, rgba(0,0,0,.7), transparent 75%); }
.experience-nav { max-width: 1500px; }
.experience-nav .site-nav { gap: 7px; }
.experience-nav .site-nav > a, .experience-nav .nav-dropdown-trigger { padding-inline: 10px; }
.mega-workspaces { width: min(560px, calc(100vw - 30px)); grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; }
.mega-workspaces > div { display: grid; gap: 5px; padding: 10px; border-radius: 18px; background: rgba(255,255,255,.025); }
.mega-workspaces strong { padding: 5px 8px 8px; color: var(--experience-accent); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; }
.mega-workspaces a, .compact-menu a { display: block; padding: 10px; color: var(--text); border-radius: 12px; text-decoration: none; font-size: 13px; }
.mega-workspaces a:hover, .compact-menu a:hover { background: var(--experience-accent-soft); color: var(--experience-accent); }
.compact-menu { min-width: 250px; padding: 10px; }
.experience-footer { margin-top: 95px; }

.experience-hero { min-height: 420px; padding: 86px 0 55px; display: grid; grid-template-columns: 1.35fr .45fr; gap: 45px; align-items: center; position: relative; }
.experience-hero::before { content: ""; position: absolute; width: 520px; height: 520px; right: -150px; top: -80px; border-radius: 50%; background: radial-gradient(circle, var(--experience-accent-soft), transparent 68%); filter: blur(8px); pointer-events: none; }
.experience-hero h1, .onboarding-copy h1, .search-stage h1, .product-dream-hero h1 { font-size: clamp(48px, 7vw, 94px); line-height: .95; letter-spacing: -.055em; max-width: 950px; margin: 12px 0 22px; }
.experience-hero p:not(.eyebrow), .onboarding-copy > p:not(.eyebrow), .search-stage > p:not(.eyebrow), .product-dream-hero p:not(.eyebrow) { color: var(--muted); max-width: 820px; line-height: 1.72; font-size: 18px; }
.experience-symbol { justify-self: end; width: 210px; height: 210px; border-radius: 62px; display: grid; place-items: center; font-size: 82px; font-weight: 950; color: var(--experience-accent); background: radial-gradient(circle at 35% 25%, rgba(255,255,255,.14), transparent 35%), linear-gradient(145deg, var(--experience-accent-soft), rgba(255,255,255,.025)); border: 1px solid color-mix(in srgb, var(--experience-accent) 30%, transparent); box-shadow: 0 38px 95px color-mix(in srgb, var(--experience-accent) 18%, transparent), inset 0 1px rgba(255,255,255,.13); transform: rotate(5deg); }

.record-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 16px 20px; margin-bottom: 18px; border-radius: 22px; }
.record-toolbar > div:first-child { display: grid; gap: 3px; }
.record-toolbar span { color: var(--muted); font-size: 12px; text-transform: capitalize; }
.view-pills { display: flex; gap: 4px; padding: 4px; background: rgba(255,255,255,.04); border-radius: 13px; }
.view-pills button { border: 0; color: var(--muted); background: transparent; padding: 8px 13px; border-radius: 10px; cursor: pointer; }
.view-pills button.active { color: #00131c; background: var(--experience-accent); }
.cloud-record-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; padding-bottom: 80px; }
.cloud-record-grid.compact { grid-template-columns: repeat(4, minmax(0,1fr)); }
.cloud-record-card { min-width: 0; padding: 16px; border-radius: 28px; display: flex; flex-direction: column; gap: 10px; overflow: hidden; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.cloud-record-card:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--experience-accent) 34%, transparent); box-shadow: 0 28px 75px color-mix(in srgb, var(--experience-accent) 10%, transparent); }
.record-media { position: relative; min-height: 145px; display: grid; place-items: center; overflow: hidden; border-radius: 21px; background: radial-gradient(circle at 40% 35%, var(--experience-accent-soft), transparent 55%), #070a0e; color: var(--experience-accent); font-size: 42px; }
.record-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.record-media.has-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 45%, rgba(0,0,0,.55)); }
.record-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.record-topline b { color: var(--experience-accent); }
.cloud-record-card h2 { margin: 0; font-size: 22px; line-height: 1.05; overflow-wrap: anywhere; }
.cloud-record-card p { color: var(--muted); line-height: 1.5; margin: 0; flex: 1; }
.record-meta { display: grid; gap: 4px; color: #8c9aa5; font-size: 11px; }
.record-status { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.record-status b { padding: 5px 8px; border-radius: 8px; color: var(--experience-accent); background: var(--experience-accent-soft); font-size: 10px; }
.record-status b.done { color: #65f5bd; background: rgba(50,229,156,.12); }
.record-status strong { margin-left: auto; color: var(--text); }
.text-link { color: var(--experience-accent); font-weight: 800; text-decoration: none; font-size: 13px; }
.empty-cloud { min-height: 320px; margin-bottom: 90px; padding: 55px; border-radius: 34px; display: grid; place-items: center; text-align: center; gap: 10px; }
.empty-cloud > span { font-size: 54px; color: var(--experience-accent); }
.empty-cloud h2 { margin: 0; font-size: 33px; }
.empty-cloud p { color: var(--muted); max-width: 650px; line-height: 1.65; }
[data-gallery-grid].list-view { grid-template-columns: 1fr; }
[data-gallery-grid].list-view .cloud-record-card { display: grid; grid-template-columns: 180px 1fr; }
[data-gallery-grid].list-view .record-media { grid-row: span 7; }

.onboarding-stage { min-height: 600px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 70px; align-items: center; padding: 70px 0 35px; }
.onboarding-orbit, .product-orbit { position: relative; justify-self: center; width: min(430px, 90vw); aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(134,209,255,.13); display: grid; place-items: center; background: radial-gradient(circle, rgba(134,209,255,.18), rgba(154,117,255,.06) 40%, transparent 68%); box-shadow: 0 0 120px rgba(80,177,255,.12); animation: dreamFloat 6s ease-in-out infinite; }
.onboarding-orbit::before, .onboarding-orbit::after, .product-orbit::before, .product-orbit::after { content: ""; position: absolute; inset: 12%; border: 1px solid rgba(255,255,255,.08); border-radius: 44% 56% 52% 48%; animation: orbitSpin 18s linear infinite; }
.onboarding-orbit::after, .product-orbit::after { inset: 25%; animation-direction: reverse; animation-duration: 12s; }
.onboarding-orbit > span, .product-orbit > span { width: 145px; height: 145px; border-radius: 43px; display: grid; place-items: center; font-size: 70px; font-weight: 950; color: #00131c; background: linear-gradient(145deg, #e2fbff, var(--experience-accent), var(--experience-secondary)); box-shadow: 0 30px 80px color-mix(in srgb, var(--experience-accent) 28%, transparent); z-index: 2; }
.tour-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.tour-card { min-height: 285px; padding: 25px; border-radius: 29px; position: relative; overflow: hidden; }
.tour-index { color: var(--muted); font-size: 11px; letter-spacing: .15em; }
.tour-icon { display: block; margin: 32px 0 23px; color: var(--experience-accent); font-size: 31px; }
.tour-card h2 { font-size: 23px; margin: 0 0 10px; }
.tour-card p { color: var(--muted); line-height: 1.55; }
.center-action { padding: 35px 0 100px; display: flex; justify-content: center; }
.dream-button { box-shadow: 0 18px 55px color-mix(in srgb, var(--experience-accent) 25%, transparent); }
.guided-track { display: grid; gap: 14px; counter-reset: scenes; }
.guided-scene { min-height: 245px; padding: 25px; display: grid; grid-template-columns: 120px 1fr; align-items: center; border: 1px solid var(--line); border-radius: 32px; background: linear-gradient(135deg, rgba(255,255,255,.035), var(--experience-accent-soft)); overflow: hidden; }
.guided-scene > span { color: var(--experience-accent); font-size: 58px; font-weight: 950; opacity: .35; }
.guided-scene b { font-size: 34px; color: var(--experience-accent); }
.guided-scene h2 { font-size: 34px; margin: 10px 0; }
.guided-scene p { color: var(--muted); line-height: 1.65; max-width: 850px; }

.control-layout { display: grid; grid-template-columns: 1.4fr .6fr; gap: 16px; padding-bottom: 90px; }
.control-themes { padding: 28px; border-radius: 30px; }
.control-themes > p { color: var(--muted); }
.theme-gallery { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; margin: 28px 0; }
.theme-choice input { position: absolute; opacity: 0; }
.theme-choice > span { min-height: 165px; display: flex; flex-direction: column; justify-content: end; gap: 5px; padding: 14px; border: 1px solid var(--line); border-radius: 21px; cursor: pointer; transition: .2s ease; }
.theme-choice b { font-size: 26px; }
.theme-choice small { color: var(--muted); }
.theme-choice input:checked + span { border-color: var(--experience-accent); box-shadow: 0 0 0 3px var(--experience-accent-soft); transform: translateY(-4px); }
.theme-dark > span { background: linear-gradient(145deg,#030304,#11141a); }
.theme-aqua > span { background: radial-gradient(circle at 30% 20%,rgba(134,209,255,.28),transparent 55%),#071017; }
.theme-pink > span { background: radial-gradient(circle at 30% 20%,rgba(255,93,158,.28),transparent 55%),#160912; }
.theme-aurora > span { background: linear-gradient(145deg,rgba(111,255,233,.2),rgba(140,123,255,.2),#061010); }
.theme-light > span { background: linear-gradient(145deg,#fff,#e8f5fb); color:#09202b; }
.control-stack { display: grid; gap: 12px; }
.control-stack article { padding: 23px; border-radius: 25px; display: grid; gap: 8px; }
.control-stack article > span { color: var(--experience-accent); font-size: 27px; }
.control-stack h2, .control-stack p { margin: 0; }
.control-stack p { color: var(--muted); }
.control-stack a { color: var(--experience-accent); text-decoration: none; font-weight: 800; }

.profile-dream-hero { min-height: 340px; padding: 75px 0 40px; display: grid; grid-template-columns: auto 1fr auto; gap: 25px; align-items: center; }
.dream-avatar { width: 120px; height: 120px; border-radius: 39px; }
.profile-dream-hero h1 { font-size: clamp(43px,5vw,72px); margin: 5px 0; }
.profile-badges { display: flex; gap: 7px; flex-wrap: wrap; }
.profile-badges span { padding: 7px 10px; border-radius: 999px; color: var(--experience-accent); background: var(--experience-accent-soft); font-size: 11px; font-weight: 850; }
.profile-actions { display: grid; gap: 8px; }
.profile-information-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 14px; margin-bottom: 65px; }
.profile-information-grid article { padding: 27px; border-radius: 28px; }
.profile-story h2 { font-size: 26px; line-height: 1.4; }
.section-heading.compact { margin-top: 55px; }

.support-layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 16px; padding-bottom: 100px; }
.support-form { padding: 28px; border-radius: 30px; }
.support-form textarea, .route-builder textarea { resize: vertical; min-height: 150px; }
.support-options { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.support-options article { padding: 21px; border-radius: 24px; }
.support-options b { color: var(--experience-accent); font-size: 28px; }
.support-options h2 { margin: 20px 0 7px; }
.support-options p { color: var(--muted); line-height: 1.5; }

.split-heading { display: flex; justify-content: space-between; align-items: end; margin: 65px 0 18px; }
.split-heading h2 { margin: 0; font-size: 36px; }
.split-heading > span { color: var(--experience-accent); }
.chat-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 14px; padding-bottom: 90px; }
.chat-list, .message-stream { padding: 20px; border-radius: 28px; }
.chat-thread { display: grid; grid-template-columns: 38px 1fr; gap: 10px; padding: 13px; border-radius: 17px; border: 1px solid transparent; }
.chat-thread:hover { background: rgba(255,255,255,.025); border-color: var(--line); }
.chat-thread > span { color: var(--experience-accent); }
.chat-thread h3, .chat-thread p { margin: 0 0 4px; }
.chat-thread p, .chat-thread small { color: var(--muted); }
.message-stream { display: grid; align-content: start; gap: 9px; }
.message-bubble { max-width: 82%; padding: 14px 16px; border-radius: 19px 19px 19px 5px; background: var(--experience-accent-soft); border: 1px solid color-mix(in srgb,var(--experience-accent) 16%,transparent); }
.message-bubble:nth-child(odd) { margin-left: auto; border-radius: 19px 19px 5px 19px; background: rgba(154,117,255,.1); }
.message-bubble p { color: var(--muted); line-height: 1.5; }
.message-bubble small { color: #7f8b95; }
.empty-mini { padding: 35px 10px; text-align: center; color: var(--muted); }

.product-dream-hero { min-height: 620px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 65px; align-items: center; padding: 70px 0; }
.product-orbit i, .product-orbit b { position: absolute; padding: 9px 13px; border: 1px solid var(--line); border-radius: 999px; background: rgba(6,9,13,.82); color: var(--experience-accent); font-style: normal; font-size: 11px; }
.product-orbit i { top: 17%; right: 6%; }.product-orbit b { bottom: 16%; left: 5%; }
.product-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; padding-bottom: 100px; }
.product-card { border-radius: 30px; overflow: hidden; padding: 0; }
.product-card.featured { border-color: color-mix(in srgb,var(--experience-accent) 40%,transparent); box-shadow: 0 25px 80px var(--experience-accent-soft); }
.product-image { min-height: 320px; position: relative; display: grid; place-items: center; background: radial-gradient(circle,var(--experience-accent-soft),transparent 60%),#05070a; }
.product-image > span { font-size: 85px; font-weight: 950; color: var(--experience-accent); }
.product-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.product-badges { position: absolute; left: 13px; top: 13px; display: flex; flex-wrap: wrap; gap: 5px; }
.product-badges b { padding: 6px 8px; border-radius: 999px; color: #00131c; background: var(--experience-accent); font-size: 9px; text-transform: uppercase; }
.product-copy { padding: 22px; display: grid; gap: 10px; }
.product-copy > span { color: var(--experience-accent); text-transform: uppercase; letter-spacing: .1em; font-size: 10px; }
.product-copy h2, .product-copy p { margin: 0; }
.product-copy p { color: var(--muted); line-height: 1.55; min-height: 73px; }
.product-price { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.product-price strong { font-size: 22px; }.product-price small { color: var(--muted); }
.full { width: 100%; justify-content: center; }

.marketplace-controls { padding: 15px; border-radius: 28px; margin-bottom: 20px; }
.market-icons { display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; }
.market-icons a { padding: 13px; border-radius: 17px; display: flex; align-items: center; gap: 9px; text-decoration: none; color: var(--muted); background: rgba(255,255,255,.025); }
.market-icons a b { color: var(--experience-accent); font-size: 20px; }.market-icons a.active { background: var(--experience-accent-soft); color: var(--text); box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--experience-accent) 25%,transparent); }
.market-search { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 11px; }
.marketplace-controls .market-search { grid-template-columns: 1.5fr .55fr .55fr .55fr auto; }
.market-search input, .market-search select, .browser-bar input, .route-builder textarea { border: 1px solid var(--line); border-radius: 14px; color: var(--text); background: rgba(255,255,255,.035); padding: 12px 14px; }
.marketplace-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 15px; padding-bottom: 100px; }
.marketplace-card { padding: 14px; border-radius: 28px; display: grid; grid-template-columns: 220px 1fr; gap: 18px; }
.marketplace-image { min-height: 220px; border-radius: 21px; overflow: hidden; display: grid; place-items: center; color: var(--experience-accent); font-size: 53px; background: radial-gradient(circle,var(--experience-accent-soft),transparent 60%),#05070a; }
.marketplace-image img { width:100%;height:100%;object-fit:cover; }
.marketplace-card h2 { font-size: 28px; margin: 10px 0; }.marketplace-card p { color: var(--muted); line-height:1.55; }

.calendar-switcher { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; padding: 6px; border-radius: 22px; margin-bottom: 18px; }
.calendar-switcher a { padding: 13px; border-radius: 17px; display: flex; justify-content: center; align-items: center; gap: 8px; color: var(--muted); text-decoration: none; font-weight: 850; }
.calendar-switcher a b { color: var(--experience-accent); }.calendar-switcher a.active { color:#00131c;background:var(--experience-accent); }.calendar-switcher a.active b { color:#00131c; }
.calendar-cosmos { display: grid; gap: 15px; padding-bottom: 100px; }
.calendar-cosmos.view-year { grid-template-columns: repeat(3,1fr); }
.calendar-cosmos.view-month { grid-template-columns: repeat(2,1fr); }
.calendar-period { padding: 21px; border-radius: 28px; overflow: hidden; }
.calendar-period > header { display: flex; justify-content: space-between; align-items: start; gap: 15px; margin-bottom: 15px; }
.calendar-period h2 { margin: 0; font-size: 28px; }.calendar-period header > span { color:var(--muted);font-size:12px; }
.calendar-events { display: grid; gap: 7px; }
.calendar-events article { display:grid; grid-template-columns:34px 1fr auto; gap:9px; align-items:center; padding:11px; border-radius:15px; background:rgba(255,255,255,.025); }
.calendar-events article > b { color:var(--experience-accent); }.calendar-events h3,.calendar-events p { margin:0; }.calendar-events p,.calendar-events small,.calendar-events article>span { color:var(--muted);font-size:11px; }

.map-shell { min-height: 650px; padding: 12px; border-radius: 32px; display: grid; grid-template-columns: 1fr 320px; gap: 12px; margin-bottom: 18px; }
.hyiyh-map { min-height: 625px; border-radius: 23px; overflow: hidden; background: #071018; z-index: 1; }
.hyiyh-map .leaflet-control-attribution { font-size: 9px; }
.hyiyh-map .leaflet-popup-content-wrapper, .hyiyh-map .leaflet-popup-tip { background:#071018;color:#fff; }
.hyiyh-map .map-popup { display:grid;gap:4px; }.hyiyh-map .map-popup a { color:#86d1ff;font-weight:800; }
.route-builder { padding: 22px; border-radius: 23px; background: linear-gradient(145deg,var(--experience-accent-soft),rgba(255,255,255,.025)); display: flex; flex-direction: column; gap: 10px; }
.route-builder h2,.route-builder p { margin:0; }.route-builder p,.route-builder small { color:var(--muted);line-height:1.5; }
.map-place-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding-bottom:100px; }.map-place-grid article { padding:17px;border-radius:22px; }.map-place-grid b { color:var(--experience-accent);font-size:25px; }.map-place-grid h2 { font-size:18px; }.map-place-grid p { color:var(--muted); }.map-place-grid a { color:var(--experience-accent);text-decoration:none;font-weight:800; }

.panorama-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding-bottom:100px; }.panorama-card { padding:15px;border-radius:30px; }.panorama-stage { min-height:360px;border-radius:23px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,var(--experience-accent-soft),transparent 65%),#030405;color:var(--experience-accent);font-size:60px; }.panorama-stage img { width:135%;height:100%;object-fit:cover;cursor:grab;transition:transform .2s ease; }.panorama-card h2 { font-size:28px; }.panorama-card p { color:var(--muted);line-height:1.55; }
.project-canvas { min-height:760px;position:relative;border:1px solid var(--line);border-radius:38px;margin-bottom:100px;overflow:hidden;background:radial-gradient(circle at 50% 50%,var(--experience-accent-soft),transparent 45%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),#030405;background-size:auto,40px 40px,40px 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:45px;align-content:start; }
.canvas-node { min-height:180px;padding:19px;border:1px solid color-mix(in srgb,var(--experience-accent) 20%,transparent);border-radius:25px;background:rgba(7,10,14,.82);box-shadow:0 18px 50px rgba(0,0,0,.35);transform:rotate(-1.5deg);transition:.2s ease; }.canvas-node:nth-child(2n){transform:rotate(1.5deg) translateY(35px)}.canvas-node:nth-child(3n){transform:rotate(-2deg) translateY(12px)}.canvas-node:hover,.canvas-node:focus{z-index:3;transform:scale(1.05);border-color:var(--experience-accent);outline:none}.canvas-node>span{color:var(--experience-accent);font-size:27px}.canvas-node h2{font-size:21px}.canvas-node p,.canvas-node small{color:var(--muted)}

.create-studio { max-width:1000px;margin:0 auto 100px;padding:28px;border-radius:34px; }.create-type{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:24px}.create-type input{position:absolute;opacity:0}.create-type span{min-height:135px;padding:17px;border:1px solid var(--line);border-radius:21px;display:flex;flex-direction:column;justify-content:end;cursor:pointer}.create-type b{font-size:29px;color:var(--experience-accent)}.create-type small{color:var(--muted)}.create-type input:checked+span{border-color:var(--experience-accent);background:var(--experience-accent-soft);box-shadow:0 0 0 3px var(--experience-accent-soft)}.create-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.create-grid .wide{grid-column:1/-1}.create-grid label{display:grid;gap:7px;font-weight:750}.create-grid input,.create-grid textarea,.create-grid select,.support-form input,.support-form textarea,.support-form select{width:100%;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035);color:var(--text);padding:12px 14px}.public-toggle{grid-template-columns:auto 1fr!important;display:grid!important;align-items:center}.public-toggle input{width:auto}.public-toggle span{display:grid}.public-toggle small{color:var(--muted);font-weight:400}.create-studio>button{margin-top:20px;width:100%;justify-content:center}
.search-stage { min-height:500px;padding:100px 0 55px;display:flex;flex-direction:column;align-items:center;text-align:center }.search-stage p{max-width:800px}.browser-bar{width:min(920px,100%);padding:8px 8px 8px 17px;border-radius:24px;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:25px}.browser-bar>span{color:var(--experience-accent);font-size:25px}.browser-bar input{border:0;background:transparent;font-size:18px;outline:0}.search-launch{margin-top:17px;color:var(--experience-accent);font-weight:850;text-decoration:none}.search-save-layout{display:grid;grid-template-columns:1fr 1fr;gap:14px}.search-save-layout>article,.search-save-layout>form{padding:25px;border-radius:28px}.privacy-browser-note b{font-size:35px;color:var(--experience-accent)}.privacy-browser-note p{color:var(--muted);line-height:1.65}

.dream-sequence { min-height:650px;margin:35px 0 100px;padding:65px;border:1px solid var(--line);border-radius:44px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;background:radial-gradient(circle at 72% 45%,rgba(134,209,255,.18),transparent 23rem),radial-gradient(circle at 85% 65%,rgba(154,117,255,.14),transparent 20rem),#030405;overflow:hidden}.dream-copy h2{font-size:clamp(43px,5vw,72px);line-height:1;letter-spacing:-.045em}.dream-copy p{color:var(--muted);font-size:17px;line-height:1.7}.dream-constellation{position:relative;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.07);display:grid;place-items:center}.dream-constellation::before,.dream-constellation::after{content:"";position:absolute;inset:16%;border:1px dashed rgba(134,209,255,.17);border-radius:50%;animation:orbitSpin 24s linear infinite}.dream-constellation::after{inset:33%;animation-direction:reverse}.dream-core{width:110px;height:110px;border-radius:34px;display:grid;place-items:center;color:#00131c;background:linear-gradient(145deg,#e4fbff,#86d1ff,#9a75ff);font-size:53px;font-weight:950;z-index:2}.dream-node{position:absolute;padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:rgba(5,7,10,.85);color:#c8d5de;font-size:11px;font-style:normal}.dream-node.one{top:5%;left:42%}.dream-node.two{top:28%;right:0}.dream-node.three{bottom:9%;right:25%}.dream-node.four{bottom:20%;left:1%}.dream-node.five{top:25%;left:1%}

@keyframes orbitSpin { to { transform: rotate(360deg); } }
@keyframes dreamFloat { 0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)} }

@media (max-width: 1180px) {
    .cloud-record-grid, .product-grid { grid-template-columns: repeat(2,1fr); }
    .cloud-record-grid.compact { grid-template-columns: repeat(3,1fr); }
    .tour-grid { grid-template-columns: repeat(2,1fr); }
    .theme-gallery { grid-template-columns: repeat(3,1fr); }
    .marketplace-card { grid-template-columns: 170px 1fr; }
    .calendar-cosmos.view-year { grid-template-columns: repeat(2,1fr); }
    .map-place-grid { grid-template-columns: repeat(2,1fr); }
    .project-canvas { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 900px) {
    .experience-hero, .onboarding-stage, .product-dream-hero, .dream-sequence { grid-template-columns:1fr;min-height:auto;padding-top:55px; }
    .experience-symbol { justify-self:start;width:130px;height:130px;border-radius:39px;font-size:52px; }
    .onboarding-orbit,.product-orbit{width:min(330px,85vw)}
    .control-layout,.profile-information-grid,.support-layout,.chat-layout,.search-save-layout,.map-shell{grid-template-columns:1fr}
    .theme-gallery{grid-template-columns:repeat(2,1fr)}
    .marketplace-grid,.panorama-grid,.calendar-cosmos.view-month,.calendar-cosmos.view-year{grid-template-columns:1fr}
    .marketplace-controls .market-search{grid-template-columns:1fr 1fr}.marketplace-controls .market-search input:first-child{grid-column:1/-1}
    .hyiyh-map{min-height:500px}.map-shell{min-height:auto}
    .profile-dream-hero{grid-template-columns:auto 1fr}.profile-actions{grid-column:1/-1;grid-template-columns:repeat(2,1fr)}
    .project-canvas{grid-template-columns:repeat(2,1fr);padding:25px}.canvas-node:nth-child(n){transform:none}
}
@media (max-width: 700px) {
    .experience-nav .site-nav.open { max-height: calc(100vh - 90px); overflow:auto; }
    .mega-workspaces { position:static!important;width:100%;grid-template-columns:1fr;box-shadow:none;margin-top:5px; }
    .compact-menu { position:static!important;width:100%;box-shadow:none; }
    .experience-hero h1,.onboarding-copy h1,.search-stage h1,.product-dream-hero h1{font-size:clamp(42px,13vw,66px)}
    .cloud-record-grid,.cloud-record-grid.compact,.product-grid,.tour-grid{grid-template-columns:1fr}
    [data-gallery-grid].list-view .cloud-record-card{display:flex}
    .guided-scene{grid-template-columns:1fr}.guided-scene>span{font-size:34px}
    .support-options{grid-template-columns:1fr}.theme-gallery{grid-template-columns:1fr 1fr}.theme-choice>span{min-height:120px}
    .market-icons{grid-template-columns:repeat(2,1fr)}.market-icons a:first-child{grid-column:1/-1}
    .marketplace-controls .market-search{grid-template-columns:1fr}.marketplace-controls .market-search input:first-child{grid-column:auto}
    .marketplace-card{grid-template-columns:1fr}.marketplace-image{min-height:240px}
    .calendar-switcher{grid-template-columns:repeat(2,1fr)}
    .map-place-grid{grid-template-columns:1fr}.panorama-stage{min-height:250px}
    .create-type,.create-grid{grid-template-columns:1fr}.create-grid .wide{grid-column:auto}
    .browser-bar{grid-template-columns:auto 1fr}.browser-bar button{grid-column:1/-1}
    .profile-dream-hero{grid-template-columns:1fr;text-align:center}.dream-avatar{margin:auto}.profile-actions{grid-template-columns:1fr}
    .project-canvas{grid-template-columns:1fr;min-height:500px}
    .dream-sequence{padding:28px}.dream-constellation{min-height:300px}
}
@media (prefers-reduced-motion: reduce) {
    .onboarding-orbit,.product-orbit,.onboarding-orbit::before,.onboarding-orbit::after,.product-orbit::before,.product-orbit::after,.dream-constellation::before,.dream-constellation::after{animation:none!important}
    .cloud-record-card,.canvas-node{transition:none!important}
}

/* ============================================================
   iOS parity polish: verification, embedded billing, workspaces,
   calendar, chat, map, project canvas and browser media studios.
   ============================================================ */
.embedded-billing-hero { max-width: 1050px; margin: 70px auto 22px; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.embedded-billing-hero h1 { max-width: 780px; margin: 7px 0 12px; font-size: clamp(42px, 6vw, 82px); letter-spacing: -.055em; line-height: .98; }
.embedded-billing-hero p { color: var(--muted); max-width: 720px; line-height: 1.65; }
.embedded-billing-shell { max-width: 1050px; min-height: 600px; margin: 0 auto 18px; padding: 22px; border-radius: 34px; position: relative; overflow: hidden; }
.embedded-billing-shell::before { content: ""; position: absolute; inset: -45% 20% auto -20%; height: 480px; background: radial-gradient(circle, var(--experience-accent-soft), transparent 68%); pointer-events: none; }
.embedded-payment-form { position: relative; z-index: 1; min-height: 520px; }
.billing-loading, .billing-error { min-height: 500px; display: grid; place-content: center; justify-items: center; text-align: center; gap: 10px; color: var(--muted); }
.billing-loading[hidden], .billing-error[hidden] { display: none !important; }
.billing-loading span { width: 48px; height: 48px; border: 3px solid var(--line); border-top-color: var(--experience-accent); border-radius: 50%; animation: billingSpin .85s linear infinite; }
.billing-loading h2, .billing-error h2 { margin: 0; color: var(--text); }
.billing-trust-row { max-width: 1050px; margin: 0 auto 90px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.billing-trust-row article { padding: 20px; border-radius: 24px; }
.billing-trust-row b { color: var(--experience-accent); font-size: 26px; }
.billing-trust-row h3 { margin: 9px 0 5px; }.billing-trust-row p { margin: 0; color: var(--muted); line-height: 1.55; }
@keyframes billingSpin { to { transform: rotate(360deg); } }

.verification-shell { min-height: 760px; display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 70px; padding: 70px 0 110px; }
.verification-copy h1 { margin: 8px 0 18px; font-size: clamp(48px, 7vw, 96px); line-height: .94; letter-spacing: -.06em; }
.verification-copy > p { color: var(--muted); line-height: 1.7; max-width: 700px; }
.verification-orbit { width: min(430px, 80vw); aspect-ratio: 1; margin: auto; display: grid; place-items: center; position: relative; border-radius: 50%; background: radial-gradient(circle, rgba(134,209,255,.25), rgba(154,117,255,.08) 38%, transparent 67%); }
.verification-orbit > span { width: 145px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 38px; font-size: 66px; color: #00131c; background: linear-gradient(145deg, #fff, var(--experience-accent)); box-shadow: 0 30px 100px rgba(134,209,255,.35); }
.verification-orbit i { position: absolute; inset: 10%; border: 1px solid rgba(134,209,255,.22); border-radius: 50%; animation: orbitPulse 5s ease-in-out infinite; }.verification-orbit i:nth-child(2){inset:22%;animation-delay:-1.5s}.verification-orbit i:nth-child(3){inset:-3%;animation-delay:-3s}
@keyframes orbitPulse { 50% { transform: scale(1.08); opacity: .45; } }
.verification-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 9px; margin: 24px 0; border-radius: 24px; }
.verification-steps span { padding: 15px; border-radius: 18px; display: grid; gap: 8px; color: var(--muted); background: rgba(255,255,255,.025); }.verification-steps b { width: 30px; height: 30px; display:grid;place-items:center;border-radius:50%;background:var(--experience-accent);color:#00131c; }
.verification-actions { display: flex; flex-wrap: wrap; gap: 10px; }.verification-help { font-size: 12px; }

.workspace-subview-nav { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; padding: 7px; border-radius: 25px; margin: -24px 0 20px; position: sticky; top: 86px; z-index: 8; backdrop-filter: blur(25px); }
.workspace-subview-nav a { min-height: 72px; padding: 10px 12px; border-radius: 19px; color: var(--muted); text-decoration: none; display: flex; align-items: center; justify-content: center; gap: 9px; font-weight: 850; transition: transform .2s ease, background .2s ease, color .2s ease; }
.workspace-subview-nav a b { color: var(--experience-accent); font-size: 21px; }.workspace-subview-nav a.active { color:#00131c;background:linear-gradient(135deg,var(--experience-accent),#fff);box-shadow:0 15px 35px var(--experience-accent-soft); }.workspace-subview-nav a.active b{color:#00131c}.workspace-subview-nav a:hover{transform:translateY(-2px)}

.calendar-navigation { margin: 0 0 12px; padding: 12px 18px; border-radius: 24px; display: grid; grid-template-columns: 50px 1fr 50px; align-items: center; text-align: center; }
.calendar-navigation > a { width: 44px; height: 44px; display:grid;place-items:center;border-radius:50%;color:var(--text);text-decoration:none;font-size:34px;background:rgba(255,255,255,.04); }
.calendar-navigation > a:hover { background: var(--experience-accent-soft); color: var(--experience-accent); }
.calendar-navigation h2,.calendar-navigation p{margin:0}.calendar-navigation h2{font-size:clamp(23px,3vw,38px)}
.calendar-cosmos.view-week { grid-template-columns: repeat(7,minmax(0,1fr)); align-items: start; }
.calendar-cosmos.view-month { grid-template-columns: repeat(7,minmax(0,1fr)); gap: 8px; }
.calendar-cosmos.view-year { grid-template-columns: repeat(4,minmax(0,1fr)); }
.calendar-cosmos.view-day { grid-template-columns: 1fr; }
.calendar-cosmos.view-week .calendar-period,.calendar-cosmos.view-month .calendar-period{padding:13px;min-height:165px;border-radius:20px}
.calendar-cosmos.view-month .calendar-period>header{display:block;margin-bottom:8px}.calendar-cosmos.view-month .calendar-period h2{font-size:22px}.calendar-cosmos.view-month .calendar-period header>span{font-size:9px;text-transform:uppercase;letter-spacing:.09em}
.calendar-cosmos.view-week .calendar-period h2{font-size:17px}.calendar-cosmos.view-week .calendar-events article,.calendar-cosmos.view-month .calendar-events article{grid-template-columns:22px 1fr;padding:8px}.calendar-cosmos.view-week .calendar-events article>span,.calendar-cosmos.view-month .calendar-events article>span{display:none}.calendar-cosmos.view-week .calendar-events p,.calendar-cosmos.view-month .calendar-events p{display:none}.calendar-cosmos.view-month .calendar-events h3{font-size:11px}.calendar-placeholder{visibility:hidden;pointer-events:none}.calendar-day-empty{padding:14px 4px;color:#64717b;font-size:10px;text-transform:uppercase;letter-spacing:.12em}

.ios-chat-layout { min-height: 690px; grid-template-columns: 330px minmax(0,1fr); }
.chat-list,.message-stream{border-radius:30px;padding:17px}.chat-list{max-height:720px;overflow:auto}.chat-thread{border:1px solid transparent}.chat-thread.active{background:linear-gradient(145deg,var(--experience-accent-soft),rgba(255,255,255,.035));border-color:color-mix(in srgb,var(--experience-accent) 35%,transparent);box-shadow:0 12px 35px rgba(0,0,0,.22)}
.message-stream{display:grid;grid-template-rows:auto minmax(280px,1fr) auto;max-height:720px}.message-scroll{overflow:auto;padding:5px 3px 15px;scrollbar-width:thin}.chat-composer{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end;padding-top:10px;border-top:1px solid var(--line)}.chat-composer textarea{min-height:70px;resize:vertical;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035);color:var(--text);padding:13px}

.map-stage{min-width:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px}.map-location-status{padding:10px 13px;border-radius:14px;background:rgba(255,255,255,.025);color:var(--muted);font-size:11px}.route-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.map-place-grid article>div{display:flex;flex-wrap:wrap;gap:9px}.map-place-grid button{border:0;background:transparent;color:var(--experience-accent);font-weight:850;cursor:pointer;padding:0}.leaflet-container{font-family:inherit}

.project-canvas { display:block; min-height:760px; position:relative; padding:0; touch-action:none; }
.project-canvas .canvas-node { width:min(235px,calc(100vw - 58px)); min-height:180px; margin:0; touch-action:none; user-select:none; cursor:grab; transform:none!important; }
.project-canvas .canvas-node.dragging{cursor:grabbing;z-index:20;box-shadow:0 28px 80px rgba(0,0,0,.55);border-color:var(--experience-accent)}.project-canvas .canvas-node a{color:inherit;text-decoration:none}.canvas-note{background:linear-gradient(145deg,rgba(134,209,255,.13),rgba(154,117,255,.09)),#071018!important}
.project-detail-hero { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:25px;padding:28px;border-radius:32px;margin:55px 0 18px}.project-detail-mark{width:90px;aspect-ratio:1;display:grid;place-items:center;border-radius:28px;background:var(--experience-accent-soft);color:var(--experience-accent);font-size:42px}.project-detail-hero h1{font-size:clamp(38px,5vw,70px);line-height:1;margin:6px 0}.project-detail-hero p{color:var(--muted);line-height:1.6}.project-detail-actions{display:grid;gap:8px}.project-facts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.project-facts-grid article{padding:18px;border-radius:23px}.project-facts-grid span{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.1em}.project-facts-grid h2{font-size:17px;overflow-wrap:anywhere}.project-visual{margin-top:14px;padding:10px;border-radius:30px;overflow:hidden}.project-visual img{width:100%;max-height:680px;object-fit:cover;border-radius:23px}.project-link-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px;border-radius:25px;margin-top:14px}

.media-studio-shell{position:relative}.media-preview-stage{min-height:520px;position:relative;overflow:hidden}.media-preview-stage>[data-local-preview],.media-preview-stage>video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#010203;border-radius:24px}.media-preview-stage>audio{position:absolute;left:5%;right:5%;bottom:42%;width:90%;height:54px}.document-preview{position:absolute;inset:18%;display:grid;place-items:center;padding:25px;border:1px dashed var(--line);border-radius:25px;color:var(--experience-accent);font-weight:850;overflow-wrap:anywhere}.media-timeline{display:flex;gap:8px;overflow-x:auto;padding:10px 0}.media-timeline-item{min-width:180px;max-width:230px;text-align:left;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.03);color:var(--text);padding:11px;display:grid;gap:4px;cursor:pointer}.media-timeline-item b{color:var(--experience-accent);text-transform:uppercase;font-size:9px}.media-timeline-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-timeline-item small{color:var(--muted)}

.internal-browser-shell{min-height:750px;display:grid;grid-template-rows:auto auto minmax(520px,1fr) auto;gap:8px}.internal-browser-frame{width:100%;height:70vh;min-height:520px;border:1px solid var(--line);border-radius:23px;background:#fff}.browser-save-dock{position:sticky;bottom:12px;display:grid;grid-template-columns:1fr 1.3fr auto;gap:8px;padding:10px;border-radius:20px;z-index:5}.browser-save-dock input{min-width:0;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.04);color:var(--text);padding:11px}.browser-privacy-strip{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px;padding:0 8px}

@media (max-width: 1020px) {
  .calendar-cosmos.view-week{grid-template-columns:repeat(2,1fr)}.calendar-cosmos.view-year{grid-template-columns:repeat(3,1fr)}
  .project-detail-hero{grid-template-columns:auto 1fr}.project-detail-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}.project-facts-grid{grid-template-columns:repeat(2,1fr)}
  .embedded-billing-hero{align-items:start;flex-direction:column}.billing-trust-row{grid-template-columns:1fr}
}
@media (max-width: 760px) {
  .verification-shell{grid-template-columns:1fr;gap:20px;padding-top:30px}.verification-orbit{width:240px}.verification-orbit>span{width:96px;font-size:43px;border-radius:28px}.verification-steps{grid-template-columns:1fr}.verification-copy{text-align:center}.verification-actions{justify-content:center}
  .workspace-subview-nav{grid-template-columns:repeat(2,1fr);position:static;margin-top:0}.workspace-subview-nav a{min-height:58px}
  .calendar-cosmos.view-week,.calendar-cosmos.view-month,.calendar-cosmos.view-year{grid-template-columns:1fr}.calendar-placeholder{display:none}.calendar-cosmos.view-month .calendar-period{min-height:auto}.calendar-cosmos.view-month .calendar-period>header{display:flex}.calendar-cosmos.view-month .calendar-events p{display:block}
  .ios-chat-layout{grid-template-columns:1fr}.chat-list{max-height:340px}.message-stream{max-height:none;min-height:600px}.chat-composer{grid-template-columns:1fr}.chat-composer .button{width:100%}
  .map-shell{grid-template-columns:1fr}.hyiyh-map{min-height:430px}.route-actions{grid-template-columns:1fr}
  .project-detail-hero{grid-template-columns:1fr;text-align:center}.project-detail-mark{margin:auto}.project-detail-actions{grid-template-columns:1fr}.project-facts-grid{grid-template-columns:1fr}.project-link-panel{align-items:start;flex-direction:column}
  .media-preview-stage{min-height:350px}.browser-save-dock{grid-template-columns:1fr}.browser-privacy-strip{flex-direction:column}.internal-browser-frame{height:65vh;min-height:420px}
}
@media (prefers-reduced-motion: reduce) { .billing-loading span,.verification-orbit i{animation:none!important}.workspace-subview-nav a{transition:none!important} }
.studio-safety-strip{display:flex;align-items:center;gap:10px;padding:11px 14px;margin:10px 0;border-radius:16px;background:var(--experience-accent-soft);color:var(--muted);font-size:11px}.studio-safety-strip span{color:var(--experience-accent);font-size:20px}.studio-safety-strip p{margin:0}
.account-create-panel,.feed-create-panel{padding:22px;border-radius:28px;margin:-24px 0 18px}.account-create-panel[hidden],.feed-create-panel[hidden]{display:none}.account-create-panel .create-grid,.feed-create-panel .create-grid{margin:0}

/* Selected profile mirrors the native profile switcher without introducing script state. */
.profile-selector-card.active-profile {
  border-color: rgba(134, 209, 255, .72);
  box-shadow: 0 20px 60px rgba(53, 170, 255, .20), inset 0 0 0 1px rgba(255, 255, 255, .08);
}
.profile-selector-card.active-profile::before {
  content: "Active profile";
  display: inline-flex;
  width: max-content;
  padding: .28rem .58rem;
  border-radius: 999px;
  color: #03131d;
  background: linear-gradient(135deg, #86d1ff, #d9f2ff);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}


/* Checkout cart, calendar summary, and RSS gallery refinements — 2026-08-01 */
.product-cart-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:1rem;align-items:start}.product-cart-card{display:grid;grid-template-columns:minmax(120px,220px) 1fr;gap:1rem;align-items:center}.product-cart-card .product-image{min-height:190px}.product-cart-summary{display:grid;gap:.85rem;position:sticky;top:6rem}.product-cart-summary label{display:grid;gap:.4rem}.product-cart-summary select{width:100%;background:rgba(255,255,255,.06);color:inherit;border:1px solid rgba(134,209,255,.22);border-radius:14px;padding:.75rem}.cart-price-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem 0;border-bottom:1px solid rgba(255,255,255,.08)}.cart-price-row.total{font-size:1.08rem;border-bottom:0}.calendar-summary-strip{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.calendar-summary-strip>div{display:grid;gap:.2rem;min-width:0}.calendar-summary-strip b{font-size:1.05rem;text-transform:capitalize}.calendar-summary-strip span{color:var(--muted);font-size:.78rem;line-height:1.3}.rss-story-card h2 a{color:inherit;text-decoration:none}.rss-story-card h2 a:hover{color:var(--accent)}
@media(max-width:760px){.product-cart-layout{grid-template-columns:1fr}.product-cart-card{grid-template-columns:1fr}.product-cart-summary{position:static}.calendar-summary-strip{grid-template-columns:1fr}.calendar-summary-strip>div{grid-template-columns:auto 1fr;align-items:baseline;gap:.65rem}}


/* 2026-08-02 targeted cart, Profile chat, RSS, calendar, and map parity patch */
.product-cart-layout.multi-cart-layout{grid-template-columns:minmax(0,1.5fr) minmax(290px,.5fr)}
.product-cart-lines{display:grid;gap:1rem}.multi-cart-layout .product-cart-card{grid-template-columns:150px minmax(0,1fr) auto}.cart-line-copy{min-width:0}.cart-line-actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}.cart-line-actions form{display:flex;align-items:end;gap:.55rem}.cart-line-actions label{display:grid;gap:.3rem}.cart-line-actions select,.map-tools input,.map-tools select{background:rgba(255,255,255,.06);color:inherit;border:1px solid rgba(134,209,255,.22);border-radius:12px;padding:.68rem}.cart-line-price{display:grid;justify-items:end;gap:.3rem;white-space:nowrap}.cart-line-price span{color:var(--muted);font-size:.78rem}.cart-line-price strong{font-size:1.1rem}.button.danger{border-color:rgba(255,112,112,.45);color:#ffb3b3}.membership-existing{display:grid;gap:.6rem}.membership-existing>span{font-weight:800;color:var(--accent)}
.chat-profile-modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:1rem}.chat-profile-modal[hidden]{display:none}.chat-profile-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}.chat-profile-dialog{position:relative;z-index:1;width:min(520px,100%);padding:1.4rem;display:grid;gap:.9rem}.chat-profile-close{position:absolute;right:.8rem;top:.7rem;border:0;background:transparent;color:inherit;font-size:1.8rem}.chat-profile-dialog .compact-form{display:grid;grid-template-columns:1fr auto;gap:.7rem;align-items:end}.chat-profile-dialog label{display:grid;gap:.4rem}.dialog-open{overflow:hidden}
.rss-story-image{display:block;aspect-ratio:16/9;border-radius:16px;overflow:hidden;margin-bottom:.85rem;background:rgba(255,255,255,.04)}.rss-story-image img{width:100%;height:100%;object-fit:cover;display:block}.calendar-period h2 a{color:inherit;text-decoration:none}.calendar-period h2 a:hover{color:var(--accent)}
.map-tools{display:grid;grid-template-columns:minmax(260px,1.7fr) repeat(3,minmax(150px,.7fr)) auto;gap:.7rem;align-items:end;margin-bottom:1rem}.map-tools label{display:grid;gap:.35rem;font-size:.78rem;color:var(--muted)}.map-search-form{display:grid;grid-template-columns:1fr auto;gap:.6rem;align-items:end}.map-search-form label{display:grid;gap:.35rem}.map-popup{display:grid;gap:.35rem;min-width:190px}.map-popup>div{display:flex;flex-wrap:wrap;gap:.45rem}.map-popup a{font-weight:700}.map-place-grid article[hidden]{display:none}.map-place-grid article small{color:var(--muted)}.map-shell.map-fullscreen{position:fixed;inset:0;z-index:250;border-radius:0;margin:0;padding:1rem;grid-template-columns:minmax(0,1fr) minmax(280px,360px)}.map-shell.map-fullscreen .hyiyh-map{min-height:calc(100vh - 2rem)}.map-fullscreen-open{overflow:hidden}
@media(max-width:980px){.map-tools{grid-template-columns:1fr 1fr}.map-search-form{grid-column:1/-1}.multi-cart-layout .product-cart-card{grid-template-columns:120px minmax(0,1fr)}.cart-line-price{grid-column:2;justify-items:start}}
@media(max-width:700px){.product-cart-layout.multi-cart-layout{grid-template-columns:1fr}.multi-cart-layout .product-cart-card{grid-template-columns:1fr}.cart-line-price{grid-column:auto;justify-items:start}.cart-line-actions,.cart-line-actions form{align-items:stretch}.cart-line-actions form{width:100%;display:grid;grid-template-columns:1fr auto}.map-tools{grid-template-columns:1fr}.map-search-form{grid-template-columns:1fr}.map-shell.map-fullscreen{grid-template-columns:1fr;overflow:auto}.chat-profile-dialog .compact-form{grid-template-columns:1fr}}


/* 2026-08-02 membership-management and compact RSS thumbnail patch */
.rss-story-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;align-items:start}
.rss-story-card{display:grid;gap:.8rem;min-width:0}.rss-story-heading{display:flex;gap:.8rem;align-items:flex-start;min-width:0}.rss-story-title{display:grid;gap:.3rem;min-width:0;flex:1}.rss-story-title>span{color:var(--muted);font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.rss-story-title h2{font-size:clamp(1rem,2vw,1.25rem);line-height:1.2;margin:0;overflow-wrap:anywhere}
.rss-story-image{display:block!important;flex:0 0 76px;width:76px!important;height:58px!important;aspect-ratio:auto!important;border-radius:10px!important;overflow:hidden;margin:0!important;background:rgba(255,255,255,.04)}.rss-story-image img{width:100%;height:100%;object-fit:cover;display:block}.rss-story-card>p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.5}.rss-story-actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.rss-story-actions .button{padding:.55rem .75rem;font-size:.78rem}
.membership-manage-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}.membership-manage-current{display:grid;gap:.25rem;min-width:220px;padding:1rem 1.15rem}.membership-manage-current span{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}.membership-manage-current strong{font-size:1.4rem}.membership-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.membership-choice-card{display:grid;gap:.8rem;align-content:start}.membership-choice-card.current{border-color:rgba(50,229,156,.5);opacity:1!important}.membership-choice-card.unavailable{opacity:.58}.membership-choice-heading{display:flex;justify-content:space-between;gap:.75rem;align-items:start}.membership-choice-heading span{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.07em}.membership-choice-heading h2{margin:.2rem 0 0}.membership-choice-price{font-weight:900;font-size:1.1rem;white-space:nowrap}.membership-choice-card form{margin-top:auto}.membership-choice-card .button{width:100%}.membership-management-footer{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-top:1rem}.membership-management-footer form{margin:0}
@media(max-width:700px){.rss-story-image{flex-basis:64px;width:64px!important;height:50px!important}.membership-manage-hero,.membership-management-footer{align-items:stretch;flex-direction:column}.membership-manage-current{min-width:0}}

/* 2026-08-03 targeted Marketplace, RSS, Calendar, Sponsor and billing patch */
.gallery-view-toggle{display:flex;gap:.35rem;justify-content:flex-end}.gallery-view-toggle button{border:1px solid rgba(134,209,255,.18);background:rgba(255,255,255,.035);color:var(--muted);padding:.58rem .8rem;border-radius:999px;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer}.gallery-view-toggle button.active{background:var(--experience-accent);color:#00131c;border-color:transparent}.marketplace-controls{display:grid;gap:1rem}.marketplace-masonry{columns:3 280px;display:block}.marketplace-masonry .marketplace-card{break-inside:avoid;margin:0 0 1rem;display:block}.marketplace-masonry .marketplace-image{min-height:180px;aspect-ratio:4/3;margin-bottom:1rem}.marketplace-card-body{display:grid;gap:.55rem}.marketplace-actions{display:flex;flex-wrap:wrap;gap:.5rem}.marketplace-grid.marketplace-list{columns:auto;display:grid;grid-template-columns:1fr}.marketplace-grid.marketplace-list .marketplace-card{display:grid;grid-template-columns:120px 1fr;align-items:center}.marketplace-grid.marketplace-list .marketplace-image{min-height:90px;height:100%;aspect-ratio:1}.marketplace-input-form{padding:clamp(1rem,3vw,2rem);display:grid;gap:1.25rem}.marketplace-input-form fieldset{border:1px solid rgba(134,209,255,.14);border-radius:22px;padding:1rem}.marketplace-input-form legend{padding:0 .5rem;font-weight:900;color:var(--experience-accent)}.marketplace-upload-preview{min-height:190px;border:1px dashed rgba(134,209,255,.3);border-radius:18px;display:grid;place-items:center;overflow:hidden;color:var(--muted)}.marketplace-upload-preview img{width:100%;height:100%;max-height:420px;object-fit:contain;background:#05070a}.checkbox-row{display:flex!important;align-items:center;gap:.65rem}.checkbox-row input{width:auto!important}.rss-gallery-heading,.rss-heading-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem}.rss-heading-actions{flex-wrap:wrap}.rss-beautiful-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}.rss-beautiful-grid .rss-story-card{padding:0;overflow:hidden;display:block;border-radius:24px}.rss-beautiful-grid .rss-story-image{width:100%!important;height:150px!important;border-radius:0!important;display:grid!important;place-items:center}.rss-story-placeholder{font-size:2rem;color:var(--experience-accent);background:radial-gradient(circle,var(--experience-accent-soft),transparent 65%)}.rss-story-content{padding:1rem;display:grid;gap:.75rem}.rss-story-content>p{margin:0;color:var(--muted);line-height:1.55}.rss-beautiful-grid.rss-list{grid-template-columns:1fr}.rss-beautiful-grid.rss-list .rss-story-card{display:grid;grid-template-columns:110px 1fr}.rss-beautiful-grid.rss-list .rss-story-image{height:100%!important;min-height:115px}.calendar-day-timeline{padding:1rem;display:grid}.calendar-hour-row{display:grid;grid-template-columns:82px 1px minmax(0,1fr);gap:1rem;min-height:68px;position:relative}.calendar-hour-row time{font-size:.78rem;color:var(--muted);text-align:right;padding-top:.15rem}.calendar-hour-line{background:rgba(134,209,255,.16)}.calendar-hour-events{display:grid;gap:.45rem;padding-bottom:.65rem}.calendar-hour-event{display:flex;gap:.7rem;align-items:center;padding:.75rem;border-radius:16px;background:rgba(255,255,255,.035);color:inherit;text-decoration:none}.calendar-hour-event>b{color:var(--experience-accent)}.calendar-hour-event span{display:grid}.calendar-hour-event small{color:var(--muted)}.calendar-period{position:relative}.calendar-period-hit{position:absolute;inset:0;z-index:0}.calendar-period>*:not(.calendar-period-hit){position:relative;z-index:1}.sponsor-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem}.sponsor-create-panel{padding:1rem;margin-bottom:1rem}.subscription-disclosure-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1.25rem}.subscription-disclosure-grid article,.membership-change-rules,.embedded-subscription-disclosure{padding:1.15rem}.subscription-disclosure-grid li{margin:.55rem 0;color:var(--muted);line-height:1.5}.subscription-consent-form{display:grid!important;gap:.7rem}.subscription-consent{display:flex;align-items:flex-start;gap:.55rem;font-size:.78rem;color:var(--muted);line-height:1.4}.subscription-consent input{margin-top:.18rem;flex:0 0 auto}
@media(max-width:800px){.marketplace-masonry{columns:2 240px}.subscription-disclosure-grid{grid-template-columns:1fr}.rss-gallery-heading{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.marketplace-masonry{columns:1}.marketplace-grid.marketplace-list .marketplace-card,.rss-beautiful-grid.rss-list .rss-story-card{grid-template-columns:82px 1fr}.calendar-hour-row{grid-template-columns:58px 1px minmax(0,1fr);gap:.55rem}.sponsor-heading{align-items:stretch;flex-direction:column}}