/* NOVA SHORTS — shared tokens + low-level helpers */@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800;900&family=Space+Grotesk:wght@300;400;500;600;700&display=swap');/* Theme presets exposed by [data-theme] on each phone */.nv { /* defaults = "Cosmic Purple" variant */ --nv-bg: #07060c; --nv-bg-2: #0d0a18; --nv-card: #110d20; --nv-card-2: #1a1530; --nv-line: rgba(180, 120, 255, 0.14); --nv-text: #f5f0ff; --nv-text-dim: #a89bbf; --nv-text-mute: #6a5f80; --nv-accent: #b478ff; --nv-accent-strong: #8b5cf6; --nv-accent-soft: rgba(180, 120, 255, 0.18); --nv-glow: 0 0 24px rgba(180, 120, 255, 0.35); --nv-radius-sm: 10px; --nv-radius: 18px; --nv-radius-lg: 24px; --nv-font: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic UI', system-ui, sans-serif; --nv-font-display: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', system-ui, sans-serif; --nv-font-num: 'Space Grotesk', 'Noto Sans JP', system-ui, sans-serif; /* Hero-art accents — used by ThumbArt swatches */ --nv-art-a: #b478ff; --nv-art-b: #6b3df2; --nv-art-c: #3a1b6e;}.nv[data-theme="aurora"] { --nv-bg: #02041a; --nv-bg-2: #060b29; --nv-card: #0a1138; --nv-card-2: #112050; --nv-line: rgba(0, 220, 255, 0.16); --nv-text: #eef7ff; --nv-text-dim: #8aa8cc; --nv-text-mute: #4f6a8a; --nv-accent: #00d4ff; --nv-accent-strong: #2b80ff; --nv-accent-soft: rgba(0, 212, 255, 0.18); --nv-glow: 0 0 28px rgba(0, 212, 255, 0.45); --nv-art-a: #00d4ff; --nv-art-b: #ff2d92; --nv-art-c: #0a1f4f;}.nv[data-theme="sakura"] { --nv-bg: #0d0309; --nv-bg-2: #16060f; --nv-card: #1d0913; --nv-card-2: #2a0e1f; --nv-line: rgba(255, 107, 157, 0.18); --nv-text: #fff0f5; --nv-text-dim: #cca9b6; --nv-text-mute: #7a5662; --nv-accent: #ff6b9d; --nv-accent-strong: #ff3d7f; --nv-accent-soft: rgba(255, 107, 157, 0.18); --nv-glow: 0 0 28px rgba(255, 107, 157, 0.4); --nv-art-a: #ff6b9d; --nv-art-b: #ff8b6b; --nv-art-c: #4a1430;}.nv[data-theme="ion"] { --nv-bg: #04130a; --nv-bg-2: #061d10; --nv-card: #082818; --nv-card-2: #0b3322; --nv-line: rgba(96, 255, 175, 0.16); --nv-text: #ecffe9; --nv-text-dim: #94c2a4; --nv-text-mute: #54775e; --nv-accent: #5cffaf; --nv-accent-strong: #20d680; --nv-accent-soft: rgba(96, 255, 175, 0.18); --nv-glow: 0 0 24px rgba(96, 255, 175, 0.4); --nv-art-a: #5cffaf; --nv-art-b: #1ed1ff; --nv-art-c: #08402a;}/* ─── base ──────────────────────────────────────────────────────────── */.nv { font-family: var(--nv-font); color: var(--nv-text); background: var(--nv-bg); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; letter-spacing: 0.005em;}.nv * { box-sizing: border-box; }.nv button { font-family: inherit; cursor: pointer; }.nv [data-num] { font-family: var(--nv-font-num); font-feature-settings: "tnum"; letter-spacing: -0.01em; }/* Landing-page container — production: full width with sensible cap on desktop */.nv-lp { width: 100%; max-width: 480px; margin: 0 auto; background: var(--nv-bg); position: relative; overflow: hidden;}.nv-lp img { max-width: 100%; display: block; }/* Star backdrop applied to dark sections */.nv-stars::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(1.2px 1.2px at 20% 18%, rgba(255,255,255,.55), transparent 60%), radial-gradient(1px 1px at 70% 36%, rgba(255,255,255,.4), transparent 60%), radial-gradient(1.6px 1.6px at 88% 12%, rgba(255,255,255,.6), transparent 60%), radial-gradient(1px 1px at 12% 64%, rgba(255,255,255,.35), transparent 60%), radial-gradient(1.3px 1.3px at 55% 82%, rgba(255,255,255,.5), transparent 60%), radial-gradient(1px 1px at 32% 92%, rgba(255,255,255,.35), transparent 60%), radial-gradient(1px 1px at 80% 70%, rgba(255,255,255,.45), transparent 60%), radial-gradient(1.4px 1.4px at 6% 30%, rgba(255,255,255,.45), transparent 60%);}/* Atmospheric glow blobs */.nv-aurora { position: absolute; inset: 0; pointer-events: none; overflow: hidden;}.nv-aurora::before, .nv-aurora::after { content: ""; position: absolute; border-radius: 50%; filter: blur(60px); opacity: 0.55;}.nv-aurora::before { width: 320px; height: 320px; background: radial-gradient(circle, var(--nv-art-a), transparent 70%); top: -120px; right: -80px;}.nv-aurora::after { width: 260px; height: 260px; background: radial-gradient(circle, var(--nv-art-b), transparent 70%); bottom: -100px; left: -80px; opacity: 0.4;}/* Logo */.nv-logo { font-family: var(--nv-font-display); font-weight: 900; letter-spacing: 0.32em; font-size: 22px; line-height: 1; background: linear-gradient(180deg, var(--nv-text) 0%, var(--nv-text) 60%, var(--nv-accent) 130%); -webkit-background-clip: text; background-clip: text; color: transparent;}.nv-logo-sub { font-family: var(--nv-font-num); font-weight: 500; letter-spacing: 0.55em; font-size: 9.5px; color: var(--nv-text-dim); margin-top: 4px; padding-left: 2px;}/* Primary button */.nv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 14px 22px; border-radius: 999px; border: 1px solid var(--nv-accent); background: transparent; color: var(--nv-text); font-weight: 600; font-size: 14px; letter-spacing: 0.04em; box-shadow: var(--nv-glow), inset 0 0 0 1px rgba(255,255,255,0.04); transition: transform .15s ease, background .15s ease;}.nv-btn-filled { background: linear-gradient(135deg, var(--nv-accent), var(--nv-accent-strong)); border-color: transparent; color: #fff;}.nv-btn-ghost { border-color: var(--nv-line); box-shadow: none; color: var(--nv-text-dim);}/* Card */.nv-card { background: linear-gradient(180deg, var(--nv-card) 0%, var(--nv-card-2) 100%); border: 1px solid var(--nv-line); border-radius: var(--nv-radius); position: relative; overflow: hidden;}/* Chip */.nv-chip { display: inline-flex; align-items: center; padding: 4px 9px; border-radius: 999px; font-size: 11px; font-weight: 500; color: var(--nv-accent); background: var(--nv-accent-soft); letter-spacing: 0.02em;}/* Hashtag */.nv-hash { font-size: 12px; color: var(--nv-accent); font-weight: 500;}/* Divider */.nv-divider { height: 1px; background: var(--nv-line); }/* Hero japanese type */.nv-display { font-family: var(--nv-font-display); font-weight: 800; font-size: 44px; line-height: 1.18; letter-spacing: -0.01em;}.nv-display em { font-style: normal; background: linear-gradient(120deg, var(--nv-accent), #fff 60%, var(--nv-accent)); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: nv-shine 6s ease-in-out infinite;}@keyframes nv-shine { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; }}/* Genre pill image */.nv-genre { position: relative; width: 92px; height: 116px; flex: 0 0 92px; border-radius: 14px; overflow: hidden;}.nv-genre-label { position: absolute; left: 8px; bottom: 8px; right: 8px; font-size: 11px; font-weight: 700; color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,0.6);}/* Feed tile */.nv-tile { position: relative; border-radius: 14px; overflow: hidden; background: var(--nv-card);}.nv-tile-play { position: absolute; left: 10px; bottom: 10px; font-size: 13px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 5px; text-shadow: 0 1px 3px rgba(0,0,0,0.6); font-family: var(--nv-font-num);}/* avatar */.nv-avatar { width: 22px; height: 22px; border-radius: 50%; flex: 0 0 22px; background: linear-gradient(135deg, var(--nv-accent), var(--nv-accent-strong));}/* Tab underline */.nv-tab { position: relative; padding-bottom: 8px; font-size: 15px; font-weight: 600;}.nv-tab[data-active="1"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--nv-accent); border-radius: 999px; box-shadow: 0 0 8px var(--nv-accent);}.nv-tab[data-active="0"] { color: var(--nv-text-dim); }/* small icon button */.nv-icon-btn { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--nv-line); background: transparent; color: var(--nv-text); display: inline-flex; align-items: center; justify-content: center;}/* Floating + button on bottom nav */.nv-fab { width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid var(--nv-accent); background: var(--nv-bg); display: inline-flex; align-items: center; justify-content: center; box-shadow: var(--nv-glow); color: var(--nv-accent); font-weight: 300; font-size: 22px; line-height: 1;}/* Bottom nav cell */.nv-navcell { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 10px; color: var(--nv-text-mute);}.nv-navcell[data-active="1"] { color: var(--nv-accent); }/* Section title */.nv-h2 { font-size: 26px; font-weight: 700; text-align: center; letter-spacing: 0.02em;}.nv-h2 em { font-style: normal; color: var(--nv-accent);}.nv-eyebrow { font-size: 11px; letter-spacing: 0.3em; color: var(--nv-text-dim); text-align: center; text-transform: uppercase;}