@keyframes gradient-flow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes icon-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@media(--motion-reduce){@keyframes gradient-flow{0%,50%,to{background-position:0% 50%}}@keyframes icon-breathe{0%,50%,to{transform:scale(1)}}}#hub{position:relative}.hub-header{position:relative;display:flex;flex-direction:column;gap:.25rem;align-items:center;margin-bottom:1rem;padding-top:.5rem}.hub-header h1{font-size:1.5rem}.hub-header .theme-toggle{position:absolute;top:.5rem;right:0}.hub-title{color:transparent;background:linear-gradient(90deg,var(--ctp-green),var(--ctp-blue),var(--ctp-red));-webkit-background-clip:text;background-clip:text;background-size:200% 100%;animation:gradient-flow 6s ease infinite}.hub-icon{animation:icon-breathe 4s ease-in-out infinite}.hub-stats-bar{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-bottom:1rem}.streak-badge,.sessions-badge{padding:.25rem .5rem;border-radius:6px;font-size:.875rem;color:var(--ctp-subtext0);background:var(--ctp-surface0);box-shadow:var(--ctp-shadow);transition:background-color var(--dur-250) ease}.streak-badge{color:var(--ctp-peach)}@keyframes card-enter{0%{transform:translateY(12px);opacity:0}}@media(--motion-reduce){@keyframes card-enter{0%{opacity:0}}.game-card .game-play{display:none}}.game-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.game-card-top{display:flex;gap:.5rem;align-items:center}.game-tagline{font-size:.75rem;color:var(--ctp-subtext0);transition:color var(--dur-250) ease,transform var(--dur-250) ease}.game-stat{font-size:.75rem;font-weight:600;color:var(--accent, var(--ctp-subtext0));transition:color var(--dur-250) ease,transform var(--dur-250) ease}.game-card{--border-w: 4px;--accent-wash: color-mix( in srgb, var(--accent, var(--ctp-surface1)) 12%, transparent );position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.25rem;padding:.75rem .75rem .75rem calc(.75rem + var(--border-w));border-radius:6px;color:inherit;text-decoration:none;background:linear-gradient(var(--accent-wash),var(--accent-wash)) no-repeat left / 0% 100%,var(--ctp-surface0);box-shadow:inset var(--border-w) 0 0 var(--accent, var(--ctp-surface1)),var(--ctp-shadow);transition:background-size var(--dur-250) ease,box-shadow var(--dur-250) ease,opacity var(--dur-250) ease,transform var(--dur-100) ease;animation:card-enter var(--dur-350) ease both;animation-delay:calc(var(--i, 0) * 60ms)}.game-card .game-play{position:absolute;top:0;bottom:0;left:0;transform:translate(-3.5rem);display:flex;align-items:center;justify-content:center;width:calc(3.5rem + var(--border-w));font-size:.875rem;font-weight:600;color:var(--ctp-text);text-transform:uppercase;letter-spacing:.05em;opacity:0;background:var(--accent, var(--ctp-surface1));transition:transform var(--dur-250) ease,opacity var(--dur-250) ease}.game-card .game-icon{display:flex;flex-shrink:0;color:var(--accent, var(--ctp-subtext0));transition:color var(--dur-250) ease,transform var(--dur-250) ease}.game-card .game-name{flex:1;font-size:1rem;font-weight:600;transition:color var(--dur-250) ease,transform var(--dur-250) ease}.game-card.done{opacity:.6}.game-card:hover:not(.done){transform:translateY(-1px);box-shadow:inset var(--border-w) 0 0 var(--accent, var(--ctp-surface1)),var(--ctp-shadow-lg)}.game-card:hover:not(.done) .game-play{transform:translate(0);opacity:1}.game-card:hover:not(.done) .game-icon,.game-card:hover:not(.done) .game-name,.game-card:hover:not(.done) .game-tagline,.game-card:hover:not(.done) .game-stat{transform:translate(3rem)}.game-card:active:not(.done){transform:translateY(0);box-shadow:inset var(--border-w) 0 0 var(--accent, var(--ctp-surface1))}.game-card.pressed{transform:scale(.97);background-size:100% 100%,auto;box-shadow:inset var(--border-w) 0 0 var(--accent, var(--ctp-surface1)),0 0 0 2px var(--accent, var(--ctp-surface1))}.new-session-btn{cursor:pointer;width:100%;padding:.75rem;border:none;border-radius:6px;font-size:1rem;font-weight:600;color:var(--ctp-mantle);background:var(--ctp-blue);box-shadow:var(--ctp-shadow);transition:background-color var(--dur-150) ease,box-shadow var(--dur-150) ease,transform var(--dur-100) ease}.new-session-btn:hover{transform:translateY(-1px);box-shadow:var(--ctp-shadow-lg)}.new-session-btn:active{transform:translateY(0);box-shadow:none}.new-session-btn:focus-visible{outline:none;box-shadow:var(--ctp-focus-ring)}.hub-footer{padding-top:.5rem;font-size:.75rem;color:var(--ctp-subtext0);text-align:center;transition:color var(--dur-250) ease}.game-card-right{display:flex;gap:.25rem;align-items:center}.stage-chip,.done-badge{display:flex;align-items:center;justify-content:center;min-width:4rem;padding:.25rem .5rem;border:none;border-radius:6px;font-size:.75rem;color:var(--ctp-subtext0);background:var(--ctp-surface1);transition:background-color var(--dur-250) ease,color var(--dur-250) ease}.stage-chip{cursor:pointer}.stage-chip:hover{background:var(--ctp-surface2)}.stage-chip.readiness-amber{color:var(--ctp-peach)}.stage-chip.readiness-green{color:var(--ctp-green)}.done-badge{color:var(--ctp-green);background:color-mix(in srgb,var(--ctp-green) 12%,var(--ctp-surface1))}.advance-btn{cursor:pointer;padding:.25rem .5rem;border:1px solid var(--ctp-green);border-radius:4px;font-size:.75rem;font-weight:600;color:var(--ctp-green);background:transparent;transition:background-color var(--dur-150) ease,color var(--dur-150) ease}.advance-btn:hover{color:var(--ctp-mantle);background:var(--ctp-green)}.retreat-btn{cursor:pointer;padding:.25rem .5rem;border:none;font-size:.75rem;color:var(--ctp-subtext0);background:transparent;transition:color var(--dur-150) ease}.retreat-btn:hover{color:var(--ctp-text)}@keyframes popover-enter{0%{transform:translateY(-4px);opacity:0}}@media(--motion-reduce){@keyframes popover-enter{0%{opacity:0}}}.stage-popover{position:absolute;z-index:10;display:flex;flex-direction:column;padding:.25rem;border-radius:6px;background:var(--ctp-surface1);box-shadow:var(--ctp-shadow-lg);animation:popover-enter var(--dur-150) ease}.stage-row{display:flex;gap:.5rem;align-items:center;padding:.25rem .5rem;border-radius:4px;font-size:.75rem;color:var(--ctp-subtext0)}.stage-row.current{color:var(--accent, var(--ctp-text));background:var(--ctp-surface0)}.stage-row-num{font-weight:600}
