*{box-sizing:border-box;margin:0;padding:0}body{color:#ededed;overflow:hidden;background-color:#121214;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}@media (max-width:768px){body{overflow:auto}}h1{letter-spacing:2px;color:#4caf50;text-transform:uppercase;font-size:2rem;font-weight:700}#root,.app-container{display:flex;position:relative;width:100vw;height:100vh}@media (min-width:769px){.app-container{flex-direction:row}}@media (max-width:768px){.app-container{flex-direction:column;width:100%;height:auto}}.left-tab{display:flex;user-select:none;cursor:pointer;overflow:hidden;background:linear-gradient(135deg,#0f0f11 0%,#08080a 100%);border-right:1px solid #ffffff0d;flex-direction:column;flex:0 0 50%;justify-content:center;align-items: center;gap:1.5rem;padding:4rem 2rem 2rem;transition:background-color .2s}@media (min-width:769px){.left-tab{border-bottom:none;border-right:1px solid #ffffff0d;flex:0 0 50%;padding:16rem 2rem 5rem}}@media (max-width:768px){.left-tab{overflow-y:auto;border-bottom:1px solid #ffffff0d;border-right:none;flex:none;min-height:40vh;max-height:50vh;padding:3rem 1rem 2rem}}.left-tab:active{background:linear-gradient(135deg,#252529 0%,#1a1a1f 100%)}.right-tab{display:flex;overflow:hidden;position:relative;background:#050505;flex:0 0 50%;align-items:stretch;height:100%;padding-top:1.5rem}@media (min-width:769px){.right-tab{overflow:hidden;flex-direction:row;flex:0 0 50%;height:100%}}@media (max-width:768px){.right-tab{overflow-y:auto;flex-direction:column;flex:1;height:auto;padding-top:1rem}}.controls-col{display:flex;overflow-y:auto;position:relative;border-right:1px solid #ffffff0d;flex-direction:column;flex:0 0 60%;align-items: center;gap:.5rem;padding:1rem 1.5rem 2rem 2rem;font-size:1.05em}@media (min-width:769px){.controls-col{border-bottom:none;border-right:1px solid #ffffff0d;flex:0 0 60%;padding:16rem 1.5rem 3rem 2rem}}@media (max-width:768px){.controls-col{border-bottom:1px solid #ffffff0d;border-right:none;flex:none;padding:1rem 1.5rem 2rem}}.presets-col{display:flex;overflow-y:auto;flex-direction:column;flex:1;align-items: flex-start;gap:1rem;height:100%;min-height:0;padding:.5rem 1.5rem 0}@media (max-width:768px){.presets-col{height:auto;min-height:auto;padding:1rem 1.5rem}}.title-ghost,.title-mitts{position:absolute;letter-spacing:-4px;z-index:10;pointer-events:none;white-space:nowrap;font-size:clamp(4rem,12vw,10.5rem);font-weight:800;line-height:1;top:2rem}.title-ghost{color:#aaa;padding-right:.05em;right:50%}.title-mitts{color:#333;padding-left:.05em;left:50%}@media (max-width:768px){.title-ghost,.title-mitts{font-size:clamp(2rem,8vw,4rem);top:.5rem}.title-ghost{left:1rem;right:auto}.title-mitts{left:auto;right:1rem}}.look-straight{letter-spacing:3px;color:#333;text-transform:uppercase;text-align:center;flex:1;font-size:clamp(.65rem,1.5vw,1rem);font-weight:700}.idle-text{color:#444;letter-spacing:2px;text-transform:uppercase;font-size:clamp(1.2rem,3vw,2rem);font-weight:600}.toggle-container{display:flex;background-color:#1a1a1a;border-radius:999px;flex-shrink:0;align-items: center;width:100%;max-width:280px;margin-bottom:2.5rem;padding:4px}.toggle-btn{color:#666;cursor:pointer;background:0 0;border:none;border-radius:999px;flex:1;padding:.6rem 1rem;transition:all .2s;font-size:.95rem;font-weight:600}.toggle-btn.active{color:#121214;background-color:#ededed;box-shadow:0 2px 8px #ffffff1a}.controls{display:flex;flex-direction:column;align-items:stretch;gap:1.8rem;width:100%;max-width:280px}.input-group{display:flex;flex-direction:column;gap:.5rem;width:100%}.input-label{color:#666;text-transform:uppercase;letter-spacing:1px;font-size:.8rem;font-weight:600}.styled-input{color:#fff;text-align:center;outline:none;background:#111;border:1px solid #333;border-radius:12px;width:100%;padding:1.1rem;transition:border-color .2s;font-size:1.8rem;font-weight:700}.styled-input:focus{border-color:#666}.styled-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.styled-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.styled-input[type=number]{-moz-appearance:textfield;appearance:textfield}.time-inputs{display:flex;gap:1rem;width:100%}.button-group{display:flex;flex-direction:column;gap:.8rem;width:100%}.start-btn,.reset-btn,.pause-btn{cursor:pointer;text-transform:uppercase;letter-spacing:1px;border-radius:12px;width:100%;padding:1.1rem;transition:transform .1s,background-color .15s,opacity .15s;font-size:1rem;font-weight:700}.start-btn{color:#fff;background-color:#4caf50;border:none}.start-btn:hover{background-color:#45a049}.start-btn:active{transform:scale(.97)}.reset-btn{color:#e53935;background-color:#0000;border:1px solid #e53935}.reset-btn:hover{background-color:#e539351a}.reset-btn:active{transform:scale(.97)}.pause-btn{color:#ff9800;background-color:#0000;border:1px solid #ff9800}.pause-btn:hover{background-color:#ff98001a}.pause-btn:active{transform:scale(.97)}.speed-container{display:flex;border-bottom:1px solid #1e1e1e;flex-direction:column;gap:.8rem;width:100%;margin-bottom:1rem;padding-bottom:2rem}.speed-header{display:flex;justify-content:space-between;align-items: center}.speed-label{letter-spacing:2px;color:#444;text-transform:uppercase;font-size:.75rem;font-weight:700}.speed-value{color:#aaa;font-variant-numeric:tabular-nums;font-size:.9rem;font-weight:700}.speed-interactive{display:flex;align-items: center;gap:.4rem}.speed-input-text{color:#fff;text-align:center;outline:none;background:0 0;border:1px solid #333;border-radius:4px;width:70px;padding:2px 8px;font-family:inherit;font-size:.9rem;font-weight:700}.speed-input-text:focus{border-color:#4caf50;box-shadow:0 0 5px #4caf5033}.speed-slider-wrapper{position:relative;width:100%;padding:10px 0 45px}.speed-slider{-webkit-appearance:none;appearance:none;outline:none;position:relative;z-index:2;background:#1a1a1a;border-radius:2px;width:100%;height:4px}.speed-marker{position:absolute;display:flex;pointer-events:none;z-index:1;flex-direction:column;align-items: center;top:38px;transform:translate(-50%)}.speed-marker-chevron{color:#666;opacity:.8;margin-bottom:2px}.speed-marker-label{color:#666;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;font-size:.65rem;font-weight:700}.speed-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:pointer;background:#4caf50;border-radius:50%;width:16px;height:16px;transition:all .2s;box-shadow:0 0 10px #4caf504d}.speed-slider::-webkit-slider-thumb:hover{background:#45a049;transform:scale(1.2)}.speed-slider::-moz-range-thumb{cursor:pointer;background:#4caf50;border:none;border-radius:50%;width:16px;height:16px;transition:all .2s;box-shadow:0 0 10px #4caf504d}.speed-slider::-moz-range-thumb:hover{background:#45a049;transform:scale(1.2)}.presets-header{display:flex;border-bottom:1px solid #1e1e1e;justify-content:space-between;align-items: center;width:100%;margin-bottom:1rem;padding-bottom:.8rem}.presets-label{letter-spacing:2px;color:#444;text-transform:uppercase;border-bottom:none;width:auto;padding:0;font-size:.75rem;font-weight:700}.preset-selector-wrapper{position:relative}.preset-dropdown{appearance:none;color:#eee;cursor:pointer;outline:none;background-color:#1a1a1a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right .7rem center;background-repeat:no-repeat;background-size:.9rem;border:1px solid #333;border-radius:12px;padding:.45rem 2.2rem .45rem 1rem;transition:all .2s;font-size:.85rem;font-weight:600}.preset-dropdown:hover{background-color:#222;border-color:#555}.preset-dropdown:focus{border-color:#4caf50;box-shadow:0 0 0 2px #4caf5033}.preset-dropdown option{color:#eee;background-color:#1a1a1a}.punch-list{display:flex;flex-direction:column;gap:.6rem;width:100%}.punch-row{display:flex;background:#0d0d0d;border:1px solid #1a1a1a;border-radius:10px;align-items: center;gap:.9rem;padding:.6rem .8rem;transition:border-color .15s}.punch-row:hover{border-color:#333}.punch-num{color:#555;text-align:center;flex-shrink:0;width:1.4rem;font-size:1.4rem;font-weight:800}.punch-info{display:flex;flex-direction:column;gap:.1rem}.punch-name{color:#ccc;font-size:.95rem;font-weight:600}.punch-hand{color:#444;text-transform:uppercase;letter-spacing:.5px;font-size:.72rem;font-weight:500}.punch-name-select{appearance:none;color:#ccc;cursor:pointer;outline:none;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23444' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 0 center/.75rem no-repeat;border:none;max-width:150px;padding:0 1.2rem 0 0;font-family:inherit;font-size:.9rem;font-weight:600}.punch-name-select:focus{color:#fff}.punch-name-select option{color:#eee;background:#1a1a1a}.punch-row--locked{opacity:.7}.punch-remove-btn{color:#444;cursor:pointer;background:0 0;border:none;flex-shrink:0;margin-left:auto;padding:0 .2rem;transition:color .15s;font-size:1.1rem;line-height:1}.punch-remove-btn:hover{color:#e53935}.punch-add-btn{display:flex;cursor:pointer;color:#444;background:0 0;border:1px dashed #2a2a2a;border-radius:10px;align-items: center;gap:.6rem;width:100%;padding:.55rem .8rem;transition:all .2s;font-family:inherit}.punch-add-btn:hover{color:#4caf50;background:#4caf500d;border-color:#4caf50}.punch-add-icon{font-size:1.1rem;font-weight:700;line-height:1}.punch-add-label{text-transform:uppercase;letter-spacing:1px;flex:1;font-size:.85rem;font-weight:600}.punch-add-cap{opacity:.5;font-size:.72rem;font-weight:600}.punch-cap-notice{text-align:center;color:#333;letter-spacing:1px;text-transform:uppercase;width:100%;padding:.4rem 0;font-size:.75rem}.generation-settings-toggle{color:#ddd;letter-spacing:.6px;text-transform:uppercase;cursor:pointer;background:#111;border:1px solid #333;border-radius:10px;width:100%;margin-top:.4rem;padding:.6rem .8rem;transition:all .15s;font-family:inherit;font-size:.82rem;font-weight:700}.generation-settings-toggle:hover{color:#fff;border-color:#4caf50}.generation-modal-backdrop{position:fixed;display:flex;z-index:2000;background:#0000009e;justify-content:center;align-items: center;padding:1.5rem;inset:0}.generation-modal{display:flex;overflow:hidden;background:linear-gradient(#0f0f12 0%,#09090b 100%);border:1px solid #232323;border-radius:14px;flex-direction:column;width:min(920px,100%);max-height:min(820px,92vh);box-shadow:0 24px 80px #0000008c}.generation-modal-header{display:flex;border-bottom:1px solid #1e1e1e;justify-content:space-between;align-items: center;padding:.9rem 1rem}.generation-modal-title{color:#ececec;letter-spacing:.7px;text-transform:uppercase;margin:0;font-size:.95rem}.generation-modal-close{color:#777;cursor:pointer;background:0 0;border:none;padding:.1rem .3rem;font-size:1.35rem;line-height:1}.generation-modal-close:hover{color:#fff}.generation-modal-body{overflow-y:auto;display:flex;flex-direction:column;gap:1rem;padding:1rem}.generation-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.generation-control-card{background:#0d0d0f;border:1px solid #232323;border-radius:10px;padding:.8rem}.generation-control-card--wide{grid-column:1/-1}.generation-control-top{display:flex;justify-content:space-between;align-items: center;margin-bottom:.5rem}.generation-control-label{color:#6f6f6f;letter-spacing:.8px;text-transform:uppercase;font-size:.72rem;font-weight:700}.generation-control-value{color:#e0e0e0;font-size:.85rem;font-weight:700}.generation-control-slider{-webkit-appearance:none;appearance:none;outline:none;cursor:pointer;background:#0a0a0a;border-radius:3px;width:100%;height:6px}.generation-control-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:pointer;background:#4caf50;border-radius:50%;width:18px;height:18px;transition:all .15s;box-shadow:0 0 8px #4caf504d}.generation-control-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 0 12px #4caf5080}.generation-control-slider::-moz-range-thumb{cursor:pointer;background:#4caf50;border:none;border-radius:50%;width:18px;height:18px;transition:all .15s;box-shadow:0 0 8px #4caf504d}.generation-control-slider::-moz-range-thumb:hover{transform:scale(1.15);box-shadow:0 0 12px #4caf5080}.generation-control-slider::-moz-range-track{background:0 0;border:none}.generation-visual-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:.8rem}.generation-viz-card{display:flex;background:#0d0d0f;border:1px solid #232323;border-radius:10px;flex-direction:column;gap:.6rem;padding:.8rem}.generation-viz-header h4{color:#e6e6e6;letter-spacing:.5px;text-transform:uppercase;margin:0;font-size:.82rem}.generation-viz-header p{color:#666;margin:.2rem 0 0;font-size:.73rem}.generation-viz-chart{background:#09090a;border-radius:8px;width:100%;height:180px}.generation-viz-bar{fill:#4caf5047}.generation-viz-line{fill:none;stroke:#4caf50;stroke-width:2.2}.generation-viz-axis{fill:#666;font-size:11px;font-weight:600}.generation-stats-row{display:flex;flex-wrap:wrap;gap:.5rem}.generation-stats-row span{color:#8a8a8a;text-transform:uppercase;letter-spacing:.5px;border:1px solid #242424;border-radius:999px;padding:.2rem .5rem;font-size:.7rem}.generation-length-bars{display:flex;background:#09090a;border-radius:8px;align-items: flex-end;gap:.35rem;min-height:150px;padding:.3rem}.generation-length-item{display:flex;flex-direction:column;flex:1;align-items: center;gap:.35rem}.generation-length-fill{background:linear-gradient(#4caf50e6 0%,#4caf5040 100%);border-radius:6px 6px 2px 2px;width:100%;max-width:26px}.generation-length-label{color:#6a6a6a;font-size:.7rem;font-weight:700}.generation-viz-footnote{color:#656565;border:1px dashed #2a2a2a;border-radius:10px;padding:.6rem .7rem;font-size:.72rem}@media (max-width:900px){.generation-control-grid,.generation-visual-grid{grid-template-columns:1fr}.generation-modal{max-height:94vh}}.auth-panel{width:100%;max-width:280px;margin-top:auto;padding-top:1rem}.auth-secondary-btn,.auth-submit{color:#ddd;letter-spacing:.7px;text-transform:uppercase;cursor:pointer;background:#111;border:1px solid #2f2f2f;border-radius:10px;width:100%;padding:.65rem .8rem;font-family:inherit;font-size:.82rem;font-weight:700}.auth-secondary-btn:hover,.auth-submit:hover{color:#fff;border-color:#4caf50}.auth-link-prompt{color:#6e6e6e;letter-spacing:.4px;text-decoration:underline;text-underline-offset:2px;cursor:pointer;text-align:center;background:0 0;border:none;width:100%;font-size:.75rem}.auth-link-prompt:hover{color:#afafaf}.auth-connection{text-align:center;letter-spacing:.6px;text-transform:uppercase;margin-top:.45rem;font-size:.68rem}.auth-connection.ok{color:#4caf50}.auth-connection.down{color:#ef9a9a}.auth-connection.pending{color:#777}.auth-logged-in{display:flex;flex-direction:column;gap:.55rem}.auth-user{color:#7b7b7b;text-align:center;font-size:.78rem}.auth-modal-backdrop{position:fixed;z-index:2200;display:flex;background:#0009;justify-content:center;align-items: center;padding:1rem;inset:0}.auth-modal{display:flex;background:#0d0d10;border:1px solid #262626;border-radius:12px;flex-direction:column;gap:.8rem;width:min(420px,100%);padding:.9rem}.auth-form-viewport{overflow:hidden;width:100%}.auth-form-track{display:flex;width:200%;transition:transform .22s}.auth-form-track.login{transform:translate(0%)}.auth-form-track.register{transform:translate(-50%)}.auth-form-page{box-sizing:border-box;display:flex;flex-direction:column;gap:.6rem;width:50%;padding-right:.2rem}.auth-mode-copy{color:#727272;margin:0;font-size:.75rem}.auth-modal-top{display:flex;justify-content:space-between;align-items: center}.auth-modal-top h3{color:#eee;text-transform:uppercase;letter-spacing:.7px;margin:0;font-size:.9rem}.auth-close{color:#888;cursor:pointer;background:0 0;border:none;font-size:1.35rem}.auth-close:hover{color:#fff}.auth-switch-row{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}.auth-switch-btn{color:#999;cursor:pointer;text-transform:uppercase;background:#111;border:1px solid #2a2a2a;border-radius:8px;padding:.45rem;font-size:.72rem;font-weight:700}.auth-switch-btn.active{color:#e8f5e9;border-color:#4caf50}.auth-form-row{display:flex;flex-direction:column;gap:.3rem}.auth-form-row label{color:#666;letter-spacing:.8px;text-transform:uppercase;font-size:.72rem;font-weight:700}.auth-input{color:#fff;outline:none;background:#121214;border:1px solid #2f2f2f;border-radius:8px;padding:.65rem .75rem}.auth-input:focus{border-color:#4caf50}.auth-error{color:#ef9a9a;background:#e5393514;border:1px solid #e5393566;border-radius:8px;padding:.5rem .6rem;font-size:.76rem}.fullname-toggle{display:flex;cursor:pointer;user-select:none;align-items: center;gap:.6rem;width:100%;padding:.2rem 0}.fullname-toggle input[type=checkbox]{cursor:pointer;accent-color:#4caf50;width:1.1rem;height:1.1rem;margin:0;transform:translateY(-.05em)}.fullname-toggle-label{color:#666;text-transform:uppercase;letter-spacing:1px;transition:color .15s;font-size:.8rem;font-weight:600;line-height:1}.fullname-toggle:hover .fullname-toggle-label{color:#aaa}.time-display{font-variant-numeric:tabular-nums;letter-spacing:-2px;color:#fff;font-size:clamp(4rem,12vw,11rem);font-weight:800}.combo-status{text-align:center;display:flex;flex-direction:column;gap:1rem}.combo-small{color:#aaa;font-size:clamp(1.2rem,3vw,1.8rem);font-weight:500}.combo-large{color:#fff;font-size:clamp(3rem,7vw,5.5rem);font-weight:800}.display-wrapper{display:flex;flex-direction:column;align-items: center;gap:.75rem}.current-combo{color:#ff5e5e;text-align:center;letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 24px #ff5e5e40;max-width:90%;font-size:clamp(1.6rem,4vw,2.8rem);font-weight:700;line-height:1.3}.generated-combos-list{overflow-y:auto;display:flex;flex-direction:column;align-items: center;gap:.35rem;width:min(38rem,90%);max-height:12rem;margin-top:1rem}.generated-combo-row{color:#d8d8d8;letter-spacing:.08em;font-size:clamp(1rem,2.5vw,1.45rem);font-weight:700}.practice-totals{color:#555;text-transform:uppercase;letter-spacing:1.5px;white-space:nowrap;pointer-events:none;text-align:right;flex:1;font-size:.85rem;font-weight:600}.account-prompt{position:absolute;color:#555;letter-spacing:.5px;pointer-events:none;z-index:100;text-align:center;opacity:.8;white-space:nowrap;font-size:.75rem;font-weight:500;bottom:.5rem;left:50%;transform:translate(-50%)}.bottom-toggles{display:flex;flex-direction:column;align-items: flex-start;gap:.4rem}.left-bottom-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items: start;width:100%;margin-top:auto;padding:0 1rem}.left-bottom-bar>.look-straight,.left-bottom-bar>.practice-totals{margin-top:.15rem}