:root{--ink:#23343b;--muted:#617178;--cream:#fff9ec;--pink:#f6758e;--teal:#4e9c9b;--gold:#ffd66c}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Trebuchet MS","Arial Rounded MT Bold",system-ui,sans-serif;color:var(--ink);background:#d9eef0}button,a{font:inherit}.bank-game{min-height:100vh}.game-header{height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:10px clamp(14px,3vw,42px);background:#fffaf0;border-bottom:3px solid #d7c9aa;position:relative;z-index:20}.back{justify-self:start;padding:10px 15px;border-radius:999px;color:#486167;text-decoration:none;background:#fff;border:2px solid #d6dedc;font-weight:900}.game-title{display:flex;align-items:center;gap:10px}.game-title div{display:grid}.game-title small{font-size:10px;letter-spacing:.12em;color:#748487;font-weight:900}.game-title strong{font-size:22px}.vault-icon{width:45px;height:45px;display:grid;place-items:center;border-radius:50%;background:#678e9a;color:white;border:4px solid #456d78;font-size:24px;font-weight:900}.score{justify-self:end;display:flex;gap:7px;align-items:center;padding:10px 16px;border-radius:999px;background:white;border:2px solid #ead7a8;box-shadow:0 4px 0 #d8c28d;font-size:18px}.counter-scene{min-height:calc(100vh - 78px);display:grid;grid-template-columns:minmax(240px,34%) 1fr;position:relative;overflow:hidden;background:linear-gradient(#a8d5d4 0 45%,#c59264 45% 49%,#efd7aa 49%)}.bank-wall{position:absolute;inset:0 0 55% 0;background:linear-gradient(90deg,rgba(255,255,255,.08) 50%,transparent 50%) 0 0/80px 80px,linear-gradient(#bfded9,#98c9c4);border-bottom:8px solid #789c95}.clock{position:absolute;right:4%;top:25px;width:74px;height:74px;border:7px solid #fff4dc;border-radius:50%;background:#fdfbf0;box-shadow:0 4px 0 rgba(74,102,98,.2)}.clock:before,.clock:after{content:"";position:absolute;left:50%;top:50%;width:3px;height:22px;background:#587079;transform-origin:bottom}.clock:before{transform:translate(-50%,-100%) rotate(20deg)}.clock:after{height:17px;transform:translate(-50%,-100%) rotate(125deg)}.plant{position:absolute;left:3%;bottom:-8px;font-size:55px}.customer-area{position:relative;z-index:3;align-self:end;height:calc(100vh - 78px);min-height:640px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:25px 10px 0}.customer-area img{width:min(410px,94%);max-height:48%;object-fit:contain;filter:drop-shadow(0 14px 9px rgba(58,83,69,.25));animation:customerIdle 3.6s ease-in-out infinite}.speech{position:absolute;z-index:5;top:5%;left:6%;right:3%;padding:20px 22px;text-align:center;border:4px solid #d8c39a;border-radius:26px;background:#fffaf0;box-shadow:0 8px 0 rgba(101,120,103,.15)}.speech:after{content:"";position:absolute;bottom:-27px;left:47%;border:15px solid transparent;border-top-color:#d8c39a}.speech p,.speech span{display:block;margin:0;color:#667477}.speech strong{display:block;margin:5px 0;color:#e85f7c;font-size:clamp(35px,4vw,55px)}.customer-name{position:absolute;bottom:3%;padding:8px 24px;border-radius:999px;background:#fff8e7;border:3px solid #cfb987;font-weight:900}.teller-desk{position:relative;z-index:6;align-self:center;margin:24px clamp(16px,3vw,42px) 24px 0;padding:22px clamp(16px,2.5vw,32px);background:rgba(255,252,243,.97);border:5px solid #c39a6d;border-radius:28px;box-shadow:0 14px 0 #9d714e,0 24px 36px rgba(76,73,50,.25)}.round-row{display:flex;justify-content:space-between;color:#647477;font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.round-dots{display:flex;gap:6px}.round-dots i{width:12px;height:12px;border-radius:50%;background:#e0d8c7}.round-dots i.done{background:#f4bd47}.round-dots i.current{outline:3px solid #e6a932}.amount-panel{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:12px;align-items:center;margin:14px 0;padding:15px;border-radius:18px;background:#edf7f5;border:2px solid #c9e1dc;text-align:center}.amount-panel div{display:grid;gap:3px}.amount-panel small{font-size:10px;color:#71827f;font-weight:900;letter-spacing:.06em}.amount-panel strong{font-size:27px;color:#345e63}.amount-panel .left strong{color:#e76880}.equals{color:#9baaa7;font-size:22px}.instruction{text-align:center;margin:13px 0 10px;font-weight:900}.cash-drawer{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.note{min-height:84px;border:3px solid rgba(52,87,82,.35);border-radius:10px;cursor:pointer;box-shadow:0 5px 0 rgba(48,72,66,.27);transition:.12s;position:relative;overflow:hidden}.note:before,.mini-note:before{content:"";position:absolute;inset:6px;border:1px dashed rgba(255,255,255,.65);border-radius:5px}.note:hover,.note:focus-visible{transform:translateY(-3px);filter:saturate(1.1)}.note:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(48,72,66,.27)}.note span{display:block;font-size:26px;font-weight:900;color:#263e3e}.note small{position:relative;font-size:9px;text-transform:uppercase;font-weight:900;opacity:.75}.note-50{background:#e7bdcf}.note-20{background:#e8a874}.note-10{background:#8cc9c4}.note-5{background:#deb2df}.selected-wrap{margin-top:15px}.selected-wrap>span{display:block;margin-bottom:6px;color:#6d7977;font-size:12px;font-weight:900;text-transform:uppercase}.selected-notes{min-height:56px;display:flex;align-items:center;gap:7px;padding:8px;border:2px dashed #d6c9ad;border-radius:12px;background:#fffbf3;overflow-x:auto}.selected-notes em{margin:auto;color:#a19888;font-size:13px}.mini-note{position:relative;flex:0 0 65px;height:37px;display:grid;place-items:center;border-radius:5px;color:#2f4442;font-weight:900;border:2px solid rgba(66,83,76,.28)}.actions{display:grid;grid-template-columns:auto auto 1fr;gap:9px;margin-top:16px}.actions button{border:0;border-radius:999px;padding:12px 16px;font-weight:900;cursor:pointer}.secondary{background:#ede9df;color:#53615f}.serve{background:var(--pink);color:white;box-shadow:0 5px 0 #c84f69;font-size:16px}.actions button:disabled{opacity:.42;cursor:not-allowed;box-shadow:none}.feedback{min-height:25px;text-align:center;margin-top:10px;font-weight:900;color:#ca4d68}.feedback.good{color:#3d8c64}.over{animation:shake .35s}.correct-pop{animation:pop .45s}dialog{width:min(430px,90vw);padding:32px;border:5px solid #d1ae70;border-radius:28px;text-align:center;color:var(--ink);background:#fffaf0;box-shadow:0 20px 70px rgba(29,52,49,.4)}dialog::backdrop{background:rgba(23,57,59,.62);backdrop-filter:blur(4px)}dialog h2{margin:5px 0;font-size:34px}.finish-stars{font-size:38px}.earned{display:flex;justify-content:space-between;align-items:center;margin:20px 0;padding:15px 18px;border-radius:16px;background:#fff0ba}.earned strong{font-size:27px}.dialog-actions{display:grid;gap:10px}.dialog-actions button,.dialog-actions a{padding:13px;border-radius:999px;font-weight:900;text-decoration:none}.dialog-actions button{border:0;background:var(--pink);color:white}.dialog-actions a{color:#536765;background:#e9efea}@keyframes customerIdle{50%{transform:translateY(-5px)}}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@keyframes pop{50%{transform:scale(1.03)}}@media(max-width:850px){.counter-scene{grid-template-columns:1fr;overflow:visible}.customer-area{height:330px;min-height:0;padding:0;justify-content:flex-end}.customer-area img{height:205px;width:auto}.speech{top:14px;left:6%;right:auto;width:58%;padding:12px}.speech strong{font-size:34px}.speech p,.speech span{font-size:12px}.customer-name{bottom:2%}.teller-desk{margin:0 10px 28px;border-radius:24px}.bank-wall{bottom:auto;height:330px}.clock{display:none}}@media(max-width:570px){.game-header{height:65px}.game-title strong{font-size:17px}.game-title small{display:none}.vault-icon{width:37px;height:37px}.back span{display:none}.counter-scene{min-height:calc(100vh - 65px)}.amount-panel{gap:4px;padding:10px 5px}.amount-panel strong{font-size:21px}.amount-panel small{font-size:8px}.cash-drawer{grid-template-columns:1fr 1fr}.note{min-height:66px}.actions{grid-template-columns:1fr 1fr}.serve{grid-column:1/-1}.teller-desk{padding:18px 13px}.customer-area{height:295px}.bank-wall{height:295px}}@media(prefers-reduced-motion:reduce){.customer-area img{animation:none}.note{transition:none}}
