.hopper-page{padding-bottom:3rem}.hopper-shell{background:#120f32;color:#fff;border:2px solid #bca0ff;border-radius:1.35rem;padding:clamp(.8rem,3vw,1.8rem);box-shadow:0 18px 48px #1e104530}.hopper-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;flex-wrap:wrap}.hopper-head h2{margin:0}.hopper-head label{display:grid;gap:.35rem;font-weight:850}.hopper-head select{min-height:44px;border:2px solid #bca0ff;border-radius:.7rem;padding:.45rem .7rem;background:#fff;color:#21113e;font:inherit}.hopper-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:.55rem;margin:1rem 0}.hopper-stats div{display:grid;gap:.12rem;background:#34205d;border-radius:.75rem;padding:.65rem}.hopper-stats small{font-size:.875rem;color:#e7dcff}.hopper-stats strong{font-size:1.08rem}.hopper-canvas{display:block;width:100%;height:auto;border:3px solid #9d7cff;border-radius:.85rem;background:#151341;image-rendering:pixelated}.hopper-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:1rem 0}.hopper-controls button,.hopper-actions button{min-height:52px;border:2px solid #b993ff;border-radius:.78rem;background:#f8f2ff;color:#24123c;font:inherit;font-weight:900;padding:.55rem .8rem;cursor:pointer;touch-action:manipulation}.hopper-controls button:nth-child(2){background:#69f0c0;border-color:#9effda}.hopper-actions{display:flex;justify-content:center;gap:.65rem;flex-wrap:wrap}.hopper-actions button{min-width:9rem}.hopper-actions .next{background:#ffe66d;border-color:#fff19e}.hopper-status{min-height:2.8rem;color:#fff0a5;font-weight:800;line-height:1.45}.hopper-note{color:#eee5ff;line-height:1.6}.hopper-guide{margin-top:1.4rem}.hopper-controls button:focus-visible,.hopper-actions button:focus-visible,.hopper-head select:focus-visible{outline:3px solid #62ffe0;outline-offset:3px}.hopper-controls button:disabled,.hopper-actions button:disabled{opacity:.4;cursor:not-allowed}@media(max-width:700px){.hopper-shell{padding:.65rem}.hopper-stats{grid-template-columns:repeat(2,1fr)}.hopper-controls button{font-size:.92rem;padding:.45rem}.hopper-actions button{flex:1 1 40%}}
