:root{--bnk-blue-100: #c2e3ff;--bnk-blue-200: #d2f2fe;--bnk-aqua: #5cfeff;--bnk-letter-bg: #00f1f3;--bnk-ink: #414163;--bnk-green: #b1e488;--bnk-mint: #73e4c8;--bnk-yellow: #eecc77;--bnk-gold: #faba22;--bnk-paper: #fffdf6;--bnk-white: #ffffff;--bnk-muted: #6d6d8a;--bnk-shadow: 0 4px 4px rgba(65, 65, 99, .11);--bnk-radius: 24px;--bnk-font-display: "Fredoka", system-ui, sans-serif;--bnk-font-body: "Nunito", system-ui, sans-serif;--bnk-ease-pop: cubic-bezier(.34, 1.4, .64, 1);--bnk-ease-slide: cubic-bezier(.4, 0, .2, 1)}@media(prefers-reduced-motion:reduce){:root{--bnk-ease-pop: linear;--bnk-ease-slide: linear}}.bnk-tile{display:flex;align-items:center;gap:16px;padding:16px 18px;background:var(--bnk-white);border:3px solid var(--bnk-blue-100);border-radius:var(--bnk-radius);box-shadow:var(--bnk-shadow);color:inherit;min-height:96px;cursor:pointer;transition:transform .18s var(--bnk-ease-slide),box-shadow .18s var(--bnk-ease-slide)}.bnk-tile:hover{transform:translateY(-2px);box-shadow:0 14px 32px #41416329}.bnk-tile img{width:72px;height:72px;object-fit:contain}.bnk-tile.is-svg img{background-color:var(--bnk-letter-bg);border-radius:18px;object-fit:contain}.bnk-tile-title{font-family:var(--bnk-font-display);font-size:28px;line-height:1.1}.bnk-tile-sub{font-size:16px;color:var(--bnk-muted)}.bnk-link-row{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px 0 24px}.bnk-link-row a{background:var(--bnk-yellow);color:var(--bnk-ink);border-radius:999px;padding:10px 16px;font-weight:800;min-height:48px;display:inline-flex;align-items:center}.bnk-word-label{text-align:center;min-height:64px;animation:bnk-fade-up .32s var(--bnk-ease-slide)}.bnk-word-row{display:flex;align-items:center;justify-content:center;gap:10px}.bnk-word-text{font-family:var(--bnk-font-display);font-size:clamp(32px,6vw,56px);line-height:1.15}.bnk-word-hint{color:var(--bnk-muted);font-size:18px}.bnk-speak{width:48px;height:48px;border:0;border-radius:50%;background:var(--bnk-mint);color:var(--bnk-ink);font-size:22px;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden}.bnk-speak[data-speaking=true]{background:var(--bnk-aqua);animation:bnk-pulse .8s ease-in-out infinite}.bnk-visual{--bnk-visual-max: 38vh;width:min(100%,420px);min-height:min(240px,32vh);max-height:var(--bnk-visual-max);display:flex;align-items:center;justify-content:center;background:var(--bnk-white);border-radius:36px;box-shadow:var(--bnk-shadow)}.bnk-visual.is-svg{position:relative;height:var(--bnk-visual-max);overflow:hidden}.bnk-visual.is-svg.is-svg-card,.bnk-visual.is-svg.is-svg-card img,.bnk-visual.is-svg.is-svg-card .bnk-word-svg-wrap{background-color:var(--bnk-svg-card-bg, var(--bnk-letter-bg))}.bnk-visual.is-active{animation:bnk-pop .42s var(--bnk-ease-pop)}.bnk-visual img{width:min(88%,320px);height:auto;max-height:min(280px,34vh);object-fit:contain;pointer-events:none}.bnk-visual.is-svg img,.bnk-word-svg-wrap,.bnk-word-svg{width:100%;height:100%;max-height:none}.bnk-visual.is-svg img{object-fit:contain}.bnk-word-svg-wrap{display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0}.bnk-swatch{width:180px;height:180px;border-radius:32px;border:6px solid var(--bnk-white);box-shadow:inset 0 0 0 3px #41416314}.bnk-arrow{width:64px;height:64px;border:0;border-radius:50%;background:var(--bnk-mint);color:var(--bnk-ink);font-size:32px;box-shadow:var(--bnk-shadow);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden;transition:transform .16s var(--bnk-ease-slide),background-color .16s ease}.bnk-arrow:hover:not(:disabled){transform:scale(1.06);background:var(--bnk-aqua)}.bnk-arrow:disabled{opacity:.35;cursor:default}.bnk-progress{font-weight:800;color:var(--bnk-muted);text-align:center}.bnk-back,.bnk-more{width:48px;height:48px;border:0;border-radius:50%;display:grid;place-items:center;font-size:24px;cursor:pointer;box-shadow:var(--bnk-shadow);-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden}.bnk-speak:focus,.bnk-arrow:focus,.bnk-back:focus,.bnk-more:focus{outline:none}.bnk-speak:focus-visible,.bnk-arrow:focus-visible,.bnk-back:focus-visible,.bnk-more:focus-visible{box-shadow:0 0 0 3px var(--bnk-aqua)}.bnk-speak:active,.bnk-arrow:active:not(:disabled),.bnk-back:active,.bnk-more:active{transform:scale(.96)}.bnk-back{position:absolute;top:16px;left:16px;background:var(--bnk-gold);z-index:2}.bnk-more{background:var(--bnk-mint);font-weight:800;letter-spacing:1px;line-height:1}.bnk-screen{min-height:100vh;padding:24px 16px 32px}.bnk-home{display:flex;flex-direction:column;gap:12px;max-width:560px;margin:0 auto}.bnk-explorer{width:min(1100px,100%);margin:0 auto;min-height:100dvh;padding:8px 16px 12px;display:flex;flex-direction:column;align-items:center;gap:10px;position:relative}.bnk-explorer-bar{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;width:100%;min-height:56px}.bnk-explorer-bar .bnk-back,.bnk-explorer-bar .bnk-more,.bnk-page-bar .bnk-back{position:static}.bnk-page-bar{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:12px;width:100%;min-height:56px}.bnk-page-bar h1{margin:0;line-height:1.1;font-family:var(--bnk-font-display);font-size:clamp(28px,6vw,40px)}.bnk-stage{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"track track" "prev next";justify-items:center;align-items:center;width:100%;gap:16px 24px}.bnk-track{grid-area:track;width:100%;overflow:hidden;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.bnk-track:active{cursor:grabbing}.bnk-track-inner{display:flex;width:300%;will-change:transform;transition:transform .42s var(--bnk-ease-slide)}.bnk-track-inner.is-instant{transition:none}.bnk-track-item{flex:0 0 33.333%;display:grid;place-items:center;padding:8px 0}.bnk-arrow-prev{grid-area:prev}.bnk-arrow-next{grid-area:next}.bnk-panel{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:16px;width:min(720px,100%)}.bnk-panel h1{font-family:var(--bnk-font-display);font-size:40px}.bnk-field{display:flex;flex-direction:column;gap:8px;background:var(--bnk-white);padding:16px;border-radius:20px}.bnk-field select,.bnk-field input[type=checkbox]{min-height:48px;font:inherit}.bnk-settings-actions{display:flex;gap:12px;flex-wrap:wrap}.bnk-settings-actions .bnk-reset,.bnk-settings-actions .bnk-back-action{flex:1;min-width:140px;display:grid;place-items:center}.bnk-back-action,.bnk-reset{min-height:48px;border:0;border-radius:999px;font-weight:800;cursor:pointer}.bnk-back-action{background:var(--bnk-mint)}.bnk-reset{background:var(--bnk-yellow)}.bnk-loading{width:56px;height:56px;border:5px solid var(--bnk-blue-100);border-top-color:var(--bnk-aqua);border-radius:50%;animation:bnk-spin .8s linear infinite}.bnk-welcome{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px 20px;text-align:center;animation:bnk-fade-up .42s var(--bnk-ease-slide)}.bnk-welcome h1{font-family:var(--bnk-font-display);font-size:clamp(40px,8vw,72px);margin:0}.bnk-welcome p{margin:0;font-size:22px;color:var(--bnk-muted)}.bnk-welcome-mascot{width:min(72vw,320px);height:auto;animation:bnk-pop .52s var(--bnk-ease-pop)}.bnk-welcome-loading{margin:12px 0 0;min-height:56px;display:flex;align-items:center;font-family:var(--bnk-font-display);font-size:28px;font-weight:700;color:var(--bnk-ink)}.bnk-sheet-root{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20}.bnk-sheet-scrim{position:absolute;top:0;right:0;bottom:0;left:0;border:0;background:#41416359;cursor:pointer}.bnk-sheet{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:10px;padding:20px 16px calc(20px + env(safe-area-inset-bottom));background:var(--bnk-paper);border-radius:28px 28px 0 0;box-shadow:var(--bnk-shadow);animation:bnk-sheet-up .28s var(--bnk-ease-slide)}.bnk-sheet-title{font-family:var(--bnk-font-display);font-size:28px;text-align:center}.bnk-sheet-action{min-height:52px;border:0;border-radius:999px;background:var(--bnk-mint);font-weight:800;font-size:18px;cursor:pointer}.bnk-sheet-action+.bnk-sheet-action{background:var(--bnk-gold)}.bnk-feedback{display:flex;flex-direction:column;gap:12px}.bnk-feedback label{display:flex;flex-direction:column;gap:6px;font-weight:800}.bnk-feedback textarea{min-height:96px;border:3px solid var(--bnk-blue-100);border-radius:16px;padding:12px;font:inherit;resize:vertical}@keyframes bnk-sheet-up{0%{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes bnk-pop{0%{transform:scale(.82);opacity:0}to{transform:scale(1);opacity:1}}@keyframes bnk-fade-up{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes bnk-pulse{50%{transform:scale(1.08)}}@keyframes bnk-spin{to{transform:rotate(360deg)}}@media(min-width:768px){.bnk-home{display:grid;grid-template-columns:repeat(2,1fr);max-width:960px;gap:18px}.bnk-home .bnk-link-row,.bnk-home .bnk-page-bar{grid-column:1 / -1}.bnk-tile{min-height:112px;padding:20px}.bnk-tile img{width:88px;height:88px}}@media(min-width:900px){.bnk-welcome-mascot{width:min(40vw,420px)}.bnk-explorer{padding:12px 32px 20px;gap:16px}.bnk-stage{grid-template-columns:80px 1fr 80px;grid-template-areas:"prev track next";max-width:980px;gap:12px 24px}.bnk-visual{width:min(100%,560px);min-height:min(360px,42vh);--bnk-visual-max: 48vh}.bnk-visual img{width:min(92%,500px);max-height:min(400px,44vh)}.bnk-swatch{width:240px;height:240px}.bnk-arrow{width:72px;height:72px}.bnk-word-hint{font-size:20px}}@media(min-width:1100px){.bnk-home{grid-template-columns:repeat(3,1fr);max-width:1180px;gap:20px}.bnk-tile-title{font-size:32px}.bnk-screen{padding:40px 32px 48px}}@media(min-width:1440px){.bnk-home{grid-template-columns:repeat(4,1fr);max-width:1400px}.bnk-explorer{width:min(1240px,100%)}.bnk-visual{width:min(100%,620px);min-height:min(400px,46vh)}.bnk-visual img{max-height:min(440px,44vh)}}@media(prefers-reduced-motion:reduce){.bnk-visual.is-active,.bnk-word-label,.bnk-speak,.bnk-loading,.bnk-tile,.bnk-welcome-mascot,.bnk-welcome,.bnk-sheet{animation:none;transition:none}.bnk-track-inner{transition:none}}html,body,#root{margin:0;padding:0;min-height:100%;background:linear-gradient(180deg,var(--bnk-blue-200),var(--bnk-blue-100) 40%,var(--bnk-paper));color:var(--bnk-ink);font-family:var(--bnk-font-body);font-size:18px;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}button,a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}h1,h2{font-family:var(--bnk-font-display)}