:root{--color-white: #ffffff;--color-woodsmoke: #0e0e10;--color-grey-mid: #6c6c6d;--color-grey-contrast: #333333;--color-grey-muted: #919191;--color-grey-border: #dbdbdb;--color-grey-faint: rgba(14, 14, 16, .44);--color-card-bg: #f9f9f9;--color-divider: rgba(0, 0, 0, .2);--color-accent: #d22c2c;--color-accent-muted: #f5a0a0;--color-accent-hover: #f08080;--font-family-base: "Geist", sans-serif;--font-family-mono: "Geist Mono", monospace;--font-family-display: "Sentient", "Geist", sans-serif;--font-size-hero: 37.3px;--font-size-body: 17.4px;--font-size-body-sm: 17px;--font-size-body-xs: 13.3px;--font-size-link: 13px;--font-size-footer: 13.6px;--font-size-tooltip: 11px;--spacing-xxs: 10px;--spacing-xs: 12px;--spacing-sm: 16px;--spacing-md: 19.4px;--spacing-lg: 20px;--spacing-xl: 40px;--radius: 12px;--radius-lg: 20px;--radius-pill: 999px;--shadow: 0 12px 40px rgba(14, 14, 16, .08);--shadow-hover: 0 12px 40px rgba(14, 14, 16, .12);--shadow-active: 0 20px 60px rgba(14, 14, 16, .16);--shadow-tooltip: 0 8px 24px rgba(14, 14, 16, .12);--skeleton-bg: #f3f4f6;--skeleton-shine: #ffffff;--green: #22c55e;--yellow: #facc15;--orange: #fb923c;--red: #ef4444;--gold: #fbbf24;--gold-hover: #fcd34d;color-scheme:light}@media (prefers-color-scheme: dark){:root{--color-white: #0e0e10;--color-woodsmoke: #f0f0f0;--color-grey-mid: #9a9a9a;--color-grey-contrast: #d0d0d0;--color-grey-muted: #707070;--color-grey-border: #2a2a2a;--color-grey-faint: rgba(240, 240, 240, .44);--color-card-bg: #1a1a1a;--color-divider: rgba(255, 255, 255, .15);--color-accent: #cf4949;--color-accent-muted: #8b4545;--color-accent-hover: #9b5050;--shadow: 0 12px 40px rgba(0, 0, 0, .3);--shadow-hover: 0 12px 40px rgba(0, 0, 0, .4);--shadow-active: 0 20px 60px rgba(0, 0, 0, .5);--shadow-tooltip: 0 8px 24px rgba(0, 0, 0, .4);--skeleton-bg: #111418;--skeleton-shine: #1a1f26;--gold: #f59e0b;--gold-hover: #fbbf24;color-scheme:dark}.btn,.random-toggle,.favourites-toggle,.btn-bookmark{--bordered-hover-bg: rgba(240, 240, 240, .08);--bordered-hover-border: var(--color-grey-mid);--bordered-hover-color: var(--color-woodsmoke);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.btn:not(.secondary):not(.btn-bookmark){--bordered-hover-bg: rgba(199, 48, 48, .16);--bordered-hover-border: var(--color-accent-hover);--bordered-hover-color: var(--color-accent-hover);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.random-toggle{--bordered-hover-bg: rgba(240, 240, 240, .08);--bordered-hover-border: var(--color-grey-mid);--bordered-hover-color: var(--color-woodsmoke);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.btn.secondary{--bordered-hover-bg: rgba(240, 240, 240, .1);--bordered-hover-border: var(--color-grey-mid);--bordered-hover-color: var(--color-woodsmoke);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.btn-bookmark,.favourites-toggle{--bordered-hover-bg: rgba(245, 158, 11, .12);--bordered-hover-border: var(--gold);--bordered-hover-color: var(--gold);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.random-toggle.active{--bordered-hover-bg: var(--color-grey-contrast);--bordered-hover-border: var(--color-grey-contrast);--bordered-hover-color: var(--color-white);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.favourites-toggle.active,.btn-bookmark.active{--bordered-hover-bg: var(--gold);--bordered-hover-border: var(--gold);--bordered-hover-color: var(--color-white);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}}::selection{background-color:#d22c2c40}@media (prefers-color-scheme: dark){::selection{background-color:#c7303059}}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}*{box-sizing:border-box}body{margin:0;background:var(--color-white);color:var(--color-woodsmoke);font-family:var(--font-family-base);font-size:var(--font-size-body);line-height:1.6;overflow-x:hidden}.app-container{height:100vh;display:flex;flex-direction:column;position:relative}header{padding:0;border-bottom:1px solid var(--color-grey-border);background:var(--color-white);position:relative;z-index:10}.header-content{max-width:1200px;margin:0 auto;padding:18px 24px 16px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;position:relative}.header-content>h1{flex:1}.header-content>.mode-toggle-wrapper{flex-shrink:0}.header-content>.info-wrapper{flex-shrink:0}h1{font-family:var(--font-family-display);font-size:19px;font-weight:500;margin:0;display:flex;align-items:center;gap:14px;color:var(--color-woodsmoke);letter-spacing:-.02em}.info-wrapper{position:relative;display:flex;align-items:center}.info-btn{width:32px;height:32px;border-radius:50%;border:none;background:transparent;color:var(--color-grey-mid);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);flex-shrink:0;-webkit-tap-highlight-color:transparent;position:relative}.info-btn:hover{color:var(--color-woodsmoke);background:#0e0e100a;transform:scale(1.05)}@media (prefers-color-scheme: dark){.info-btn:hover{background:#f0f0f00a}}.info-btn:active{transform:scale(.95)}.info-btn svg{width:20px;height:20px}.help-tooltip{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(calc(-50% + var(--tooltip-offset-x, 0px)));background:var(--color-white);border:1px solid var(--color-grey-border);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow-tooltip);z-index:1000;min-width:180px;max-width:min(260px,calc(100vw - 24px));animation:fadeInScale .2s cubic-bezier(.4,0,.2,1);will-change:transform,top,left}@media (prefers-color-scheme: dark){.help-tooltip{background:var(--color-card-bg)}}@keyframes fadeInScale{0%{opacity:0;transform:translate(calc(-50% + var(--tooltip-offset-x, 0px))) translateY(-4px) scale(.95)}to{opacity:1;transform:translate(calc(-50% + var(--tooltip-offset-x, 0px))) translateY(0) scale(1)}}.tooltip-arrow{display:none}.tooltip-content{display:flex;flex-direction:column;gap:6px}.shortcut{display:flex;align-items:center;gap:8px;font-size:var(--font-size-tooltip);color:var(--color-grey-mid);line-height:1.4}.shortcut kbd{background:var(--color-card-bg);border:1px solid var(--color-grey-border);border-radius:4px;padding:2px 6px;font-family:var(--font-family-mono);font-size:10px;color:var(--color-woodsmoke);font-weight:500;min-width:20px;text-align:center;display:inline-block}@media (prefers-color-scheme: dark){.shortcut kbd{background:var(--color-white);color:var(--color-grey-contrast)}}.is-touch .help-tooltip,.is-touch .info-wrapper{display:none!important}.chapter-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--color-white);border:1px solid var(--color-grey-border);padding:8px 34px 8px 14px;border-radius:var(--radius);font-family:var(--font-family-base);font-size:14px;font-weight:400;color:var(--color-woodsmoke);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%236c6c6d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:10px;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation}.chapter-select:focus{outline:none;border-color:var(--color-grey-border)}.chapter-select:hover,.chapter-select:focus:hover{border-color:var(--color-grey-contrast);box-shadow:0 2px 8px #00000014}.chapter-select:focus-visible{border-color:var(--color-grey-contrast);box-shadow:0 2px 8px #00000014}.main-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;min-height:0}.stage{position:relative;margin:0 auto 24px;width:min(90vw,900px);perspective:2000px;-webkit-perspective:2000px;-webkit-user-select:none;user-select:none;display:block}.skeleton-card{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--skeleton-bg);border-radius:var(--radius-lg);overflow:hidden;opacity:0;transition:opacity .2s ease-out}.skeleton-card.visible{opacity:1}.skeleton-card:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,var(--skeleton-shine),transparent);animation:shimmer 1.5s infinite}@keyframes shimmer{to{left:100%}}.card-shell{position:relative;width:100%;height:100%;cursor:pointer;transition:transform .15s ease-out,opacity .2s ease-out;will-change:transform,opacity;contain:layout;transform:translateZ(0)}.card-shell:hover{transform:translateY(-2px)}.card-shell:active{transform:translateY(0) scale(.98)}.card-shell.out-left{animation:outLeft .14s ease-out both}.card-shell.in-right{animation:inRight .18s ease-out both}.card-shell.out-right{animation:outRight .14s ease-out both}.card-shell.in-left{animation:inLeft .18s ease-out both}@keyframes outLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-12px)}}@keyframes inRight{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}@keyframes outRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(12px)}}@keyframes inLeft{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}.card-shell.swiping-left{animation:swipeLeftOut .3s cubic-bezier(.4,0,1,1) forwards}.card-shell.swiping-right{animation:swipeRightOut .3s cubic-bezier(.4,0,1,1) forwards}.card-shell.scaling-in{animation:scaleIn .4s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes swipeLeftOut{0%{opacity:1;transform:translate(0) rotate(0) scale(1)}to{opacity:0;transform:translate(-120%) rotate(-15deg) scale(.8)}}@keyframes swipeRightOut{0%{opacity:1;transform:translate(0) rotate(0) scale(1)}to{opacity:0;transform:translate(120%) rotate(15deg) scale(.8)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.card3d{position:relative;width:100%;height:100%;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1);transform:rotateY(0);will-change:transform;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.card3d.no-anim{transition:none!important}.card3d.flipped{transform:rotateY(180deg)}.face{position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;transition:opacity .3s ease-in-out}.face.front{transform:rotateY(0)}.face.back{transform:rotateY(180deg)}.face img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;opacity:0;transition:opacity .2s ease-out;will-change:opacity}@media (prefers-color-scheme: dark){.face img{filter:brightness(.9) saturate(.96)}}.face img.loaded{opacity:1}.controls-wrapper{width:100%;max-width:720px;margin:0 auto;padding:0 20px}.controls{display:flex;flex-direction:column;gap:20px;align-items:center}.nav-buttons{display:flex;gap:12px;align-items:center}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--color-grey-border);background:var(--color-white);color:var(--color-grey-contrast);padding:8px 14px;border-radius:var(--radius-pill);font-family:var(--font-family-base);font-size:var(--font-size-link);font-weight:400;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;gap:8px;position:relative;overflow:hidden;min-height:44px;min-width:44px;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation}.btn,.random-toggle,.favourites-toggle,.btn-bookmark{--bordered-hover-bg: rgba(14, 14, 16, .06);--bordered-hover-border: var(--color-grey-mid);--bordered-hover-color: var(--color-grey-contrast);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none;box-shadow:none}.btn:not(.secondary):not(.btn-bookmark){--bordered-hover-bg: rgba(210, 44, 44, .08);--bordered-hover-border: var(--color-accent);--bordered-hover-color: var(--color-accent);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.random-toggle{--bordered-hover-bg: rgba(14, 14, 16, .06);--bordered-hover-border: var(--color-grey-mid);--bordered-hover-color: var(--color-grey-contrast);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.btn-bookmark,.favourites-toggle{--bordered-hover-bg: rgba(251, 191, 36, .12);--bordered-hover-border: var(--gold);--bordered-hover-color: var(--gold);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.btn:hover:not(:disabled),.random-toggle:hover:not(.disabled),.favourites-toggle:hover:not(.disabled){color:var(--bordered-hover-color);border-color:var(--bordered-hover-border);background:var(--bordered-hover-bg);box-shadow:none}.btn:active:not(:disabled){box-shadow:none}.random-toggle:active:not(.disabled),.favourites-toggle:active:not(.disabled){box-shadow:none}.btn.secondary{background:transparent;color:var(--color-grey-contrast);border:1px solid var(--color-grey-border);--bordered-hover-bg: rgba(14, 14, 16, .06);--bordered-hover-border: var(--color-grey-mid);--bordered-hover-color: var(--color-woodsmoke);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.btn:focus-visible:not(:disabled),.random-toggle:focus-visible:not(.disabled),.favourites-toggle:focus-visible:not(.disabled){outline:2px solid var(--bordered-hover-border);outline-offset:2px;box-shadow:none}.btn:disabled{opacity:.3;cursor:not-allowed}.btn-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn-bookmark{background:transparent;color:var(--gold);border-color:var(--gold);padding:8px 20px;position:relative}.btn-bookmark.active{background:var(--gold);color:var(--color-white);border-color:var(--gold)}.btn-bookmark svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;transition:all .2s ease}.btn-bookmark.active svg{fill:currentColor;stroke:var(--color-white)}.mode-toggle-wrapper{display:flex;align-items:center;gap:12px}.mode-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--color-grey-border);background:var(--color-white);color:var(--color-grey-contrast);padding:6px 12px;border-radius:var(--radius-pill);font-family:var(--font-family-base);font-size:var(--font-size-link);font-weight:500;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;gap:6px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.mode-toggle:hover{background:#0e0e100f;border-color:var(--color-grey-mid)}.mode-toggle.active{background:var(--color-accent);color:var(--color-white);border-color:var(--color-accent)}.mode-toggle.active:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.mode-toggle .toggle-icon{width:14px;height:14px;transition:transform .2s ease}.mode-toggle.active .toggle-icon{transform:rotate(90deg)}@media (prefers-color-scheme: dark){.mode-toggle:hover{background:#f0f0f014}}.btn-pas-ok{--bordered-hover-bg: rgba(239, 68, 68, .1);--bordered-hover-border: var(--red);--bordered-hover-color: var(--red);background:transparent;color:var(--red);border-color:var(--red)}.btn-ok{--bordered-hover-bg: rgba(34, 197, 94, .1);--bordered-hover-border: var(--green);--bordered-hover-color: var(--green);background:var(--green);color:var(--color-white);border-color:var(--green)}.btn-ok:hover:not(:disabled){background:#16a34a;border-color:#16a34a;color:var(--color-white)}.btn-pas-ok:hover:not(:disabled){background:var(--bordered-hover-bg);border-color:var(--bordered-hover-border);color:var(--bordered-hover-color)}body.modal-open{overflow:hidden;position:fixed;width:100%;height:100%;touch-action:none;overscroll-behavior:contain}body.modal-open .app-container,body.modal-open .footer-section{pointer-events:none}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .25s cubic-bezier(.4,0,.2,1);padding:20px}.modal.show{opacity:1;pointer-events:all}.modal-content{background:var(--color-white);border-radius:24px;padding:40px;transform:translateY(20px) scale(.95);transition:transform .25s cubic-bezier(.4,0,.2,1);box-shadow:0 20px 60px #00000026;max-width:420px;width:100%}.modal.show .modal-content{transform:translateY(0) scale(1)}.modal-welcome{text-align:center}.modal-version{font-family:var(--font-family-mono);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--color-grey-mid);margin-bottom:24px}.modal-welcome h2{font-family:var(--font-family-display);font-size:24px;font-weight:400;margin:0 0 32px;color:var(--color-woodsmoke);letter-spacing:-.02em}.modal-modes{display:flex;flex-direction:column;gap:20px;margin-bottom:24px;text-align:left}.mode-item{padding:16px;border-radius:12px;border:1px solid var(--color-grey-border);transition:all .2s ease}.mode-item.mode-new{background:linear-gradient(135deg,rgba(14,14,16,.02),transparent)}.mode-name{display:block;font-size:14px;font-weight:600;color:var(--color-woodsmoke);margin-bottom:4px;letter-spacing:-.01em}.mode-desc{display:block;font-size:13px;color:var(--color-grey-mid);line-height:1.5}.badge-new{display:inline-block;padding:2px 5px;background:var(--color-woodsmoke);color:var(--color-white);font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;border-radius:4px;margin-left:6px;vertical-align:middle}.modal-hint{font-size:12px;color:var(--color-grey-mid);margin:0 0 32px;line-height:1.5}.modal-complete{text-align:center;padding:32px 24px;display:flex;flex-direction:column;align-items:center}.complete-checkmark{width:64px;height:64px;border-radius:50%;background:transparent;color:var(--color-woodsmoke);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;border:1px solid var(--color-grey-border)}.complete-checkmark svg{width:28px;height:28px;stroke-width:1.5}.modal-complete h2{font-family:var(--font-family-display);font-size:24px;font-weight:450;margin:0 0 8px;color:var(--color-woodsmoke);letter-spacing:-.03em}.complete-stats{font-family:var(--font-family-base);font-size:15px;color:var(--color-grey-mid);margin:0 0 32px;font-weight:400;line-height:1.5}.complete-stats span:first-child{color:var(--color-woodsmoke);font-weight:500;font-variant-numeric:tabular-nums}.modal-btn{width:100%;margin:0 auto;padding:14px 24px;font-size:14px;font-weight:500;border-radius:var(--radius-pill);transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;border:none;font-family:var(--font-family-base);display:flex;justify-content:center;align-items:center;letter-spacing:-.01em}.modal-btn-primary{background:var(--color-woodsmoke);color:var(--color-white);border:1px solid var(--color-woodsmoke);font-weight:600}.modal-btn-primary:hover{background:#3a3a3a;color:var(--color-white);border-color:#3a3a3a}.modal-btn-primary:active{background:var(--color-woodsmoke);color:var(--color-white)}.modal-welcome .modal-btn{background:var(--color-woodsmoke);color:var(--color-white);box-shadow:0 4px 12px #0000001a}.modal-welcome .modal-btn:hover{background:var(--color-grey-contrast);transform:translateY(-2px);box-shadow:0 8px 20px #00000026}.modal-welcome .modal-btn:active{transform:translateY(0)}.modal-btn-ghost{background:transparent;color:var(--color-grey-mid);border:1px solid var(--color-grey-border)}.modal-btn-ghost:hover{background:#0e0e100a;border-color:var(--color-grey-mid);color:var(--color-grey-contrast)}.modal-actions{display:flex;flex-direction:column;gap:12px;width:100%;max-width:280px}@media (prefers-color-scheme: dark){.modal{background:#000000bf}.modal-content{background:#161618;box-shadow:0 24px 64px #0009;border:1px solid rgba(255,255,255,.08)}.complete-checkmark{border-color:#fff3;color:var(--color-woodsmoke)}.complete-checkmark svg{stroke:var(--color-woodsmoke)}.modal-welcome .modal-btn{background:linear-gradient(135deg,#27272d,#1b1b1f);color:var(--color-woodsmoke);border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 24px #00000073,inset 0 1px #ffffff0f}.modal-welcome .modal-btn:hover{background:linear-gradient(135deg,#303037,#222227);border-color:#ffffff2e}.modal-btn-primary:hover{background:#cfcfcf;color:var(--color-white);border-color:#cfcfcf}.modal-btn-ghost{color:var(--color-grey-mid);border-color:var(--color-grey-border)}.modal-btn-ghost:hover{background:#f0f0f014;border-color:var(--color-grey-mid)}}@media (max-width: 480px){.modal-content{padding:32px 24px}.modal-welcome h2{font-size:20px}.modal-complete{padding:40px 24px}.modal-complete h2{font-size:20px}}.filter-controls{display:flex;gap:24px;align-items:center;flex-wrap:wrap;justify-content:center}.filter-group{display:flex;flex-direction:column;align-items:center;padding:6px 10px;border-radius:12px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation}.toggle-pair{display:flex;gap:12px;align-items:center;justify-content:center}.filter-label{font-size:var(--font-size-body-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-grey-mid);font-weight:400}.traffic-pills{display:flex;gap:4px;cursor:pointer;padding:6px;border-radius:20px;transition:background .2s ease;align-items:center;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation}.filter-group:hover .traffic-pills{background:#0e0e100a}@media (prefers-color-scheme: dark){.filter-group:hover .traffic-pills{background:#f0f0f00a}}.pill{width:20px;height:8px;border-radius:4px;background:var(--color-grey-border);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}#timerFilter[data-level=green] .pill:nth-child(1){background:var(--green);box-shadow:0 0 8px #22c55e66}#timerFilter[data-level=yellow] .pill:nth-child(1),#timerFilter[data-level=orange] .pill:nth-child(1){background:var(--green)}#timerFilter[data-level=yellow] .pill:nth-child(2),#timerFilter[data-level=orange] .pill:nth-child(2){background:var(--yellow)}#timerFilter[data-level=yellow] .pill:nth-child(2){box-shadow:0 0 8px #facc1566}#timerFilter[data-level=orange] .pill:nth-child(3){background:var(--orange);box-shadow:0 0 8px #fb923c66}#difficultyFilter[data-level=green] .pill:nth-child(1){background:var(--green);box-shadow:0 0 8px #22c55e66}#difficultyFilter[data-level=orange] .pill:nth-child(1),#difficultyFilter[data-level=red] .pill:nth-child(1){background:var(--green)}#difficultyFilter[data-level=orange] .pill:nth-child(2),#difficultyFilter[data-level=red] .pill:nth-child(2){background:var(--orange);box-shadow:0 0 8px #fb923c66}#difficultyFilter[data-level=orange] .pill:nth-child(3){background:var(--color-grey-border);box-shadow:none}#difficultyFilter[data-level=red] .pill:nth-child(3){background:var(--red);box-shadow:0 0 8px #ef444466}.random-toggle,.favourites-toggle{display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--color-white);border:1px solid var(--color-grey-border);border-radius:var(--radius-pill);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation;font-size:var(--font-size-link)}.random-toggle.disabled{cursor:not-allowed;opacity:.6;color:var(--color-grey-muted);background:var(--color-card-bg);border-color:var(--color-grey-border);--bordered-hover-bg: var(--color-card-bg);--bordered-hover-border: var(--color-grey-border);--bordered-hover-color: var(--color-grey-muted);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.random-toggle.disabled:hover{border-color:var(--color-grey-border);background:var(--color-card-bg)}.random-toggle.active{background:var(--color-grey-contrast);color:var(--color-white);border-color:var(--color-grey-contrast);--bordered-hover-bg: var(--color-grey-contrast);--bordered-hover-border: var(--color-grey-contrast);--bordered-hover-color: var(--color-white);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.favourites-toggle.active{background:var(--gold);color:var(--color-white);border-color:var(--gold);--bordered-hover-bg: var(--gold);--bordered-hover-border: var(--gold);--bordered-hover-color: var(--color-white);--bordered-shadow-hover: none;--bordered-shadow-active: none;--bordered-shadow-focus: none}.random-icon,.favourites-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center}.random-icon svg,.favourites-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s cubic-bezier(.4,0,.2,1)}.favourites-toggle.active .favourites-icon svg{fill:currentColor}.random-toggle.active .random-icon svg{transform:rotate(180deg)}.random-label,.favourites-label{font-weight:400}.favourites-count{font-size:11px;padding:2px 6px;background:#0e0e100f;border-radius:10px;margin-left:4px}@media (prefers-color-scheme: dark){.favourites-count{background:#f0f0f00f}}.counter-wrapper{margin-top:16px;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px}.counter{font-size:var(--font-size-body-xs);color:var(--color-grey-mid);font-weight:400;text-transform:uppercase;letter-spacing:.08em}.btn-restart{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:24px;padding:0 8px;border:1px solid var(--color-grey-border);background:transparent;color:var(--color-grey-mid);border-radius:12px;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:4px;flex-shrink:0;-webkit-tap-highlight-color:transparent}.btn-restart:hover{background:#0e0e100a;border-color:var(--color-grey-mid);color:var(--color-grey-contrast)}.btn-restart:active{transform:scale(.95)}.btn-restart svg{width:14px;height:14px;flex-shrink:0}.btn-restart-text{font-size:12px;font-weight:500;line-height:1}@media (prefers-color-scheme: dark){.btn-restart:hover{background:#f0f0f014}}.btn-text-link{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:none;color:var(--color-grey-mid);font-family:var(--font-family-base);font-size:var(--font-size-link);font-weight:400;cursor:pointer;padding:8px;transition:color .2s ease;-webkit-tap-highlight-color:transparent}.btn-text-link:hover{color:var(--color-grey-contrast);text-decoration:underline}.footer-section{background:var(--color-white);border-top:1px solid var(--color-grey-border);padding:0;position:relative}.footer-content{max-width:1200px;margin:0 auto;padding:20px 24px}.footer-row{display:flex;align-items:center;gap:40px;margin:0 auto;flex-wrap:wrap;max-width:fit-content}.footer-credits{font-size:var(--font-size-footer);color:var(--color-grey-mid);line-height:1.6}.footer-credits a{color:var(--color-grey-contrast);text-decoration:none;transition:color .2s ease;position:relative;font-weight:500}.footer-credits a:hover{text-decoration:underline}.footer-home{display:inline-flex;align-items:center;gap:6px;color:var(--color-grey-mid);text-decoration:none;font-size:var(--font-size-footer);transition:all .2s cubic-bezier(.4,0,.2,1);-webkit-tap-highlight-color:transparent;order:-1}.footer-home:hover{color:var(--color-woodsmoke);text-decoration:underline}.footer-home svg{width:16px;height:16px;flex-shrink:0}@media (max-width: 640px){.header-content{flex-direction:row;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px;flex-wrap:nowrap}h1{font-size:0;gap:0;flex:0 1 auto;min-width:auto}h1:before{content:none}.chapter-select{font-size:15px}.mode-toggle-wrapper{position:relative;padding-left:12px}.mode-toggle-wrapper:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:24px;width:1px;background:var(--color-grey-border)}.mode-toggle{padding:4px 10px;font-size:12px;gap:4px}.mode-toggle .toggle-icon{width:12px;height:12px}.info-wrapper{margin-left:auto;flex-shrink:0}.help-tooltip{right:50%;transform:translate(50%);top:calc(100% + 8px)}@keyframes fadeInScale{0%{opacity:0;transform:translate(50%) scale(.95) translateY(-4px)}to{opacity:1;transform:translate(50%) scale(1) translateY(0)}}.filter-controls{gap:10px}.nav-buttons{flex-wrap:wrap;justify-content:center}.footer-row{flex-direction:column;text-align:center;gap:16px}.footer-home{order:0}}@media (max-width: 535px){#prevBtn .btn-text,#nextBtn .btn-text{display:none}.nav-buttons .btn{padding:8px 12px}}@media (max-width: 545px){.filter-controls{justify-content:center}.toggle-pair{flex:1 0 100%;justify-content:center;width:100%}.toggle-pair .random-toggle,.toggle-pair .favourites-toggle{width:fit-content;max-width:fit-content}}@media (max-width: 328px){.filter-controls{gap:0}.filter-group{padding:3px}#bookmarkBtn .btn-text{display:none}#bookmarkBtn{padding-left:12px;padding-right:12px}}.swipe-zone{position:absolute;top:50%;transform:translateY(-50%);width:min(15vw,60px);height:35vh;display:flex;align-items:center;justify-content:center;border-radius:16px;opacity:0;pointer-events:none;z-index:5;transition:opacity .2s ease-out,transform .2s ease-out;-webkit-user-select:none;user-select:none;backdrop-filter:none;-webkit-backdrop-filter:none}.swipe-zone-ok{right:4px;background:#22c55e0d;border:1.5px dashed rgba(34,197,94,.3);color:var(--green)}.swipe-zone-review{left:4px;background:#ef44440d;border:1.5px dashed rgba(239,68,68,.3);color:var(--red)}.swipe-zone.active{opacity:1;transform:translateY(-50%) scale(1.05);border-style:solid;border-width:1.5px;background:#22c55e1f;box-shadow:0 4px 15px #0000000d}.swipe-zone-review.active{background:#ef44441f}.swipe-zone-icon{width:32px;height:32px;stroke-width:1.5;filter:drop-shadow(0 2px 4px rgba(0,0,0,.05))}.card-shell.swiping{transition:none!important;cursor:grabbing}.card-shell.snap-back{transition:transform .4s cubic-bezier(.175,.885,.32,1.275)!important}.card-shell.swipe-exit{transition:none!important}@keyframes swipeExitRight{0%{transform:translate3d(var(--swipe-start-x, 0),var(--swipe-start-y, 0),0) rotate(var(--swipe-start-rotation, 0deg));opacity:1}to{transform:translate3d(calc(100vw + 50px),var(--swipe-start-y, 0),0) rotate(20deg);opacity:0}}@keyframes swipeExitLeft{0%{transform:translate3d(var(--swipe-start-x, 0),var(--swipe-start-y, 0),0) rotate(var(--swipe-start-rotation, 0deg));opacity:1}to{transform:translate3d(calc(-100vw - 50px),var(--swipe-start-y, 0),0) rotate(-20deg);opacity:0}}.card-shell.swipe-exit-right{animation:swipeExitRight .5s cubic-bezier(.25,1,.5,1) forwards!important}.card-shell.swipe-exit-left{animation:swipeExitLeft .5s cubic-bezier(.25,1,.5,1) forwards!important}.is-touch .card-shell{touch-action:pan-y pinch-zoom}.mode-revision .card-shell{touch-action:none}.card-shell.swiping:hover{transform:none}@media (prefers-color-scheme: dark){.swipe-zone-ok{background:#22c55e1f}.swipe-zone-ok.active{background:#22c55e33}.swipe-zone-review{background:#ef44441f}.swipe-zone-review.active{background:#ef444433}}@media (hover: hover) and (pointer: fine){.swipe-zone{display:none}}.hidden{display:none!important}.sr-only{position:absolute;left:-9999px}