.loop-home .promo-banner{display:none}.loop-home .header{margin-top:18px}.loop-layout{display:grid;grid-template-columns:185px minmax(0,1fr) 250px;gap:26px;padding:32px 0 60px;align-items:start}.loop-sidebar{position:sticky;top:22px;padding-top:10px}.side-label{font:9px var(--mono);letter-spacing:.12em;color:var(--muted);margin-bottom:22px}.loop-sidebar>a{display:block;padding:14px 12px;margin-bottom:8px;font-size:13px;border-radius:10px}.side-active{background:#e9def6;border:1px solid #ae92c8;color:#622799;font-weight:600}.side-note{border-top:1px solid #a7aaba;margin:34px 12px 0;padding-top:22px;font-size:11px;color:#555969;line-height:1.8}.side-note p{font-size:19px;line-height:1.5;color:#292c3c}.status-dot{display:inline-block;width:6px;height:6px;background:#7a39b3;border-radius:50%;margin-right:5px}.feed-intro{display:flex;align-items:center;justify-content:space-between;padding:4px 0 25px}.feed-intro h1{font:600 clamp(30px,3vw,44px)/1.18 var(--display);letter-spacing:-.055em;margin:15px 0}.feed-intro h1 span{color:#7628b8}.feed-intro p{font-size:13px;line-height:1.7;color:#535769;max-width:350px}.hero-symbol{font-size:100px;line-height:1;color:#8444b4;text-shadow:2px 2px #fff;transform:rotate(12deg)}.composer,.loop-card,.community-card{padding:22px;background:linear-gradient(135deg,#fafbfee8,#e1e4ece8);border:1px solid #a3a9b8;border-radius:16px;box-shadow:inset 0 1px #fff,0 5px 18px #3034460c}.composer-top{display:flex;gap:12px;align-items:center}.producer-avatar{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;background:linear-gradient(145deg,#e7d1ff,#bb9cd4);border:1px solid #a88abb;border-radius:12px;font:600 10px var(--sans);color:#582677}.composer h2{font:600 14px var(--sans);margin:0 0 5px}.composer-top p{font-size:11px;color:#5d6171;margin:0}.composer-top .download-button{margin-left:auto;font-family:var(--sans);font-size:11px;padding:10px 13px}.local-note{font:11px/1.7 var(--sans);color:#5d6171;margin:16px 0 0}.feed-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:26px 0 17px;flex-wrap:wrap}.feed-tabs{display:flex;gap:5px}.feed-tabs button,.save-loop,#cancel-upload{font:12px var(--sans);padding:9px 12px;border:1px solid transparent;background:transparent;color:#56596a;border-radius:8px;cursor:pointer}.feed-tabs button.active{background:#f6f1fc;border-color:#a58abf;color:#682c96}.search-loops input{width:140px;border:1px solid #a5aab7;background:#eef0f5;border-radius:9px;padding:10px;font:12px var(--sans)}.loop-card{margin-bottom:16px}.loop-card-head{display:flex;align-items:center;gap:11px}.loop-card-head p{margin:0;font-size:12px;font-weight:600}.loop-card-head small{display:block;font-weight:400;color:#686b7a;font-size:10px;margin-top:4px}.loop-card h2{font:600 20px/1.4 var(--sans);letter-spacing:-.025em;margin:19px 0 7px}.loop-description{font-size:12px;color:#5c6070;line-height:1.7}.loop-tags{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.loop-tags span{background:#e6deef;border:1px solid #c4b4d3;border-radius:5px;padding:4px 7px;font:10px var(--mono);color:#65467b}.waveform{height:55px;display:flex;align-items:center;gap:3px;overflow:hidden;background:linear-gradient(90deg,#eee6f6,#e7e9f2);border-radius:9px;padding:10px 12px;margin:16px 0 10px}.waveform i{display:block;flex:1;min-width:2px;background:#9866bb;border-radius:2px;opacity:.7}.loop-card audio{width:100%;height:38px;display:block}.loop-card-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #c6c8d3;padding-top:10px;margin-top:15px;font-size:11px;color:#626677}.save-loop{padding-left:0}.save-loop[aria-pressed=true]{color:#7628b8}.loop-card-foot a{text-decoration:underline;text-underline-offset:3px}.community-card{margin-bottom:18px;padding:22px}.community-card h2{font:600 20px/1.45 var(--sans);letter-spacing:-.03em;margin:18px 0 10px}.community-card p{font-size:12px;line-height:1.8;color:#5b5f71}.community-card .intro-link{font:11px/1.8 var(--sans)}.tool-card img{width:100%;margin-top:18px;filter:drop-shadow(0 8px 8px #34304425)}.right-footer{font-size:11px;color:#636778;line-height:1.8;padding:7px}.right-footer p{font:9px var(--mono)}#loop-form{margin-top:22px;border-top:1px solid #c5c4d2;padding-top:18px}#loop-form label{display:block;font-size:12px;line-height:1.8;margin-bottom:12px}#loop-form input,#loop-form select{display:block;width:100%;min-width:0;margin-top:5px;padding:10px;border:1px solid #a6a9b7;border-radius:7px;background:#f7f8fc;font:13px var(--sans);color:#292c3c}.upload-fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.upload-actions{display:flex;gap:10px;margin-top:14px}#upload-status{font-size:12px;line-height:1.7;margin-bottom:0}.loop-home [hidden]{display:none!important}.loop-home :focus-visible{outline:2px solid #7628b8;outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:1080px){.loop-layout{grid-template-columns:155px minmax(0,1fr)}.loop-right{display:none}}@media(max-width:720px){.loop-layout{display:block;padding-top:24px}.loop-sidebar{position:static;display:flex;gap:7px;overflow:auto;margin-bottom:22px;padding:0}.loop-sidebar>a{white-space:nowrap;font-size:11px;padding:10px;margin:0}.side-label,.side-note{display:none}.loop-home .header{padding:12px;gap:12px;flex-wrap:wrap}.loop-home .nav{justify-content:flex-start;gap:5px}.loop-home .nav a{font-size:8px;padding:8px}.feed-intro h1{font-size:34px}.hero-symbol{font-size:74px}.composer,.loop-card{padding:17px}.composer-top{flex-wrap:wrap}.composer-top .download-button{margin:4px 0 0;width:100%}.upload-fields{grid-template-columns:1fr}.search-loops{flex:1}.search-loops input{width:100%}.feed-tabs{flex-wrap:wrap}.loop-layout.page{width:calc(100% - 28px)}}
.loop-home{font-family:var(--sans)}.loop-home .loop-card p,.loop-home .composer p,.loop-home .community-card p,.loop-home .loop-sidebar>a{font-family:var(--sans)}
.waveform i{animation:loop-wave-pulse .65s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:center;will-change:auto}.waveform.is-playing i{animation-play-state:running;will-change:transform}.waveform i.played{background:#7628b8;opacity:1}@keyframes loop-wave-pulse{from{transform:scaleY(.3)}to{transform:scaleY(1)}}@media(prefers-reduced-motion:reduce){.waveform i{animation:none;transform:none}}
.producer-avatar{overflow:hidden}.producer-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
