*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--alu-50: #fafafa;--alu-100: #f2f2f2;--alu-200: #e6e6e6;--alu-300: #d4d4d4;--alu-400: #c2c2c2;--alu-500: #b0b0b0;--alu-600: #9e9e9e;--alu-700: #8c8c8c;--alu-800: #6e6e6e;--oled-bg: #000;--oled-text: #f8f8f8;--oled-dim: #6b6b6b;--accent: #f26522;--accent-hover: #ff7a3d;--accent-glow: rgba(242, 101, 34, .35);--accent-subtle: rgba(242, 101, 34, .08);--red: #ff3b30;--red-glow: rgba(255, 59, 48, .4);--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 14px;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif;--font-mono: "SF Mono", ui-monospace, "Menlo", "Cascadia Code", monospace}html,body{height:100%;font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{background:linear-gradient(180deg,#fdfdfd,#f4f4f4 40%,#ebebeb);display:flex;align-items:center;justify-content:center;min-height:100vh}.app{display:flex;align-items:center;justify-content:center;width:100%;min-height:100vh;perspective:1400px}.tp7-wrapper{display:flex;flex-direction:column;align-items:center;gap:24px;min-height:100vh;width:100%;padding:48px 24px;transition:background .4s var(--ease-out);position:relative}.tp7-wrapper.dark-mode{background:linear-gradient(180deg,#1a1a1a,#121212,#0a0a0a)}.tp7-device{display:flex;align-items:stretch;position:relative;filter:drop-shadow(0 60px 120px rgba(0,0,0,.12)) drop-shadow(0 16px 48px rgba(0,0,0,.08)) drop-shadow(0 4px 16px rgba(0,0,0,.05));transition:filter .5s var(--ease-out),transform .5s var(--ease-out)}.tp7-device:hover{filter:drop-shadow(0 70px 140px rgba(0,0,0,.14)) drop-shadow(0 20px 56px rgba(0,0,0,.1)) drop-shadow(0 6px 20px rgba(0,0,0,.06));transform:translateY(-2px)}.tp7-chassis{position:relative;width:370px;min-height:520px;background:linear-gradient(168deg,#d8d8d8,#d0d0d0 15%,#c8c8c8 40%,#c4c4c4,#c8c8c8 80%,#d0d0d0 95%,#d4d4d4);border-radius:var(--radius-xl);border:.5px solid var(--alu-500);box-shadow:inset 0 .5px #ffffffe6,inset 0 -.5px #0000000a;display:flex;flex-direction:column;overflow:hidden;transition:box-shadow .3s var(--ease-out)}.tp7-chassis:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-xl);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.012'/%3E%3C/svg%3E");pointer-events:none;z-index:1}.tp7-chassis.drag-over{box-shadow:inset 0 .5px #ffffffe6,0 0 0 2.5px var(--accent),0 0 24px var(--accent-glow)}.tp7-chassis.recording{box-shadow:inset 0 .5px #ffffffe6,0 0 0 1.5px #ff3b3040,0 0 32px #ff3b300f}.tp7-upper{display:flex;justify-content:space-between;align-items:flex-start;padding:20px 22px 10px;position:relative;z-index:2}.tp7-model{font-size:14px;font-weight:600;letter-spacing:.8px;color:var(--alu-700);font-family:var(--font-sans)}.tp7-upper-left{display:flex;flex-direction:column;gap:12px}.tp7-mic-hole{width:5px;height:5px;border-radius:50%;background:#999;box-shadow:inset 0 1px 2px #0006;margin-left:2px}.display-panel{width:auto}.oled-screen{background:var(--oled-bg);border-radius:var(--radius-sm);padding:8px 12px;min-width:120px;min-height:46px;display:flex;flex-direction:column;justify-content:center;gap:2px;box-shadow:inset 0 1.5px 5px #000000f2,inset 0 0 2px #000,0 .5px #ffffff40;border:.5px solid #111}.oled-title{font-family:var(--font-sans);font-size:11px;font-weight:700;color:var(--oled-text);letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:96px}.oled-bottom{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.oled-time{font-family:var(--font-mono);font-size:10.5px;font-weight:400;color:#fff9;letter-spacing:.1px}.oled-track-num{font-family:var(--font-sans);font-size:8px;font-weight:600;color:var(--oled-text);background:#ffffff1a;padding:2px 5px;border-radius:3px;border:.5px solid rgba(255,255,255,.15)}.oled-status-line{font-family:var(--font-mono);font-size:8px;color:#ffffff59;letter-spacing:.2px;margin-top:1px}.oled-vol{font-size:6px;letter-spacing:.5px;opacity:.7}.oled-error{font-family:var(--font-sans);font-size:9px;color:var(--red)}.oled-screen.oled-recording{box-shadow:inset 0 1.5px 5px #000000f2,inset 0 0 2px #000,0 0 8px #ff3b301f;border-color:#ff3b3040}.oled-rec-title{color:var(--red)!important;display:flex;align-items:center;gap:5px}.rec-indicator{color:var(--red);font-size:7px;animation:pulse-rec 1.2s ease-in-out infinite}.oled-rec-time{color:#ff7878d9!important}.tp7-reel-section{display:flex;align-items:center;justify-content:center;padding:4px 0 8px;position:relative;z-index:2;flex:1}.reel-container{position:relative;display:flex;align-items:center;justify-content:center}.reel-svg{cursor:grab;-webkit-user-select:none;user-select:none;transition:filter .25s var(--ease-out)}.reel-svg:hover{filter:brightness(1.015) contrast(1.01)}.reel-svg:active,.reel-svg.scratching{cursor:grabbing;filter:brightness(.98) contrast(1.02)}.reel-svg.tape-stopped{filter:brightness(.95) saturate(.85)}.tp7-lower{background:linear-gradient(180deg,#d0d0d0,#c8c8c8 30%,#c4c4c4 70%,#c8c8c8);border-top:none;margin-top:4px;box-shadow:0 -2px #0000000a,inset 0 1px #ffffff80;padding:14px 16px 16px;position:relative;z-index:2;border-top:1px solid rgba(0,0,0,.08)}.transport-controls{display:flex;gap:5px;align-items:stretch}.transport-btn{flex:1;height:56px;border:none;border-radius:var(--radius-sm);background:linear-gradient(180deg,var(--alu-200) 0%,var(--alu-300) 25%,var(--alu-400) 75%,var(--alu-300) 100%);box-shadow:0 2.5px 0 var(--alu-600),0 4px 10px #0000001a,inset 0 1px #ffffffa6,inset 0 -.5px #00000008;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--alu-700);transition:all .06s ease;position:relative}.transport-btn:hover:not(:disabled){background:linear-gradient(180deg,var(--alu-100) 0%,var(--alu-200) 25%,var(--alu-300) 75%,var(--alu-200) 100%);color:var(--alu-800)}.transport-btn:active:not(:disabled){box-shadow:0 .5px 0 var(--alu-600),0 1px 3px #00000014,inset 0 2px 6px #0000000f;transform:translateY(2px)}.transport-btn:disabled{opacity:.4;cursor:default}.transport-btn.active{box-shadow:0 .5px 0 var(--alu-600),0 1px 3px #00000014,inset 0 2px 6px #0000000f;transform:translateY(2px);color:var(--alu-800)}.rec-dot{width:11px;height:11px;border-radius:50%;background:var(--accent);transition:all .3s var(--ease-out)}.rec-dot.pulsing{animation:pulse-rec 1.2s ease-in-out infinite;background:var(--red);box-shadow:0 0 14px var(--red-glow)}.record-btn.recording{box-shadow:0 .5px 0 var(--alu-600),0 1px 3px #00000014,inset 0 2px 6px #0000000f;transform:translateY(2px)}.record-btn:disabled{opacity:.4}@keyframes pulse-rec{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.75)}}.loop-btn.active{color:var(--accent)!important}.side-rocker{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:55px;margin-right:-2px;z-index:3;gap:4px}.side-rocker.disabled{opacity:.35;pointer-events:none}.rocker-arrow-zone{display:flex;align-items:center;justify-content:center;width:16px;height:14px;color:var(--alu-600)}.rocker-arrow-icon{opacity:.5}.rocker-lever-wrap{width:10px;height:180px;display:flex;align-items:center;justify-content:center;position:relative}.rocker-lever{width:8px;height:160px;background:linear-gradient(180deg,var(--alu-300) 0%,var(--alu-400) 50%,var(--alu-300) 100%);border-radius:4px;border:.5px solid var(--alu-500);box-shadow:-1px 0 3px #00000014,inset 0 .5px #ffffff80,inset 0 -.5px #0000000d;position:relative;cursor:pointer;transition:transform .15s cubic-bezier(.34,1.56,.64,1);transform-origin:center center;display:flex;flex-direction:column}.rocker-lever.active{box-shadow:-1px 0 2px #0000001a,inset 0 .5px #fff6}.rocker-lever-top,.rocker-lever-bottom{flex:1;width:100%;cursor:pointer}.rocker-lever-top{border-radius:4px 4px 0 0}.rocker-lever-bottom{border-radius:0 0 4px 4px}.rocker-pivot{width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,var(--alu-200) 0%,var(--alu-400) 100%);border:.5px solid var(--alu-500);box-shadow:0 1px 2px #0000001a,inset 0 .5px #ffffff80;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2}.rocker-label{font-size:6px;color:var(--alu-600);margin-top:4px;letter-spacing:.5px;font-weight:500}.rocker-speed-indicator{font-size:8px;font-weight:700;color:var(--accent);margin-top:2px;letter-spacing:.3px;animation:guide-fade-in .2s ease both}.dark-mode .rocker-lever{background:linear-gradient(180deg,#3a3a3a,#2a2a2a,#353535);border-color:#1a1a1a;box-shadow:-1px 0 3px #0003,inset 0 .5px #ffffff0d}.dark-mode .rocker-pivot{background:linear-gradient(135deg,#4a4a4a,#333);border-color:#1a1a1a}.dark-mode .rocker-arrow-zone{color:#555}.io-ports{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:54px;margin-left:-1px;gap:8px;z-index:3}.side-btn{width:26px;height:26px;border-radius:50%;border:.5px solid var(--alu-500);background:linear-gradient(180deg,var(--alu-200) 0%,var(--alu-400) 100%);box-shadow:0 2px 4px #0000001a,inset 0 .5px #ffffff80;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--alu-700);font-size:9px;font-weight:700;transition:all .08s ease}.side-btn:hover:not(:disabled){background:linear-gradient(180deg,var(--alu-100) 0%,var(--alu-300) 100%);transform:scale(1.05)}.side-btn:active:not(:disabled){transform:scale(.9);box-shadow:0 1px 2px #00000014,inset 0 1px 3px #00000014}.side-btn:disabled{cursor:default;opacity:.5}.m-btn{background:var(--accent);border-color:#d45a1a;color:#fff;font-size:9px;font-weight:800;letter-spacing:-.2px;box-shadow:0 2px 5px #f265224d,inset 0 .5px #ffffff40}.m-btn:hover:not(:disabled){background:var(--accent-hover)}.active-btn{box-shadow:0 0 0 2px var(--accent),0 2px 6px #f2652240!important}.knurled-dial,.knurled-dial.interactive,.dial-knurl,.dial-level{display:none}.volume-knob{width:40px;height:40px;margin-top:80px;border-radius:50%;cursor:default;position:relative;display:flex;align-items:center;justify-content:center}.volume-knob.interactive{cursor:ns-resize}.volume-knob.dragging{cursor:grabbing}.knob-body{width:36px;height:36px;border-radius:50%;background:linear-gradient(145deg,var(--alu-200) 0%,var(--alu-400) 50%,var(--alu-300) 100%);border:.5px solid var(--alu-500);box-shadow:0 3px 8px #00000026,0 1px 3px #0000001a,inset 0 1px #fff6,inset 0 -1px #0000000d;position:relative;transition:transform .05s ease-out;overflow:hidden}.volume-knob.dragging .knob-body{box-shadow:0 2px 6px #0003,0 1px 3px #0000001f,inset 0 1px #ffffff4d,inset 0 -1px #00000014}.knob-notch{position:absolute;top:0;left:50%;width:1px;height:100%;transform-origin:center center}.knob-notch:before{content:"";position:absolute;top:1px;left:0;width:1px;height:4px;background:var(--alu-600);border-radius:.5px;opacity:.5}.knob-notch:after{content:"";position:absolute;bottom:1px;left:0;width:1px;height:4px;background:var(--alu-600);border-radius:.5px;opacity:.5}.knob-indicator{position:absolute;top:3px;left:50%;width:2px;height:8px;margin-left:-1px;background:var(--accent);border-radius:1px;box-shadow:0 0 4px #f2652266}.dark-mode .knob-body{background:linear-gradient(145deg,#444,#2e2e2e,#383838);border-color:#1a1a1a;box-shadow:0 3px 8px #0000004d,0 1px 3px #0003,inset 0 1px #ffffff0f,inset 0 -1px #0003}.dark-mode .knob-notch:before,.dark-mode .knob-notch:after{background:#555}.drop-hint{position:absolute;bottom:74px;left:50%;transform:translate(-50%);font-size:9px;color:var(--alu-600);letter-spacing:.2px;font-weight:400;pointer-events:none;opacity:.6}.drop-active{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--accent-subtle);border-radius:var(--radius-xl);font-size:11px;color:var(--accent);font-weight:500;letter-spacing:.2px;pointer-events:none;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.tape-stop-indicator{display:none}.dark-mode{background:linear-gradient(180deg,#1a1a1a,#131313,#0e0e0e)}.dark-mode .tp7-device{filter:drop-shadow(0 60px 120px rgba(0,0,0,.5)) drop-shadow(0 16px 48px rgba(0,0,0,.35)) drop-shadow(0 4px 16px rgba(0,0,0,.2))}.dark-mode .tp7-device:hover{filter:drop-shadow(0 70px 140px rgba(0,0,0,.55)) drop-shadow(0 20px 56px rgba(0,0,0,.4)) drop-shadow(0 6px 20px rgba(0,0,0,.25))}.dark-mode .tp7-chassis{background:linear-gradient(168deg,#3a3a3a,#2e2e2e 25%,#252525 55%,#2a2a2a 80%,#303030);border-color:#1a1a1a;box-shadow:inset 0 .5px #ffffff14,inset 0 -.5px #00000080}.dark-mode .tp7-chassis:before{opacity:.02}.dark-mode .tp7-model{color:#6a6a6a}.dark-mode .reel-svg{filter:brightness(.55) contrast(1.1) saturate(.8)}.dark-mode .reel-svg:hover{filter:brightness(.58) contrast(1.1) saturate(.8)}.dark-mode .reel-svg:active,.dark-mode .reel-svg.scratching{filter:brightness(.52) contrast(1.15) saturate(.75)}.dark-mode .reel-svg.tape-stopped{filter:brightness(.48) saturate(.7)}.dark-mode .tp7-lower{background:linear-gradient(180deg,#282828,#202020,#252525);border-top-color:#1a1a1a;box-shadow:inset 0 1px #ffffff08}.dark-mode .transport-btn{background:linear-gradient(180deg,#383838,#2c2c2c 40%,#303030);box-shadow:0 2.5px #0e0e0e,0 4px 10px #00000059,inset 0 1px #ffffff0d;color:#7a7a7a}.dark-mode .transport-btn:hover:not(:disabled){background:linear-gradient(180deg,#424242,#363636);color:#999}.dark-mode .transport-btn.active{color:var(--accent);box-shadow:0 .5px #0e0e0e,inset 0 2px 5px #00000040}.dark-mode .transport-btn:active:not(:disabled){box-shadow:0 .5px #0e0e0e,inset 0 2px 5px #00000040}.dark-mode .rocker-track{background:linear-gradient(180deg,#2e2e2e,#222);border-color:#181818}.dark-mode .rocker-thumb{background:linear-gradient(180deg,#4a4a4a,#353535);border-color:#1a1a1a}.dark-mode .rocker-zone{color:#555}.dark-mode .rocker-zone:hover:not(:disabled){color:#888}.dark-mode .rocker-label{color:#444}.dark-mode .side-btn{background:linear-gradient(180deg,#404040,#303030);border-color:#1a1a1a;color:#888;box-shadow:0 2px 4px #00000040,inset 0 .5px #ffffff0f}.dark-mode .side-btn:hover:not(:disabled){background:linear-gradient(180deg,#4a4a4a,#3a3a3a);color:#aaa}.dark-mode .dial-knurl{background:repeating-linear-gradient(90deg,#2a2a2a,#383838,#303030,#383838 3px);border-color:#1a1a1a;box-shadow:0 3px 8px #0000004d,inset 0 .5px #ffffff0d}.dark-mode .drop-hint{color:#4a4a4a}.dark-mode .drop-active{background:#f2652208}.dark-mode .oled-screen{box-shadow:inset 0 1.5px 5px #000000f2,inset 0 0 2px #000,0 .5px #ffffff0f;border-color:#0a0a0a}.track-list{width:370px;max-height:220px;overflow-y:auto;background:#ffffffa6;-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);border-radius:var(--radius-lg);border:.5px solid var(--alu-400);box-shadow:0 4px 20px #0000000d,0 1px 4px #00000008;padding:12px}.dark-mode .track-list{background:#191919e6;border-color:#222;box-shadow:0 4px 20px #0003}.track-list-header{display:flex;justify-content:space-between;align-items:center;padding:0 4px 8px;border-bottom:.5px solid var(--alu-300);margin-bottom:8px}.dark-mode .track-list-header{border-bottom-color:#333}.track-list-title{font-size:9px;font-weight:600;letter-spacing:1.2px;color:var(--alu-600);text-transform:uppercase}.dark-mode .track-list-title{color:#666}.track-list-count{font-size:9px;font-weight:600;color:var(--alu-600);background:var(--alu-200);padding:2px 7px;border-radius:10px}.dark-mode .track-list-count{background:#333;color:#888}.track-list-items{display:flex;flex-direction:column;gap:2px}.track-item{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:var(--radius-md);cursor:pointer;transition:all .12s var(--ease-smooth)}.track-item:hover{background:#00000009}.dark-mode .track-item:hover{background:#ffffff09}.track-item.active{background:var(--accent-subtle)}.dark-mode .track-item.active{background:#f2652214}.track-item-indicator{width:20px;text-align:center;flex-shrink:0}.track-number{font-size:9px;font-weight:500;color:var(--alu-600);font-family:var(--font-mono)}.dark-mode .track-number{color:#555}.track-playing-icon{font-size:8px;color:var(--accent);animation:pulse-play 1.5s ease-in-out infinite}@keyframes pulse-play{0%,to{opacity:1}50%{opacity:.5}}.track-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.track-item-name{font-size:11px;font-weight:500;color:#3a3a3a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dark-mode .track-item-name{color:#ccc}.track-item.active .track-item-name{color:#1a1a1a;font-weight:600}.dark-mode .track-item.active .track-item-name{color:#fff}.track-item-duration{font-size:9px;color:var(--alu-600);font-family:var(--font-mono)}.dark-mode .track-item-duration{color:#555}.track-item-waveform{flex-shrink:0;opacity:.5}.track-item.active .track-item-waveform{opacity:.8}.track-item-remove{width:20px;height:20px;border:none;background:transparent;color:var(--alu-500);font-size:15px;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .12s ease;flex-shrink:0}.track-item:hover .track-item-remove{opacity:.7}.track-item-remove:hover{opacity:1!important;background:#ff3b3014;color:var(--red)}.add-media-btn{width:370px;padding:12px 16px;display:flex;align-items:center;justify-content:center;gap:8px;background:#ffffffa6;-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);border-radius:var(--radius-lg);border:1.5px dashed var(--alu-400);cursor:pointer;color:var(--alu-700);font-size:12px;font-weight:500;font-family:var(--font-sans);letter-spacing:.2px;transition:all .15s var(--ease-out)}.add-media-btn:hover{border-color:var(--accent);color:var(--accent);background:#f265220a;transform:translateY(-1px);box-shadow:0 4px 12px #f2652214}.add-media-btn:active{transform:translateY(0);box-shadow:none}.dark-mode .add-media-btn{background:#191919e6;border-color:#3a3a3a;color:#888}.dark-mode .add-media-btn:hover{border-color:var(--accent);color:var(--accent);background:#f265220d}.sc-coming-soon{width:370px;padding:12px 16px;display:flex;align-items:center;gap:8px;background:#fff6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-lg);border:.5px solid var(--alu-400);opacity:.5;cursor:default;font-size:11px;font-weight:600;color:var(--alu-600);letter-spacing:.2px}.dark-mode .sc-coming-soon{background:#19191999;border-color:#333;color:#555}.sc-coming-soon .sc-logo{font-size:16px;color:var(--alu-500)}.dark-mode .sc-coming-soon .sc-logo{color:#444}.sc-soon-badge{margin-left:auto;font-size:9px;font-weight:500;color:var(--alu-500);background:var(--alu-200);padding:2px 8px;border-radius:10px;letter-spacing:.3px}.dark-mode .sc-soon-badge{background:#333;color:#666}.track-list::-webkit-scrollbar{width:4px}.track-list::-webkit-scrollbar-track{background:transparent}.track-list::-webkit-scrollbar-thumb{background:var(--alu-400);border-radius:2px}.dark-mode .track-list::-webkit-scrollbar-thumb{background:#444}::selection{background:#f2652226;color:inherit}@media (max-width: 520px){.tp7-wrapper{padding:24px 12px;gap:16px}.tp7-device{flex-direction:column;align-items:center}.side-rocker,.io-ports{display:none}.tp7-chassis{width:100%;max-width:370px;border-radius:var(--radius-lg)}.reel-svg{width:220px!important;height:220px!important}.transport-btn{height:48px}.track-list,.add-media-btn,.sc-coming-soon{width:100%;max-width:370px}.tp7-upper{padding:14px 16px 8px}.tp7-lower{padding:12px 12px 14px}}@media (max-width: 380px){.tp7-chassis{border-radius:var(--radius-md)}.reel-svg{width:180px!important;height:180px!important}.oled-screen{min-width:100px;padding:6px 8px}.tp7-model{font-size:12px}}.screenshot-page{width:1200px;height:900px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#fff,#f5f5f5,#ebebeb);overflow:hidden}.screenshot-page .tp7-device{transform:scale(1.15)}.tp7-device-wrap{position:relative}.feature-guide{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:100;overflow:visible;animation:guide-fade-in .6s var(--ease-out) both}@keyframes guide-fade-in{0%{opacity:0}to{opacity:1}}.guide-label{position:absolute;display:flex;align-items:center;gap:6px;opacity:0;animation:guide-label-in .5s var(--ease-out) forwards}.guide-label:nth-child(1){animation-delay:.1s}.guide-label:nth-child(2){animation-delay:.2s}.guide-label:nth-child(3){animation-delay:.3s}.guide-label:nth-child(4){animation-delay:.4s}.guide-label:nth-child(5){animation-delay:.5s}.guide-label:nth-child(6){animation-delay:.6s}.guide-label:nth-child(7){animation-delay:.7s}.guide-label:nth-child(8){animation-delay:.8s}@keyframes guide-label-in{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}.guide-text{font-size:10.5px;font-weight:500;color:var(--alu-700);letter-spacing:.15px;white-space:nowrap;font-family:var(--font-sans)}.guide-text-subtle{font-size:9.5px;font-weight:400;color:var(--alu-600);letter-spacing:.15px;font-family:var(--font-sans)}.guide-line{display:block;background:var(--alu-500);border-radius:1px}.guide-line-h{width:28px;height:1px}.guide-line-v{width:1px;height:20px}.guide-rocker{left:-130px;top:38%}.guide-oled{right:-120px;top:5%}.guide-mbtn{right:-100px;top:16%}.guide-fx{right:-110px;top:23%}.guide-vol{right:-110px;top:74%}.guide-reel{left:50%;top:15%;transform:translate(-50%);flex-direction:column;align-items:center}.guide-transport{left:50%;top:88%;transform:translate(-50%);flex-direction:column;align-items:center}.guide-keyboard{left:50%;top:93%;transform:translate(-50%)}.guide-dismiss{position:absolute;top:97%;left:50%;transform:translate(-50%);font-size:11px;font-weight:400;color:var(--alu-600);letter-spacing:.3px;font-family:var(--font-sans);animation:guide-pulse 2s ease-in-out infinite;animation-delay:1s}@keyframes guide-pulse{0%,to{opacity:.5}50%{opacity:1}}.dark-mode .guide-text{color:#999}.dark-mode .guide-text-subtle{color:#666}.dark-mode .guide-line{background:#555}.dark-mode .guide-dismiss{color:#666}.assembling .anim-chassis{animation:assemble-chassis .9s cubic-bezier(.16,1,.3,1) .1s both}.assembling .anim-reel{animation:assemble-reel 1s cubic-bezier(.34,1.56,.64,1) .4s both}.assembling .anim-oled{animation:assemble-oled .7s cubic-bezier(.16,1,.3,1) .8s both}.assembling .anim-upper{animation:assemble-fade .6s ease .6s both}.assembling .anim-transport{animation:assemble-transport .8s cubic-bezier(.16,1,.3,1) .7s both}.assembling .anim-rocker{animation:assemble-rocker .8s cubic-bezier(.16,1,.3,1) 1s both}.assembling .anim-ports{animation:assemble-ports .8s cubic-bezier(.16,1,.3,1) 1.1s both}.assembling .anim-below{animation:assemble-fade .6s ease 1.8s both}@keyframes assemble-chassis{0%{opacity:0;transform:translateY(60px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes assemble-reel{0%{opacity:0;transform:scale(.3) rotate(-180deg)}60%{opacity:1;transform:scale(1.05) rotate(10deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes assemble-oled{0%{opacity:0}20%{opacity:.8}25%{opacity:.2}35%{opacity:.9}40%{opacity:.4}50%{opacity:1}to{opacity:1}}@keyframes assemble-transport{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes assemble-rocker{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes assemble-ports{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes assemble-fade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.assembled .anim-chassis,.assembled .anim-reel,.assembled .anim-oled,.assembled .anim-upper,.assembled .anim-transport,.assembled .anim-rocker,.assembled .anim-ports,.assembled .anim-below{animation:none;opacity:1;transform:none}.tp7-device-wrap{transform-style:preserve-3d;will-change:transform}.reel-spark{position:absolute;top:50%;left:50%;width:0;height:0;pointer-events:none;z-index:10}.assembling .reel-spark{animation:spark-burst .4s ease-out 1.1s both}@keyframes spark-burst{0%{box-shadow:0 0 #f2652200,0 0 #fff0}30%{box-shadow:0 0 20px 10px #f2652266,0 0 40px 20px #ffffff26,-15px -15px 0 2px #f2652299,15px -10px 0 1px #ffc86480,-10px 15px 0 1px #f2652266,12px 12px 0 1px #ffdc9680}to{box-shadow:0 0 #f2652200,0 0 #fff0,-30px -30px #f2652200,30px -20px #ffc86400,-20px 30px #f2652200,24px 24px #ffdc9600}}.oled-boot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:100%}.oled-boot-logo{font-family:var(--font-sans);font-size:14px;font-weight:700;color:var(--oled-text);letter-spacing:3px;animation:boot-logo .8s ease both}@keyframes boot-logo{0%{opacity:0;transform:scale(.8)}50%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.oled-boot-bar{width:60px;height:2px;background:#ffffff1a;border-radius:1px;overflow:hidden}.oled-boot-fill{height:100%;width:0%;background:var(--oled-text);border-radius:1px;animation:boot-fill 1.8s cubic-bezier(.4,0,.2,1) .3s both}@keyframes boot-fill{0%{width:0%}20%{width:15%}50%{width:45%}80%{width:80%}to{width:100%}}.dark-mode .tp7-wrapper{background:linear-gradient(180deg,#1a1a1a,#121212,#0a0a0a)}.dark-mode .tp7-device-wrap{filter:drop-shadow(0 60px 120px rgba(0,0,0,.6)) drop-shadow(0 16px 48px rgba(0,0,0,.4)) drop-shadow(0 4px 16px rgba(0,0,0,.25))}.dark-mode .oled-boot-logo{color:#fff}.dark-mode .oled-boot-bar{background:#ffffff0d}.dark-mode .oled-boot-fill{background:#fffc}