:root{--gold: #b9954f;--gold-bright: #d6b25e;--gold-gradient: linear-gradient(155deg, #d8bd7a, #b08a3e 50%, #7c5f27);--gold-glow: 0 0 18px rgba(185, 149, 79, .3);--bg-deep: #0d0819;--bg-velvet: #160c28;--panel: rgba(30, 17, 52, .5);--panel-raised: linear-gradient(180deg, rgba(45, 26, 74, .5), rgba(18, 10, 31, .4));--line: rgba(200, 162, 78, .22);--line-strong: rgba(214, 178, 94, .7);--ink: #efe3c6;--ink-soft: #cdbfe0;--ink-muted: #a99cbb;--ink-faint: #8f82a0;--serif: "Playfair Display", Georgia, serif;--serif-body: "Cormorant Garamond", Georgia, serif;--sans: "Manrope", system-ui, -apple-system, sans-serif;--mono: ui-monospace, SFMono-Regular, Menlo, monospace;--safe-bottom: env(safe-area-inset-bottom, 0px)}:root[data-gold=glow]{--gold: #e6c874;--gold-gradient: linear-gradient(155deg, #ffe9a8, #d9b45a 50%, #b98f36);--gold-glow: 0 0 30px rgba(230, 200, 116, .5)}:root[data-gold=metallic]{--gold: #cbb06a;--gold-gradient: linear-gradient(120deg, #f6e7b0, #b48f3c 42%, #8a6a28 58%, #e3cd8a);--gold-glow: 0 0 22px rgba(203, 176, 106, .4)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}html{background:#0b0714}body{margin:0;background-color:#0b0714;background-image:radial-gradient(circle at 50% 20%,#241241,#0b0714 70%);color:var(--ink);font-family:var(--sans);overscroll-behavior-y:none}::-webkit-scrollbar{width:0;height:0}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}@keyframes tw{0%,to{opacity:.15}50%{opacity:.85}}@keyframes fu{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes mpulse{0%,to{box-shadow:0 6px 22px #00000080,0 0 #d6b25e59}50%{box-shadow:0 6px 22px #00000080,0 0 22px 2px #d6b25e47}}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes cardpulse{0%,to{opacity:.55;transform:rotate(45deg) scale(1)}50%{opacity:1;transform:rotate(45deg) scale(1.08)}}@keyframes shim{0%{background-position:-160px 0}to{background-position:220px 0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.app{position:relative;display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:480px;margin:0 auto;background:var(--bg-deep);overflow:hidden}.app__body{position:relative;z-index:2;flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}.starfield{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.starfield i{position:absolute;border-radius:50%;background:#e9d9a8;animation:tw 3s ease-in-out infinite}:root{--tg-inset-top: env(safe-area-inset-top, 0px);--tg-inset-bottom: env(safe-area-inset-bottom, 0px);--tg-inset-left: env(safe-area-inset-left, 0px);--tg-inset-right: env(safe-area-inset-right, 0px)}.header{position:relative;z-index:3;height:calc(50px + var(--tg-inset-top));padding-top:var(--tg-inset-top);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding-left:calc(12px + var(--tg-inset-left));padding-right:calc(12px + var(--tg-inset-right));background:linear-gradient(180deg,#120a1ff5,#120a1fb3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(200,162,78,.14)}.header__side{width:64px;display:flex}.header__side--end{justify-content:flex-end}.header__title{font-family:var(--serif);font-style:italic;font-size:16px;letter-spacing:.3px}.header__back{display:flex;align-items:center;font-size:20px;line-height:1;color:var(--gold);padding:4px 8px 6px 0}.lang-toggle{font-size:10.5px;font-weight:700;letter-spacing:.5px;color:var(--gold);border:1px solid rgba(200,162,78,.4);border-radius:20px;padding:4px 9px}.progress{position:relative;z-index:3;height:3px;flex-shrink:0;background:#c8a24e1f}.progress__fill{height:100%;background:var(--gold-gradient);transition:width .5s ease;box-shadow:0 0 10px #d6b25e99}.eyebrow{font-family:var(--mono);font-size:9px;letter-spacing:3px;color:var(--gold);text-transform:uppercase}.title{font-family:var(--serif);font-style:italic;font-weight:700;font-size:27px;margin:8px 0 4px;line-height:1.15}.subtitle{font-family:var(--serif-body);font-size:16px;color:var(--ink-muted);margin:0 0 20px}.prose{font-family:var(--serif-body);font-size:17px;line-height:1.5;color:var(--ink-soft);margin:0}.screen{padding:20px 22px 26px;animation:fu .45s both}.pick{border-radius:14px;border:1px solid rgba(200,162,78,.2);background:var(--panel);transition:border-color .25s,background .25s;text-align:left;width:100%}.pick[aria-pressed=true],.pick[data-selected=true]{border-color:var(--line-strong);background:#4a2c1466}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:11px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.stack{display:flex;flex-direction:column;gap:12px}.bottom{position:relative;z-index:3;flex-shrink:0;padding-bottom:max(6px,calc(var(--safe-bottom) - 20px));background:#0d0819fa;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.tabs{display:flex;justify-content:space-around;padding:8px 6px 6px;background:linear-gradient(0deg,#0d0819fa,#0d0819b3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid rgba(200,162,78,.14)}.tabs button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 0;color:var(--ink-faint)}.tabs button[aria-current=page]{color:var(--gold)}.tabs .tab__sym{font-size:19px;line-height:1}.tabs .tab__label{font-size:9.5px;font-weight:600}.mainbutton{padding:10px 16px;background:linear-gradient(0deg,#0d0819fa,#0d0819db);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.mainbutton button{width:100%;text-align:center;padding:15px;border-radius:14px;font-size:15px;font-weight:700;letter-spacing:.3px;color:#160c28;background:var(--gold-gradient);animation:mpulse 3.6s ease-in-out infinite}.mainbutton button:active{transform:scale(.985)}.mainbutton button:disabled{opacity:.5;animation:none}.card{width:100%;height:100%;position:relative;border-radius:12px;overflow:hidden;background:linear-gradient(158deg,#251639,#140a25);box-shadow:0 8px 22px #0000008c,inset 0 0 0 1px #c8a24e80;font-family:var(--serif-body)}.card__face{position:absolute;top:0;right:0;bottom:0;left:0;padding:6px;display:flex;flex-direction:column}.card__art{flex:1;min-height:0;border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative}.card__art--framed{border:1px solid rgba(200,162,78,.45);background:repeating-linear-gradient(45deg,rgba(200,162,78,.06) 0 5px,transparent 5px 11px)}.card__art--ornament{background:radial-gradient(circle at 50% 44%,#d6b25e3d,#140a1f00 62%)}.card__art--classic{border:1px solid rgba(200,162,78,.3);background:repeating-linear-gradient(115deg,#ffffff09 0,#ffffff09 3px,#0000 3px,#0000 9px),linear-gradient(180deg,#2a1a44,#160c28)}.card__art--photo{overflow:hidden;background:#1a0f2b}.card__photo{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:inherit;filter:saturate(.82) brightness(.9) sepia(.16)}.card__photo:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 50% 45%,#140a1f00 52%,#140a1f9e)}.card.is-reversed .card__photo{transform:rotate(180deg)}.card__art--photo .card__label,.card__art--photo .card__rank{z-index:1;text-shadow:0 1px 3px rgba(12,6,20,.9)}.card__art--photo .card__label{color:#e9e2cfa6}.card__art--photo .card__rank{color:var(--gold-bright)}.card__label{position:absolute;top:4px;left:6px;font-family:var(--mono);font-size:7px;letter-spacing:.5px;color:#e9e2cf59}.card__rank{position:absolute;top:4px;right:6px;font-family:var(--mono);font-size:8px;letter-spacing:.5px;color:#d6b25ebf}.card__sym{font-size:32px;line-height:1;color:var(--gold-bright);text-shadow:0 0 12px rgba(200,162,78,.4)}.card__art--ornament .card__sym{font-size:44px;text-shadow:0 0 18px rgba(214,178,94,.6)}.card__title{text-align:center;padding-top:5px;font-family:var(--serif);font-style:italic;font-size:12px;color:var(--ink);line-height:1.05;height:calc(2.1em + 5px);display:flex;align-items:center;justify-content:center;box-sizing:content-box}.card__back{position:absolute;top:0;right:0;bottom:0;left:0;padding:7px}.card__back-inner{width:100%;height:100%;border:1px solid rgba(200,162,78,.4);border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 50%,#3a1e5ca6,#120a1feb)}.card__back-inner:before{content:"";position:absolute;top:5px;right:5px;bottom:5px;left:5px;border:1px solid rgba(200,162,78,.18);border-radius:6px}.card__rune{width:32px;height:32px;border:1px solid rgba(200,162,78,.6);transform:rotate(45deg);display:flex;align-items:center;justify-content:center;animation:cardpulse 3.2s ease-in-out infinite}.card__rune span{transform:rotate(-45deg);color:var(--gold-bright);font-size:15px;text-shadow:0 0 10px rgba(200,162,78,.6)}.card.is-reversed .card__sym{transform:rotate(180deg)}.shimmer{height:14px;border-radius:7px;background:linear-gradient(90deg,#c8a24e14,#c8a24e33,#c8a24e14);background-size:220px 100%;animation:shim 1.4s linear infinite}.zoom{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:calc(24px + var(--tg-inset-top)) 24px calc(24px + var(--safe-bottom));background:#080410db;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:zoom-in .22s ease-out both}.zoom__inner{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:340px;width:100%;max-height:100%;overflow-y:auto;scrollbar-width:none;animation:zoom-rise .28s cubic-bezier(.2,.9,.3,1) both}.zoom__card{width:min(62vw,230px);aspect-ratio:.63;flex-shrink:0;filter:drop-shadow(0 18px 40px rgba(0,0,0,.6))}.zoom__label{font-family:var(--mono);font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--gold)}.zoom__name{font-family:var(--serif);font-style:italic;font-size:22px;text-align:center;color:var(--ink)}.zoom__reversed{font-family:var(--sans);font-style:normal;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--gold)}.zoom__meaning{margin:0;font-family:var(--serif-body);font-size:17px;line-height:1.5;text-align:center;color:var(--ink-soft)}.zoom__close{margin-top:4px;padding:9px 22px;border:1px solid rgba(200,162,78,.45);border-radius:22px;font-size:13px;letter-spacing:.5px;color:var(--gold);flex-shrink:0}@keyframes zoom-in{0%{opacity:0}to{opacity:1}}@keyframes zoom-rise{0%{opacity:0;transform:scale(.86) translateY(18px)}to{opacity:1;transform:none}}
