/* Simple and Studio share the same waveform, transport and selection elements. */
.simple-only{display:none}
.view-switch{display:flex;align-items:center;flex-shrink:0;gap:3px;padding:3px;margin:0 12px;background:#101213;border:1px solid #343739;border-radius:9px}
.view-switch button{min-width:63px;min-height:44px;padding:0 12px;font-size:11px;color:#9ca1a5;border-radius:6px}
.view-switch button[aria-pressed=true]{color:#f2e5cb;background:#30302b;box-shadow:inset 0 0 0 1px #60533c}
.simple-view .simple-only{display:block}
.simple-view .studio-only,.simple-view .topbar nav,.simple-view .topbar .visualizer-toggle,.simple-view .monitor-status,.simple-view .add-top,.simple-view .library,.simple-view .session-head,.simple-view .overview-section,.simple-view .editor-help,.simple-view .visualizer-panel,.simple-view .cuts-section,.simple-view main>footer{display:none}
.simple-view .topbar{height:68px;background:#141617eF;backdrop-filter:blur(12px)}
.simple-view .brand{width:auto;border:0;flex:1;height:100%;padding:0 23px;gap:12px}
.simple-view .brand span{font-size:10px;letter-spacing:2px}
.simple-view .view-switch{margin-right:18px}
.simple-view .workspace{display:block;min-height:calc(100svh - 68px)}
.simple-view main{max-width:560px;width:100%;padding:16px 24px 28px;scroll-margin-top:85px}
.simple-intro{margin-bottom:16px}
.simple-source-line{display:flex;align-items:center;justify-content:space-between;gap:12px}
.simple-eyebrow{font-family:var(--mono);font-size:9px;letter-spacing:1px;color:#a3a6a7;text-transform:uppercase}
#simple-choose{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 1px 0 12px;font-size:11px;color:#e5c890;white-space:nowrap}
#simple-choose span{font-size:19px;color:#a78c5a}
.simple-intro h1{font-size:26px;font-weight:500;line-height:1.25;letter-spacing:-.55px;margin:1px 0 6px;overflow-wrap:anywhere}
.simple-intro p{font-family:var(--mono);font-size:10px;line-height:1.7;color:#a8adb0;margin:0}
.simple-view .editor-card{overflow:hidden;border-radius:16px;background:#17191a;border-color:#353837}
.simple-view .simple-wave-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 16px 0;font-size:11px;color:#c8cbca}
#simple-show-cut{display:flex;align-items:center;gap:9px;min-height:44px;padding:0;color:var(--amber)}
#simple-length{font-family:var(--mono);font-size:12px}
#simple-show-cut span{font-size:9px;color:#b5a17f}
.simple-view .timeline{margin-left:22px;margin-right:22px;height:25px;border-bottom-color:#333736;background-size:100% 4px}
.simple-view .timeline span{font-size:8px;top:3px;color:#9da4a4}
.simple-view .timeline span::after{height:5px;top:16px}
.simple-view .wave-stage{height:124px;background:linear-gradient(#0c121410,#060b0d35)}
.simple-view #detail-canvas{left:22px;width:calc(100% - 44px)}
.simple-view .channel-labels{display:none;width:0}
.simple-view .sample-selection{background:#efb6501a}
.simple-view .selection-handle{width:44px;z-index:3}
.simple-view .selection-handle.start{left:-22px}.simple-view .selection-handle.end{right:-22px}
.simple-view .selection-handle::before{height:100%;width:2px;left:21px;top:0;background:#f0bc63}
.simple-view .selection-handle span{left:14px;top:calc(50% - 24px);width:16px;height:48px;line-height:46px;font-size:17px;box-shadow:0 0 0 1px #0005;border-radius:6px;background:#f0bc63}
.simple-view .selection-duration{display:none}
.simple-view .simple-wave-hint{font-size:9px;text-align:center;color:#9ca4a4;margin:8px 8px 0;line-height:1.5}
.simple-view .transport{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px 18px 0;border:0;background:radial-gradient(ellipse at 50% 20%,#af7f3020,transparent 67%)}
.simple-view .transport-main{justify-content:center;gap:34px}
.simple-view .transport-main .icon-button{min-width:48px;min-height:48px;height:48px;border-radius:50%;color:#c3c8c8}
.simple-view .transport-main .icon-button svg{width:23px;height:23px}
.simple-view .play-button{width:86px;height:86px;border:1px solid #d7ab5e;background:linear-gradient(145deg,#f3ca7a,#dba345);color:#18170f;box-shadow:0 0 0 7px #d7a85108,0 6px 30px #0003}
.simple-view .play-button:hover{background:#f8ce7b}.simple-view .play-button:active{transform:scale(.97)}
.simple-view .play-button svg{width:32px;height:32px}
.simple-view .transport-group,.simple-view .zoom-controls,.simple-view .pan-strip,.simple-view .transport>output{display:none}
.simple-view .simple-play-caption{font-size:10px;color:#acb0ad;min-height:15px;line-height:1.5}
.simple-view .simple-position{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:0 18px 4px;margin:1px 0 0}
#simple-seek{height:44px;width:100%;margin:0;background:linear-gradient(to right,#c9a765 var(--progress,0%),#414544 var(--progress,0%)) center/100% 3px no-repeat}
#simple-seek::-webkit-slider-thumb{width:12px;height:12px;background:#d7bd8b}
#simple-total{font-family:var(--mono);font-size:8px;color:#aeb5b2}
.simple-view .cut-bar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 12px;padding:0;margin-top:18px;border:0;background:none}
.simple-view .time-control{display:flex;flex-direction:column;align-items:stretch;gap:7px;min-width:0;padding:0;border:0;font-family:var(--sans);font-size:10px;color:#b2b7b4}
.simple-view .time-control .simple-only{padding-left:2px}
.simple-view .time-control input{height:50px;min-width:0;width:100%;font-size:13px;font-family:var(--mono);padding:12px 13px;background:#1b1d1e;border:1px solid #3d4240;border-radius:9px;color:#e8e8e0}
.simple-view .cut-bar .length,.simple-view #preview-cut{display:none}
.simple-view .cut-bar #download-cut{grid-column:1/-1;min-height:54px;border-radius:10px;font-size:13px;letter-spacing:.1px;padding:15px;margin:0;gap:12px}
.simple-view .cut-bar #download-cut svg{width:18px;height:18px}
.simple-more{margin-top:16px;border-bottom:1px solid #303534}
.simple-more summary{list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:48px;font-size:11px;color:#aab0ad;cursor:pointer;padding:0 2px}
.simple-more summary::-webkit-details-marker{display:none}
.simple-more summary span{font-size:19px;font-weight:300;color:#87918c}
.simple-more[open] summary span{transform:rotate(45deg)}
.simple-more-content{padding:2px 0 16px}
.simple-more-content>button,.simple-more-content>a{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;font-size:12px;text-align:left;padding:0 2px;color:#d2d7d3;border-top:1px solid #292e2b}
.simple-more-content>button svg{width:18px;height:18px;color:#aaa58f}
.simple-more-content>a{color:#e4c38a}
.simple-more-content>a[hidden]{display:none}
.simple-more-content label{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:54px;font-size:12px;color:#d2d7d3;border-top:1px solid #292e2b}
#simple-volume{width:55%;height:44px;background:linear-gradient(#505654,#505654) center/100% 3px no-repeat}
#simple-studio span{margin-left:auto;color:#b49f78}
.simple-more-content p{font-size:9px;color:#939d97;line-height:1.7;margin:10px 0 0}
#recordings-dialog{width:min(520px,calc(100vw - 24px));max-height:calc(100svh - 40px);padding:22px;border:1px solid #444a43;border-radius:16px;background:#161919}
#recordings-dialog .dialog-head{align-items:flex-start;gap:12px;margin-bottom:10px}
#close-recordings{min-width:44px;min-height:44px;border-radius:8px;font-size:25px;color:#cbd0cb}
#recordings-dialog h2{font-size:22px;font-weight:500}
.simple-search-label{display:block;font-size:10px;color:#afb5af;margin:12px 0 8px}
#simple-search{display:block;width:100%;height:48px;padding:0 12px;margin-top:8px;font-size:12px;background:#101414;border-color:#3c443e}
.simple-recordings{max-height:52svh;overflow:auto;overscroll-behavior:contain}
.simple-recording{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:76px;padding:15px 12px;text-align:left;border-bottom:1px solid #303831;border-radius:5px}
.simple-recording.selected{background:#342d20;color:#f0d6a8}
.simple-recording>span:first-child{min-width:0}
.simple-recording strong{display:block;font-size:13px;font-weight:500;line-height:1.5;overflow-wrap:anywhere}
.simple-recording small{display:block;font-family:var(--mono);font-size:9px;color:#a2afa5;margin-top:6px;line-height:1.5}
.simple-recording-status{font-size:9px;color:#bdb197;flex-shrink:0}
.simple-open{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;font-size:11px;color:#c7c9b9;margin-top:12px}
.simple-open svg{width:16px;height:16px}
.simple-no-results{font-size:12px;color:#a9b4ad;line-height:1.8;padding:18px 10px}
@media(max-width:1020px){.view-switch{margin:0 5px}.view-switch button{min-width:58px;padding:0 10px}.topbar nav .nav{padding:0 15px}}
@media(max-width:760px){
 body:not(.simple-view) .topbar{height:auto;min-height:54px;flex-wrap:wrap}
 body:not(.simple-view) .view-switch{order:8;flex-basis:100%;justify-content:center;margin:0;border:0;border-top:1px solid #303234;border-radius:0}
 body:not(.simple-view) .view-switch button{min-width:100px}
 .simple-view .topbar{height:62px}
 .simple-view .brand{padding:0 16px;gap:10px}
 .simple-view .brand span{font-size:9px;letter-spacing:1.4px}
 .simple-view .brand svg{width:21px}
 .simple-view .view-switch{margin:0 12px 0 4px}
 .simple-view .view-switch button{min-width:57px;padding:0 10px;font-size:10px}
 .simple-view main{padding:16px 16px 28px;max-width:560px}
 .simple-intro{margin-bottom:16px}
 .simple-intro h1{font-size:24px}
 .simple-view .wave-stage{height:120px}
 .simple-view .transport{padding-top:10px}
 .simple-view .simple-position{padding-left:16px;padding-right:16px}
 .simple-view .time-control input{font-size:12px}
 .simple-view .cut-bar{margin-top:16px}
}
@media(max-width:370px){.simple-view .brand span{font-size:8px;letter-spacing:.8px}.simple-view .brand{gap:7px;padding:0 11px}.simple-view .view-switch{margin-right:8px}.simple-view .view-switch button{min-width:50px;padding:0 8px}.simple-view main{padding-left:12px;padding-right:12px}.simple-view .time-control input{font-size:10px}.simple-view .transport-main{gap:22px}}

/* A small original 3D accent lives in the actual transport, never above the tools. */
.play-core{display:contents}
.simple-view .play-core{display:grid;place-items:center;position:relative;width:102px;height:102px;isolation:isolate}
.simple-view .play-button{position:relative;z-index:2;width:82px;height:82px;background:radial-gradient(ellipse at 30% 16%,#fff4c7b3,transparent 47%),conic-gradient(from 25deg,#f7d997,#bc863f,#f5d9a2,#c9934b,#fff2c7,#d7a354,#f7d997);border:1px solid #e8c58d;box-shadow:inset 0 2px 2px #fff7d2b3,inset 0 -5px 10px #72431e66,0 9px 23px #0007;transition:transform 120ms ease}
.simple-view .play-core::before{content:'';position:absolute;inset:-5px -15px;border-radius:50%;background:conic-gradient(from 50deg,#9c8e72,#f9edcb,#71532d,#251e14,#9e7747,#ead9ad,#9c8e72);mask:radial-gradient(ellipse,transparent 60%,#000 62%,#000 70%,transparent 72%);transform:perspective(240px) rotateX(56deg) rotateY(-19deg) rotateZ(-28deg);filter:drop-shadow(0 7px 3px #0008);z-index:1}
.simple-view .play-core::after{content:'';position:absolute;width:17px;height:17px;top:4px;right:0;border-radius:45% 52% 46% 40%;background:radial-gradient(circle at 29% 23%,#fff7e3 0,#dcb575 24%,#896442 58%,#30251f 81%);box-shadow:1px 4px 6px #0008,inset 0 0 0 1px #e2c89730;transform:rotate(-25deg);z-index:3}
.simple-playing .play-core::before{animation:signal-orbit 8s ease-in-out infinite}
.simple-playing .play-core::after{animation:signal-satellite 4s ease-in-out infinite}
#simple-current{font-family:var(--mono);font-size:10px;font-variant-numeric:tabular-nums;color:#ded4b9;min-width:49px}
.simple-playing .simple-play-caption{color:#e4c994}
@keyframes signal-orbit{0%,100%{transform:perspective(240px) rotateX(56deg) rotateY(-19deg) rotateZ(-28deg)}50%{transform:perspective(240px) rotateX(66deg) rotateY(16deg) rotateZ(15deg)}}
@keyframes signal-satellite{0%,100%{transform:translateY(0) rotate(-25deg)}50%{transform:translateY(5px) rotate(20deg)}}
@media(prefers-reduced-motion:reduce){.simple-view .play-core::before,.simple-view .play-core::after{animation:none!important}.simple-view .play-button{transition:none}}