@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root { --night:#070b1d; --night-2:#0d1430; --ink:#eff5ff; --muted:#7f8eaf; --cyan:#56e0ff; --cyan-soft:#163a57; --violet:#a78bfa; --pink:#ff68b6; --gold:#ffcf5a; --green:#72e6a4; --glass:rgba(17,27,59,.76); --line:rgba(168,197,255,.16); --safe-top:env(safe-area-inset-top); --safe-bottom:env(safe-area-inset-bottom); --font:'Space Grotesk',ui-sans-serif,system-ui,sans-serif; --mono:'DM Mono',monospace; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; background:var(--night); color:var(--ink); font-family:var(--font); }
body { overflow-x:hidden; }
button,input { font:inherit; }
button { cursor:pointer; border:0; color:inherit; }
button:disabled { cursor:not-allowed; opacity:.42; }
.app-shell { min-height:100svh; max-width:720px; margin:auto; overflow:hidden; position:relative; background:radial-gradient(circle at 75% 0%, #14245a 0, transparent 38%), linear-gradient(155deg,#080b20 0%,#09132b 55%,#0b0c24 100%); }
.app-shell::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.25; background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:36px 36px; mask-image:linear-gradient(to bottom,black,transparent 80%); }
.ambient { position:absolute; border-radius:50%; filter:blur(16px); opacity:.28; pointer-events:none; }
.ambient-one { width:240px; height:240px; background:#1958e8; top:-100px; left:-100px; }
.ambient-two { width:200px; height:200px; background:#af2f95; right:-100px; top:43%; }
.screen { min-height:100svh; display:none; position:relative; padding:calc(22px + var(--safe-top)) 18px calc(100px + var(--safe-bottom)); animation:screen-in .45s ease both; }
.screen.active { display:block; }
.home-screen { padding:calc(22px + var(--safe-top)) 22px 24px; display:none; flex-direction:column; }
.home-screen.active { display:flex; }
@keyframes screen-in { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:none } }
.home-topline,.home-footer,.board-meta,.card-label,.topbar-kicker,.eyebrow,.section-heading,.live-label,.turn-badge,.action-status { font-family:var(--mono); letter-spacing:.13em; font-size:10px; text-transform:uppercase; }
.home-topline { color:#9daccc; display:flex; align-items:center; gap:8px; z-index:1; }.version { margin-left:auto; color:#46557a; }
.status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 12px var(--green); vertical-align:middle; }
.hero-art { height:245px; position:relative; margin:16px -22px -2px; overflow:hidden; }.moon { position:absolute; width:116px; height:116px; border-radius:50%; right:27%; top:40px; background:radial-gradient(circle at 35% 35%,#ecf9ff,#8cc9ff 48%,#4e70c8 100%); box-shadow:0 0 50px #5dc7ff66; }.orbit { position:absolute; border:1px solid #60d9ff32; border-radius:50%; transform:rotate(-18deg); }.orbit-a { width:265px; height:80px; top:63px; left:14%; }.orbit-b { width:310px; height:110px; top:30px; left:6%; transform:rotate(22deg); }.skyline { position:absolute; display:flex; align-items:end; gap:5px; bottom:0; width:110%; left:-5%; }.skyline i { display:block; width:12%; min-width:30px; background:linear-gradient(180deg,#162b60,#0b1635); border-top:1px solid #4a98cb66; position:relative; }.skyline i::before,.skyline i::after { content:""; position:absolute; inset:12px 7px auto; height:2px; background:var(--cyan); box-shadow:0 20px var(--pink),0 40px var(--gold); opacity:.5; }.skyline-back { opacity:.45; transform:scale(1.08); }.skyline-back i:nth-child(1){height:60px}.skyline-back i:nth-child(2){height:108px}.skyline-back i:nth-child(3){height:76px}.skyline-back i:nth-child(4){height:138px}.skyline-back i:nth-child(5){height:92px}.skyline-back i:nth-child(6){height:125px}.skyline-back i:nth-child(7){height:70px}.skyline-front i:nth-child(1){height:55px}.skyline-front i:nth-child(2){height:96px}.skyline-front i:nth-child(3){height:72px}.skyline-front i:nth-child(4){height:124px}.skyline-front i:nth-child(5){height:80px}.skyline-front i:nth-child(6){height:104px}.floating-coin { position:absolute; display:grid; place-items:center; width:28px; height:28px; border:1px solid #ffe69a99; color:var(--gold); border-radius:50%; background:#ffcf5a22; box-shadow:0 0 20px #ffcf5a55; font-family:var(--mono); animation:float 4s ease-in-out infinite; }.coin-a{left:14%;top:50px}.coin-b{right:11%;top:115px;animation-delay:-1.5s;color:var(--pink);border-color:#ff68b699}.coin-c{left:36%;top:12px;animation-delay:-3s}.home-copy { z-index:1; }.eyebrow { color:var(--cyan); margin:0 0 9px; }.home-copy h1 { margin:0; font-size:clamp(58px,17vw,100px); line-height:.82; letter-spacing:-.08em; font-weight:700; text-shadow:0 12px 40px #56e0ff33; }.home-copy h1 em { font-style:normal; color:var(--gold); }.tagline { color:#aab7d4; font-size:14px; margin:17px 0 22px; letter-spacing:.04em; }
.glass-card { background:linear-gradient(135deg,rgba(25,39,82,.82),rgba(12,21,49,.76)); border:1px solid var(--line); box-shadow:0 18px 50px #0003, inset 0 1px #ffffff0c; backdrop-filter:blur(18px); border-radius:20px; }.home-actions { padding:18px; }.field-label { display:block; color:#91a3c7; font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:8px; }.text-input { width:100%; height:48px; border:1px solid #a5c0ef2b; border-radius:12px; color:var(--ink); background:#07102699; padding:0 14px; outline:none; transition:.2s; }.text-input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px #56e0ff1c; }.text-input::placeholder { color:#647493; }.button-row,.join-row { display:flex; gap:10px; margin-top:12px; }.button { min-height:48px; border-radius:12px; padding:0 17px; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:600; font-size:13px; transition:transform .2s,box-shadow .2s,background .2s; }.button:active { transform:scale(.96); }.button-primary { color:#071022; background:linear-gradient(135deg,#f8d476,#ff9e72); box-shadow:0 8px 20px #ffb4512e; }.button-primary:hover { box-shadow:0 12px 28px #ffb45155; transform:translateY(-1px); }.button-secondary { color:#c8d5f3; background:#21325c99; border:1px solid #aac8ff1c; }.button-row .button { flex:1; }.join-inline { margin-top:16px; padding-top:16px; border-top:1px solid var(--line); }.join-row .button { min-width:74px; }.room-input { letter-spacing:.22em; font-family:var(--mono); text-transform:uppercase; }.home-footer { display:flex; align-items:center; gap:10px; color:#526185; margin-top:auto; padding-top:24px; }.footer-line { height:1px; flex:1; background:#405276; opacity:.5; }
.topbar,.game-topbar { display:flex; align-items:center; gap:14px; }.topbar h2,.game-topbar h2 { margin:3px 0 0; font-size:20px; letter-spacing:-.04em; }.icon-button { width:40px; height:40px; border-radius:12px; background:#17254a99; border:1px solid var(--line); font-size:20px; }.topbar .code-chip { margin-left:auto; }.code-chip { padding:7px 10px 6px; border-radius:12px; border:1px solid #ffcf5a55; color:var(--gold); background:#ffcf5a0d; font-family:var(--mono); letter-spacing:.12em; }.code-chip small { display:block; color:#8390aa; font-family:var(--font); font-size:9px; letter-spacing:0; margin-top:3px; }.lobby-content { margin-top:24px; }.lobby-hero { display:flex; justify-content:space-between; align-items:center; padding:18px; }.lobby-hero h3 { margin:3px 0 8px; font-size:22px; }.muted { color:var(--muted); font-size:12px; margin:0; }.big-room-code { color:var(--gold); font:500 22px var(--mono); letter-spacing:.16em; }.section-heading { display:flex; justify-content:space-between; align-items:center; margin:24px 3px 10px; color:#adc1eb; }.section-heading span:first-child { display:flex; align-items:center; gap:10px; }.section-heading b { font-family:var(--font); letter-spacing:0; text-transform:none; font-size:15px; color:var(--ink); }.section-heading small { color:#667698; font-size:10px; }.live-label { color:var(--green); font-size:9px; letter-spacing:.12em; }.player-seats { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }.seat { min-height:74px; border:1px solid var(--line); border-radius:15px; background:#111e4199; padding:12px; display:flex; align-items:center; gap:10px; position:relative; overflow:hidden; animation:pop-in .4s ease both; }.seat::after { content:""; position:absolute; width:55px; height:55px; border-radius:50%; right:-25px; bottom:-25px; background:var(--seat-color); opacity:.14; filter:blur(3px); }.seat-avatar { width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:color-mix(in srgb,var(--seat-color),transparent 76%); color:var(--seat-color); border:1px solid color-mix(in srgb,var(--seat-color),transparent 55%); font-weight:700; }.seat-name { font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.seat-meta { font:9px var(--mono); color:#7483a6; margin-top:4px; }.host-tag { color:var(--gold); }.empty-seat { border-style:dashed; background:#0d173388; color:#526486; display:flex; align-items:center; justify-content:center; font:10px var(--mono); letter-spacing:.1em; }.lobby-tip { display:flex; gap:10px; align-items:flex-start; margin:17px 2px 18px; color:#8291b1; font-size:11px; line-height:1.5; }.tip-icon { color:var(--cyan); }.button-large { width:100%; height:56px; font-size:14px; }.game-topbar { position:relative; }.brand-lockup { display:flex; align-items:center; gap:9px; }.brand-mark { color:var(--gold); font-size:24px; text-shadow:0 0 20px var(--gold); }.game-topbar .icon-button { margin-left:auto; font-size:16px; }.turn-badge { display:flex; gap:5px; align-items:baseline; color:var(--muted); margin-left:auto; }.turn-badge strong { color:var(--gold); font-size:17px; }.turn-badge small { color:#556487; }.game-content { margin-top:16px; }.player-strip { display:flex; gap:7px; overflow-x:auto; padding:2px 0 14px; scrollbar-width:none; }.player-strip::-webkit-scrollbar { display:none; }.mini-player { flex:0 0 auto; min-width:106px; padding:9px 10px; border:1px solid var(--line); border-radius:13px; background:#101d4199; position:relative; }.mini-player.active { border-color:var(--gold); box-shadow:0 0 18px #ffcf5a22; }.mini-player.me { background:#17355a99; }.mini-player-top { display:flex; align-items:center; gap:6px; font-size:11px; }.mini-dot { width:8px;height:8px;border-radius:50%; background:var(--player-color); box-shadow:0 0 8px var(--player-color); }.mini-cash { color:var(--gold); font:10px var(--mono); margin-top:6px; }.board-shell { border-radius:23px; border:1px solid #a4c5ff1c; background:linear-gradient(145deg,#091a34e8,#111238e5); box-shadow:0 18px 45px #0005, inset 0 1px #fff1; overflow:hidden; }.board-meta { padding:11px 14px; display:flex; justify-content:space-between; align-items:center; color:#6e81ab; }.board-meta i { margin-right:5px; }.mini-button { padding:5px 8px; border-radius:7px; color:#9eb2dc; background:#22345e; font:10px var(--mono); }.board-viewport { height:clamp(355px,70vw,490px); overflow:auto; position:relative; cursor:grab; scroll-behavior:smooth; background:radial-gradient(circle at 50% 50%,#173f5e55,transparent 59%),#091429; }.board-viewport:active { cursor:grabbing; }.city-board { width:calc(100% - 30px); max-width:510px; min-width:325px; aspect-ratio:1; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; grid-template-columns:repeat(10,1fr); grid-template-rows:repeat(10,1fr); gap:4px; padding:10px; border:1px solid #5e9aca3b; background:linear-gradient(135deg,#10334a,#111b47); border-radius:28px; box-shadow:0 0 0 7px #102a4422,0 0 50px #56e0ff18; }.board-viewport::before { content:"CITY / 36"; position:absolute; font:10px var(--mono); color:#69a2c477; top:50%; left:50%; transform:translate(-50%,-50%); letter-spacing:.18em; }.board-cell { min-width:0; border-radius:6px; border:1px solid #7ca5cd2a; background:#132447dd; padding:4px 3px; position:relative; overflow:visible; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:#b7c8e7; font-size:clamp(7px,1.8vw,10px); line-height:1.08; transition:.25s; }.board-cell.special { background:linear-gradient(145deg,#182f59dd,#192148dd); }.board-cell .cell-emoji { color:var(--cell-color,#80bfff); font-size:clamp(12px,3.2vw,19px); margin-bottom:2px; }.board-cell .cell-name { overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }.board-cell .cell-price { color:var(--gold); font:7px var(--mono); margin-top:2px; }.board-cell .cell-level { color:var(--green); font:7px var(--mono); }.board-cell.owner-p1,.board-cell.owner-p2,.board-cell.owner-p3,.board-cell.owner-p4,.board-cell.owner-p5 { border-color:var(--owner-color); background:linear-gradient(145deg,color-mix(in srgb,var(--owner-color),#102344 85%),#102041); }.board-cell.active-cell { animation:cell-pulse 1.4s ease infinite; border-color:var(--gold); box-shadow:0 0 14px #ffcf5a66; }.board-cell.current-cell { z-index:2; }.board-token { position:absolute; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font:700 9px var(--font); color:#061023; background:var(--player-color); box-shadow:0 3px 10px #0008,0 0 10px var(--player-color); border:2px solid #fff9; z-index:4; top:-8px; right:-7px; animation:token-bob 2s ease-in-out infinite; }.board-token:nth-child(2){right:10px;top:-8px}.board-token:nth-child(3){right:-7px;top:14px}.board-cell:nth-child(1){grid-area:10/1/11/2}.board-cell:nth-child(2){grid-area:10/2/11/3}.board-cell:nth-child(3){grid-area:10/3/11/4}.board-cell:nth-child(4){grid-area:10/4/11/5}.board-cell:nth-child(5){grid-area:10/5/11/6}.board-cell:nth-child(6){grid-area:10/6/11/7}.board-cell:nth-child(7){grid-area:10/7/11/8}.board-cell:nth-child(8){grid-area:10/8/11/9}.board-cell:nth-child(9){grid-area:10/9/11/10}.board-cell:nth-child(10){grid-area:10/10/11/11}.board-cell:nth-child(11){grid-area:9/10/10/11}.board-cell:nth-child(12){grid-area:8/10/9/11}.board-cell:nth-child(13){grid-area:7/10/8/11}.board-cell:nth-child(14){grid-area:6/10/7/11}.board-cell:nth-child(15){grid-area:5/10/6/11}.board-cell:nth-child(16){grid-area:4/10/5/11}.board-cell:nth-child(17){grid-area:3/10/4/11}.board-cell:nth-child(18){grid-area:2/10/3/11}.board-cell:nth-child(19){grid-area:1/10/2/11}.board-cell:nth-child(20){grid-area:1/9/2/10}.board-cell:nth-child(21){grid-area:1/8/2/9}.board-cell:nth-child(22){grid-area:1/7/2/8}.board-cell:nth-child(23){grid-area:1/6/2/7}.board-cell:nth-child(24){grid-area:1/5/2/6}.board-cell:nth-child(25){grid-area:1/4/2/5}.board-cell:nth-child(26){grid-area:1/3/2/4}.board-cell:nth-child(27){grid-area:1/2/2/3}.board-cell:nth-child(28){grid-area:1/1/2/2}.board-cell:nth-child(29){grid-area:2/1/3/2}.board-cell:nth-child(30){grid-area:3/1/4/2}.board-cell:nth-child(31){grid-area:4/1/5/2}.board-cell:nth-child(32){grid-area:5/1/6/2}.board-cell:nth-child(33){grid-area:6/1/7/2}.board-cell:nth-child(34){grid-area:7/1/8/2}.board-cell:nth-child(35){grid-area:8/1/9/2}.board-cell:nth-child(36){grid-area:9/1/10/2}.current-property { min-height:59px; margin-top:12px; padding:12px 14px; display:flex; align-items:center; gap:12px; }.current-property:empty { display:none; }.property-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; color:var(--cell-color); background:color-mix(in srgb,var(--cell-color),transparent 82%); font-size:18px; }.property-info { min-width:0; flex:1; }.property-info strong { display:block; font-size:13px; }.property-info small { color:#7f91b5; font-size:10px; }.property-value { color:var(--gold); font:11px var(--mono); text-align:right; }.dashboard-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }.wealth-card,.goal-card { padding:13px; min-height:93px; }.card-label { color:#7f93bd; font-size:9px; display:flex; justify-content:space-between; }.card-label span { color:var(--cyan); }.wealth-card>strong { display:block; color:var(--gold); font:500 clamp(18px,5vw,26px) var(--mono); margin:10px 0 6px; }.asset-line { display:flex; justify-content:space-between; color:#7283a5; font-size:10px; }.asset-line b { color:#b8c8e4; font:10px var(--mono); }.goal-card>strong { display:block; margin:9px 0; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.goal-progress { height:4px; border-radius:5px; background:#26355a; overflow:hidden; }.goal-progress i { display:block; height:100%; width:14%; background:linear-gradient(90deg,var(--pink),var(--gold)); border-radius:inherit; transition:width .6s; }.action-dock { position:fixed; z-index:10; bottom:0; left:50%; transform:translateX(-50%); width:min(720px,100%); padding:8px 18px calc(12px + var(--safe-bottom)); background:linear-gradient(180deg,#0a1125dd,#080c1eee 30%); border-top:1px solid #9fb8e32b; backdrop-filter:blur(20px); }.dock-handle { width:34px; height:3px; border-radius:4px; background:#6d83ac; margin:0 auto 8px; opacity:.6; }.action-status { color:#9db0d5; margin:0 0 8px 2px; font-size:9px; }.action-buttons { display:flex; gap:8px; }.action-buttons .button { flex:1; min-height:48px; padding:0 10px; font-size:12px; }.button.action-main { background:linear-gradient(135deg,var(--cyan),#6ba9ff); }.button.action-gold { background:linear-gradient(135deg,#ffe38c,#ffae62); }.button.action-soft { background:#253762; color:#c8d7f5; }
.event-banner { padding:11px 14px; border:1px solid #ff68b655; background:linear-gradient(90deg,#4e1f6088,#171e4a99); border-radius:14px; margin-bottom:10px; animation:banner-in .5s ease both; font-size:12px; }.event-banner strong { color:var(--pink); margin-right:7px; }.modal-layer { position:fixed; z-index:30; inset:0; display:grid; align-items:end; }.modal-layer[hidden] { display:none; }.modal-backdrop { position:absolute; inset:0; background:#020510aa; backdrop-filter:blur(4px); }.modal-sheet { position:relative; width:min(100%,560px); margin:0 auto; padding:22px 18px calc(22px + var(--safe-bottom)); border-radius:25px 25px 0 0; animation:sheet-up .32s ease both; }.modal-sheet h3 { margin:0 0 7px; font-size:22px; }.modal-sheet p { color:#99a9c9; font-size:13px; line-height:1.5; }.modal-actions { display:flex; gap:9px; margin-top:18px; }.modal-actions .button { flex:1; }.modal-close { position:absolute; top:16px; right:16px; color:#9aabca; background:#ffffff0d; border-radius:9px; width:32px; height:32px; }.bid-row,.trade-row { display:flex; gap:9px; margin-top:15px; }.bid-row .text-input { flex:1; }.ranking { margin-top:15px; display:grid; gap:8px; }.ranking-row { display:flex; justify-content:space-between; align-items:center; padding:11px 12px; border-radius:11px; background:#0a1532aa; }.ranking-row strong { color:var(--gold); font:12px var(--mono); }.toast-region { position:fixed; z-index:50; top:calc(14px + var(--safe-top)); left:50%; transform:translateX(-50%); width:min(calc(100% - 36px),480px); display:grid; gap:8px; pointer-events:none; }.toast { padding:12px 14px; border-radius:12px; background:#17274ddd; border:1px solid #91b6e855; box-shadow:0 10px 28px #0006; font-size:12px; color:#e8f0ff; animation:toast-in .3s ease both; }.toast.error { border-color:#ff6eaa99; }.fx-layer { position:fixed; inset:0; z-index:20; pointer-events:none; overflow:hidden; }.fx-text { position:absolute; color:var(--gold); font:700 20px var(--mono); text-shadow:0 2px 12px #ffae00; animation:float-up 1.1s ease both; }.fx-coin { position:absolute; width:12px; height:12px; border-radius:50%; background:var(--gold); box-shadow:0 0 10px var(--gold); animation:coin-fly 1s cubic-bezier(.2,.7,.2,1) both; }.news-fx { position:absolute; inset:20% 8% auto; padding:22px; border:1px solid var(--pink); background:#241344dd; border-radius:20px; text-align:center; box-shadow:0 0 70px #ff68b655; animation:news-in .8s ease both; }.news-fx strong { display:block; color:var(--pink); font-size:22px; }.news-fx span { display:block; color:#d3c4ed; margin-top:8px; font-size:12px; }
@keyframes float { 0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-12px) rotate(8deg)} } @keyframes pop-in { from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none} } @keyframes cell-pulse { 50%{transform:scale(1.05);box-shadow:0 0 22px #ffcf5a99} } @keyframes token-bob { 50%{transform:translateY(-3px)} } @keyframes banner-in { from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:none} } @keyframes sheet-up { from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none} } @keyframes toast-in { from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none} } @keyframes float-up { from{opacity:0;transform:translate(-50%,10px) scale(.7)}20%{opacity:1}to{opacity:0;transform:translate(-50%,-65px) scale(1.2)} } @keyframes coin-fly { from{opacity:1;transform:translate(0,0) scale(1)}to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(360deg) scale(.3)} } @keyframes news-in { from{opacity:0;transform:translateY(-30px) scale(.8)}to{opacity:1;transform:none} }
@media (min-width:600px) { .home-screen { padding-left:42px; padding-right:42px; }.hero-art { margin-left:-42px; margin-right:-42px; }.screen { padding-left:28px; padding-right:28px; }.player-seats { grid-template-columns:repeat(3,1fr); }.action-dock { padding-left:28px; padding-right:28px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; } }
.reduced-motion *, .reduced-motion *::before, .reduced-motion *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
.board-cell .cell-building { color:var(--gold); font-size:clamp(10px,2.6vw,15px); letter-spacing:-.16em; text-shadow:0 0 8px var(--gold); animation:building-glow 2s ease-in-out infinite; }
@keyframes building-glow { 50% { transform:translateY(-2px); text-shadow:0 0 15px var(--gold); } }