/* PokerGT motion language: soft arrivals, physical cards, precise interaction. */
#app{position:relative;z-index:1}
.motion-portal{position:fixed;inset:0;pointer-events:none;z-index:10000;overflow:hidden}
.motion-logo-flight,.motion-flight-card,.motion-chip-flight,.motion-check-ripple{position:absolute;pointer-events:none;will-change:transform,opacity}
.motion-logo-flight{transform-origin:top left;object-fit:contain;border-radius:26px;box-shadow:0 14px 30px #2b45301a}
.motion-flight-card{z-index:2;box-shadow:2px 8px 14px #203e3c35}
.motion-flight-card .card-corner b{font-size:30px}
.motion-flight-card>i{font-size:38px}
.motion-chip-flight{width:30px;height:26px;filter:drop-shadow(2px 7px 3px #18362a40)}
.motion-chip-flight>i{position:absolute;left:0;bottom:0;width:28px;height:11px;border-radius:50%;background:repeating-conic-gradient(#dcd0ad 0deg 35deg,#fff9de 35deg 50deg,#dcd0ad 50deg 80deg,#55775f 80deg 95deg);border:1px solid #9a8d6a;box-shadow:0 3px 0 #a99a76,inset 0 0 0 2px #f7ebcb88}
.motion-chip-flight>i:nth-child(2){bottom:4px;left:1px}.motion-chip-flight>i:nth-child(3){bottom:8px}.motion-chip-flight>i:nth-child(4){bottom:12px;left:1px}
.motion-check-ripple{width:29px;height:20px;border:2px solid #456e5080;border-radius:50%;box-shadow:0 0 0 5px #e5eedf30}
.poker-scene.is-folded .hero-cards{opacity:.63;filter:saturate(.6)}

/* The opening logo becomes the real logo once the first screen is ready. */
.launch-screen{position:fixed;inset:0;z-index:9998;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background:#fafaf5;isolation:isolate}
.launch-halo{position:absolute;width:min(650px,135vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#d9e3c88c,transparent 66%);z-index:-1;animation:launch-halo 1300ms ease-out both}
.launch-orbit{position:absolute;top:50%;left:50%;width:min(440px,106vw);height:min(300px,70vw);border:1px solid #a9bba54d;border-radius:50%;transform:translate(-50%,-62%) rotate(-24deg);z-index:-1;animation:launch-orbit 1400ms ease-out both}
.launch-stage{width:180px;height:168px;position:relative;display:grid;place-items:center;perspective:800px}
.launch-icon{position:relative;z-index:3;width:112px;height:112px;object-fit:contain;border-radius:26px;box-shadow:0 14px 27px #385b3929;animation:launch-logo 850ms cubic-bezier(.16,.9,.2,1.08) both}
.launch-cards{position:absolute;width:100%;height:100%;inset:0;z-index:1}
.launch-cards>i{position:absolute;width:73px;height:102px;left:53px;top:36px;border:3px solid #fffdf2;border-radius:8px;background:repeating-linear-gradient(45deg,#9aaf99 0 3px,#b8c8af 3px 4px);box-shadow:0 3px 0 #bcc5ad,0 10px 18px #36533c20;animation:launch-card-middle 850ms cubic-bezier(.2,.75,.25,1) both}
.launch-cards>i:first-child{--card-fan:-30deg;--card-x:-35px;animation-name:launch-card-fan;animation-delay:80ms}
.launch-cards>i:last-child{--card-fan:29deg;--card-x:35px;animation-name:launch-card-fan;animation-delay:140ms}
.launch-late-chip{position:absolute;right:8px;bottom:24px;width:29px;height:12px;border-radius:50%;border:1px solid #a99b78;background:repeating-conic-gradient(#ddd1ae 0deg 35deg,#fff7dc 35deg 50deg);box-shadow:0 4px 0 #a99b78,2px 8px 7px #35553822;z-index:4;animation:launch-late-chip 950ms cubic-bezier(.2,.75,.2,1) 180ms both}
.launch-wordmark{display:block;width:204px;height:auto;margin:13px 0 0;animation:launch-copy 650ms cubic-bezier(.2,.8,.3,1) 220ms both}
.launch-tagline{font-size:12px;color:#6c7e65;margin:17px 0 23px;letter-spacing:.1px;animation:launch-copy 650ms ease 330ms both}
.launch-rule{width:70px;height:2px;border-radius:9px;background:#e0e7d6;overflow:hidden;animation:launch-copy 450ms ease 400ms both}
.launch-rule>i{display:block;width:100%;height:100%;background:#6b8969;transform-origin:left;animation:launch-progress 1500ms cubic-bezier(.15,.7,.25,1) both}
.launch-skip{position:absolute;bottom:max(26px,env(safe-area-inset-bottom));font-size:11px;letter-spacing:.3px;color:#7f8c75;min-height:44px;min-width:80px;padding:10px 15px;border-radius:20px}
.launch-skip:hover{background:#ebf0e2}
@keyframes launch-logo{0%{opacity:0;transform:translate(-140px,80px) rotate(-45deg) rotateY(-25deg) scale(.55)}65%{opacity:1;transform:translate(0,-6px) rotate(3deg) rotateY(4deg) scale(1.035)}100%{opacity:1;transform:none}}
@keyframes launch-card-fan{0%,18%{opacity:0;transform:translateY(40px) rotate(0deg) scale(.7)}100%{opacity:1;transform:translate(var(--card-x),6px) rotate(var(--card-fan))}}
@keyframes launch-card-middle{0%{opacity:0;transform:translateY(42px) scale(.7)}100%{opacity:1;transform:translateY(8px)}}
@keyframes launch-copy{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes launch-halo{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
@keyframes launch-orbit{from{opacity:0;transform:translate(-50%,-62%) rotate(-35deg) scale(.65)}to{opacity:1;transform:translate(-50%,-62%) rotate(-24deg) scale(1)}}
@keyframes launch-late-chip{0%,25%{opacity:0;transform:translate(105px,-28px) rotate(-90deg)}62%{opacity:1;transform:translate(-9px,0) rotate(5deg)}78%{transform:translate(4px,-7px) rotate(-4deg)}100%{opacity:1;transform:none}}
@keyframes launch-progress{from{transform:scaleX(0)}65%{transform:scaleX(.8)}100%{transform:scaleX(1)}}

/* Ambient objects belong behind the page, never above a control or card. */
.auth-atmosphere{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity 700ms ease;--drift-x:0px;--drift-y:0px}
body[data-page="signin"] .auth-atmosphere,body[data-page="account-loading"] .auth-atmosphere,body[data-page="welcome"] .auth-atmosphere{opacity:1}
.auth-shell{background:transparent;position:relative;isolation:isolate}
.ambient-glow{position:absolute;border-radius:50%;will-change:transform;filter:blur(10px)}
.glow-one{width:min(980px,125vw);height:min(900px,115vw);top:-30%;left:6%;background:radial-gradient(ellipse,#dfe9cb8c,transparent 66%);animation:ambient-light 24s ease-in-out infinite alternate}
.glow-two{width:min(900px,120vw);height:min(1000px,125vw);bottom:-48%;right:-20%;background:radial-gradient(ellipse,#d5e2cb85,transparent 66%);animation:ambient-light 32s ease-in-out -12s infinite alternate-reverse}
.ambient-orbit{position:absolute;width:740px;height:450px;border:1px solid #8eaa8c29;border-radius:50%;box-shadow:0 0 0 28px #93aa8110,0 0 0 56px #93aa8108;will-change:transform}
.orbit-one{left:-250px;top:13%;transform:rotate(-28deg);animation:ambient-orbit 36s ease-in-out infinite alternate}
.orbit-two{right:-350px;bottom:-80px;transform:rotate(-22deg);animation:ambient-orbit 43s ease-in-out -12s infinite alternate-reverse}
.ambient-card{position:absolute;width:150px;height:210px;border-radius:14px;border:2px solid #fffdf2;background:linear-gradient(135deg,#fffef6,#e5eadb);box-shadow:0 3px 0 #d0d9c5,0 20px 32px #42654412;opacity:.6;color:#779078;will-change:transform}
.ambient-card>span{position:absolute;top:13px;left:15px;font-size:34px;font-weight:600;line-height:1;display:flex;flex-direction:column;align-items:center}
.ambient-card small{font-size:22px;line-height:1;margin-top:3px}
.ambient-card>i{position:absolute;right:14px;bottom:16px;font-size:76px;font-style:normal;color:#8fa18a77;line-height:1}
.ambient-card-left{left:11%;top:20%;--ambient-rotation:-22deg;animation:ambient-card 11s ease-in-out infinite alternate}
.ambient-card-right{right:10%;bottom:17%;--ambient-rotation:18deg;animation:ambient-card 14s ease-in-out -6s infinite alternate-reverse}
.ambient-token{position:absolute;width:49px;height:49px;border-radius:50%;border:5px dashed #fffbee;background:radial-gradient(circle,#a6bb9b 0 46%,#728f6d 47% 51%,#b9c9a9 52%);box-shadow:0 3px 0 #889c79,0 8px 15px #45693615;opacity:.45;animation:ambient-token 17s ease-in-out infinite alternate}
.token-one{bottom:19%;left:20%;transform:rotateX(38deg) rotate(15deg)}
.token-two{top:19%;right:22%;width:37px;height:37px;animation-delay:-7s}
.auth-card{position:relative;z-index:1}.auth-brand{perspective:700px}
.auth-tools{position:absolute;right:20px;top:20px;display:flex;gap:4px;z-index:2}
.auth-tools .sound-toggle{border:1px solid #dce4d4;background:#fffef580;backdrop-filter:blur(7px)}
@keyframes ambient-light{from{transform:translate(-2%,-2%) scale(.92)}to{transform:translate(7%,9%) scale(1.12)}}
@keyframes ambient-orbit{from{transform:translate(var(--drift-x),var(--drift-y)) rotate(-28deg) scale(.98)}to{transform:translate(calc(var(--drift-x) + 25px),calc(var(--drift-y) - 18px)) rotate(-20deg) scale(1.025)}}
@keyframes ambient-card{from{transform:translate(var(--drift-x),var(--drift-y)) perspective(800px) rotateY(-7deg) rotate(var(--ambient-rotation)) translateY(0)}to{transform:translate(var(--drift-x),var(--drift-y)) perspective(800px) rotateY(7deg) rotate(calc(var(--ambient-rotation) + 4deg)) translateY(-24px)}}
@keyframes ambient-token{from{transform:translateY(0) rotateX(38deg) rotate(-8deg)}to{transform:translateY(-22px) rotateX(30deg) rotate(16deg)}}

/* Tactile controls, quick reveals and a compact dealing loader. */
.header-tools,.session-tools{display:flex;align-items:center;gap:2px;flex:none}
.session-header{display:grid;grid-template-columns:88px 1fr 88px;gap:4px}
.session-header>.icon-button{justify-self:start}
.session-tools{justify-content:flex-end}
.sound-toggle{color:#6e8168}.sound-toggle .icon{width:18px;height:18px}
.sound-toggle[aria-pressed="false"]{color:#8c9785}
.primary,.secondary,.small-primary,.action-button,.google-signin,.icon-button,.choice-chips>button,.size-presets>button,.analysis-focus-main,.bottom-nav>button{transition:background-color 160ms ease,border-color 160ms ease,box-shadow 180ms ease,transform 160ms ease,color 160ms ease}
.action-button:hover:not(:disabled),.size-presets>button:hover:not(:disabled){box-shadow:0 5px 15px #29483212;transform:translateY(-2px)}
.action-button:active:not(:disabled),.primary:active:not(:disabled),.google-signin:active:not(:disabled){transform:translateY(1px) scale(.98)}
.primary>.icon,.text-link>.icon,.reveal-action>.icon{transition:transform 220ms cubic-bezier(.2,.8,.2,1)}
.primary:hover>.icon,.text-link:hover>.icon,.reveal-action:hover>.icon{transform:translateX(3px)}
.brand-icon{transition:transform 350ms cubic-bezier(.2,.9,.2,1),filter 350ms ease}
@media(hover:hover) and (pointer:fine){.wordmark:hover .brand-icon{transform:perspective(300px) rotateY(-12deg) rotate(-4deg) translateY(-1px);filter:drop-shadow(1px 4px 3px #38533724)}}
.progress-track>i{transition:width 450ms cubic-bezier(.2,.8,.2,1)}
.situation-bar>i,.situation-track>i,.recap-bars i{transform-origin:left}
dialog[open]::backdrop{animation:sheet-backdrop 240ms ease both}
@keyframes sheet-backdrop{from{background:#172d2b00;backdrop-filter:blur(0)}to{background:#172d2b59;backdrop-filter:blur(3px)}}
.dealing-deck{position:relative;display:block;width:66px;height:61px;margin:0 auto 16px}
.dealing-deck>i{position:absolute;width:31px;height:43px;left:17px;top:8px;border:2px solid #fffdf2;border-radius:5px;background:repeating-linear-gradient(45deg,#99b098 0 2px,#c2d0b8 2px 3px);box-shadow:0 2px 0 #acbba0,0 5px 9px #496b4020;animation:deck-breathe 1500ms ease-in-out infinite;--deck-x:0px;--deck-r:0deg}
.dealing-deck>i:first-child{--deck-x:-14px;--deck-r:-13deg;animation-delay:-200ms}
.dealing-deck>i:last-child{--deck-x:14px;--deck-r:13deg;animation-delay:-400ms}
@keyframes deck-breathe{0%,100%{transform:translate(var(--deck-x),3px) rotate(var(--deck-r));opacity:.72}50%{transform:translate(var(--deck-x),-4px) rotate(var(--deck-r));opacity:1}}
.auth-loading{margin-top:0}.account-loading-deck{margin-top:0}
.decision-pending{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;color:var(--muted);font-size:11px}
.pending-dots{display:flex;gap:3px}.pending-dots>i{width:4px;height:4px;border-radius:50%;background:#8ba080;animation:pending-breathe 1000ms ease-in-out infinite}.pending-dots>i:nth-child(2){animation-delay:120ms}.pending-dots>i:nth-child(3){animation-delay:240ms}
@keyframes pending-breathe{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
@media(max-width:800px){.ambient-card{width:114px;height:164px;opacity:.33}.ambient-card-left{left:-33px;top:15%}.ambient-card-right{right:-35px;bottom:12%}.ambient-card>span{font-size:27px;left:12px;top:11px}.ambient-card>i{font-size:62px}.ambient-token{opacity:.25}.token-one{left:5%;bottom:23%}.token-two{right:10%;top:20%}.orbit-one{left:-520px;top:17%}.orbit-two{right:-520px;bottom:-30px}}
@media(max-height:700px){.auth-shell{padding-top:70px;padding-bottom:24px;justify-content:flex-start}.auth-brand{margin-bottom:26px}.auth-foot{margin-top:30px}.launch-stage{height:148px}}

/* Effects stop immediately when hidden or when motion is disabled. */
html[data-visibility="hidden"] .auth-atmosphere *,html[data-visibility="hidden"] .dealing-deck>i{animation-play-state:paused!important}
body:not([data-page="signin"]):not([data-page="welcome"]):not([data-page="account-loading"]) .auth-atmosphere *{animation-play-state:paused}
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-motion="off"] .launch-screen{display:none}
html[data-motion="off"] .ambient-card-left{transform:rotate(-22deg)}
html[data-motion="off"] .ambient-card-right{transform:rotate(18deg)}
html[data-motion="off"] .dealing-deck>i{transform:translateX(var(--deck-x)) rotate(var(--deck-r))}
html[data-motion="off"] button:hover,html[data-motion="off"] button:active,html[data-motion="off"] .wordmark:hover .brand-icon{transform:none}
@media(prefers-reduced-motion:reduce){button:hover,button:active,.wordmark:hover .brand-icon{transform:none}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.launch-screen{display:none}.ambient-card-left{transform:rotate(-22deg)}.ambient-card-right{transform:rotate(18deg)}.dealing-deck>i{transform:translateX(var(--deck-x)) rotate(var(--deck-r))}}

/* Selected navigation stays legible and explicit even when motion is off. */
.bottom-nav>button{position:relative;isolation:isolate;border-radius:12px;font-weight:550;min-height:48px;overflow:visible}
.bottom-nav>button.active,.desktop-nav .bottom-nav>button.active{background:transparent;color:#fffef8;font-weight:650}
.nav-selection{position:absolute;inset:0;border-radius:inherit;background:#4f7155;box-shadow:0 2px 5px #28482d20;z-index:-1;transform-origin:top left;pointer-events:none}
.nav-content{display:flex;align-items:center;justify-content:center;gap:9px;position:relative;pointer-events:none}
.bottom-nav>button.active .icon{stroke-width:2.1}
.workspace>.bottom-nav{height:66px;min-height:66px;max-width:400px;width:calc(100% - 40px);margin:8px auto 16px;padding:6px;gap:6px;border:1px solid #d8e1d2;border-radius:19px;background:#edf1e7;box-shadow:0 4px 14px #35512e08;bottom:max(12px,env(safe-area-inset-bottom));overflow:hidden}
.workspace>.bottom-nav>button{height:52px;min-height:52px;flex:1;width:auto;flex-direction:row;font-size:13px;color:#5e6d5a}
.workspace>.bottom-nav>button.active{color:#fffef8}
.desktop-nav .bottom-nav{overflow:hidden;border-radius:12px}
.desktop-nav .nav-content{justify-content:flex-start}
.choice-chips>button.selected,.size-presets>button.selected,.decision-tabs>button.selected{background:#e1ebd9;border-color:#55754c;box-shadow:inset 0 0 0 1px #55754c33;color:#304c2d;font-weight:650}
.choice-chips>button,.decision-tabs>button,.experience-choice{transition:background-color 160ms ease,border-color 160ms ease,box-shadow 180ms ease,transform 160ms ease}
@media(min-width:1050px){.workspace>.bottom-nav{display:none}}

@keyframes street-travel{0%,10%{transform:translateY(0);opacity:0}25%{opacity:.8}80%{opacity:.8}100%{transform:translateY(430%);opacity:0}}
@keyframes concept-flow{to{stroke-dashoffset:-60}}
@keyframes concept-breathe{0%,100%{transform:scale(.96);opacity:.65}50%{transform:scale(1.08);opacity:1}}
html[data-visibility="hidden"] .learning-map *{animation-play-state:paused!important}
html[data-motion="off"] .concept-node:hover,html[data-motion="off"] .concept-node:active{transform:translate(-50%,-50%)}
@media(prefers-reduced-motion:reduce){.concept-node:hover,.concept-node:active{transform:translate(-50%,-50%)}}
/* Keep the orbit's positioning transform when a pointer presses a node. */
.concept-constellation>.concept-node:active:not(:disabled){transform:translate(-50%,-50%) scale(.97)}
html[data-motion="off"] .concept-constellation>.concept-node:active:not(:disabled){transform:translate(-50%,-50%)}
@media(prefers-reduced-motion:reduce){.concept-constellation>.concept-node:active:not(:disabled){transform:translate(-50%,-50%)}}

/* Finite lesson demonstrations. Every diagram is complete without movement. */
.intro-flying-chip{animation:intro-chip-travel 2200ms 300ms cubic-bezier(.2,.8,.2,1) both}
.intro-odds-result{animation:intro-result-arrive 600ms 1100ms ease both}
.intro-equity-arc{animation:intro-equity-fill 1800ms 150ms cubic-bezier(.2,.8,.2,1) both}
.range-expands{animation:intro-range-expand 700ms calc(300ms + var(--tile-i)*75ms) ease both}
.intro-range-arrow{animation:intro-range-nudge 1700ms 200ms ease both}
.intro-bluff-outcomes>div{animation:intro-outcome-arrive 450ms 250ms ease both}.intro-bluff-outcomes>div:nth-child(2){animation-delay:850ms}.intro-bluff-outcomes>div:nth-child(3){animation-delay:1450ms}
.intro-bluff-total{animation:intro-result-arrive 500ms 1850ms ease both}
@keyframes intro-chip-travel{0%,8%{opacity:0;transform:translate(-50%,0) scale(.8)}18%{opacity:1}65%{opacity:1;transform:translate(65px,-12px) scale(1)}100%{opacity:0;transform:translate(84px,0) scale(.85)}}
@keyframes intro-result-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes intro-equity-fill{from{stroke-dasharray:0 100}to{stroke-dasharray:40 100}}
@keyframes intro-range-expand{from{opacity:.35;transform:scale(.82);background:#edf0e4}to{opacity:1;transform:none}}
@keyframes intro-range-nudge{0%,100%{transform:none}50%{transform:translateX(4px)}}
@keyframes intro-outcome-arrive{from{opacity:0;transform:translateY(9px) scale(.96)}to{opacity:1;transform:none}}
html[data-visibility="hidden"] .concept-intro *{animation-play-state:paused!important}

/* Short, replayable concept animations. Final information remains visible. */
.library-group[open] .library-card{animation:intro-outcome-arrive 350ms calc(var(--step)*40ms) both}
.lesson-step{animation:intro-result-arrive 650ms 180ms both}.lesson-step:nth-child(2n){animation-delay:550ms}
.lesson-bar{animation:lesson-bar-grow 950ms calc(var(--step)*80ms) both}.lesson-token{animation:lesson-token-pop 400ms calc(var(--step)*95ms) both}
.lesson-flow{animation:lesson-flow-draw 2200ms linear 1}.lesson-cross{animation:intro-result-arrive 500ms 650ms both}.lesson-ring{animation:lesson-ring-fill 1400ms 200ms both}
@keyframes lesson-bar-grow{from{transform:scaleY(.08);opacity:.4}to{transform:scaleY(1);opacity:1}}
@keyframes lesson-token-pop{from{transform:scale(.65);opacity:.3}to{transform:scale(1);opacity:1}}
@keyframes lesson-flow-draw{from{stroke-dashoffset:45}to{stroke-dashoffset:0}}
@keyframes lesson-ring-fill{from{stroke-dasharray:0 100}to{stroke-dasharray:66.67 100}}
html[data-visibility="hidden"] .concept-library *{animation-play-state:paused!important}

/* The same drifting line now connects every learning-path node. */
.learning-tab-panel:not([hidden]){animation:learning-panel-enter 260ms ease both}
.trail-flow{animation:concept-flow 7s linear infinite}
.chapter-content{animation:learning-panel-enter 300ms ease both}
.trail-node{animation:trail-node-arrive 420ms calc(var(--step)*65ms) both}
@keyframes learning-panel-enter{from{opacity:.45;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes trail-node-arrive{from{opacity:0;transform:translateY(9px) scale(.96)}to{opacity:1;transform:none}}
html[data-motion="off"] .trail-node:hover .trail-token{transform:none}
@media(prefers-reduced-motion:reduce){.trail-node:hover .trail-token{transform:none}}

.study-visual .study-card,.study-visual .study-math-tile,.study-hand-badge{animation:intro-outcome-arrive 320ms ease both}
.study-range-grid .added{animation:intro-range-expand 400ms ease both}.study-bars>i{transform-origin:bottom;animation:lesson-bar-grow 500ms calc(var(--step)*35ms) both}.study-seat.selected{animation:lesson-token-pop 350ms ease both}.study-answer-feedback,.study-complete-mark{animation:intro-result-arrive 320ms ease both}
html[data-visibility="hidden"] .study-lesson *{animation-play-state:paused!important}
.study-seat.selected{animation:study-seat-select 350ms ease both}
@keyframes study-seat-select{from{transform:translate(-50%,-50%) scale(.85)}to{transform:translate(-50%,-50%) scale(1)}}
.study-meter-track>span{transform-origin:left;animation:study-meter-fill 380ms ease both}.study-token-grid>span.included,.study-action-flow>span{animation:intro-outcome-arrive 280ms calc(var(--step)*25ms) both}.study-composition{animation:intro-result-arrive 320ms ease both}
@keyframes study-meter-fill{from{transform:scaleX(.05)}to{transform:scaleX(1)}}