body.is-estudio-section{background:var(--bg, #F7E4C8);color:var(--txt, #463E37)}.estudio{display:flex;flex-direction:column;gap:var(--gap-sm, 1rem);padding:var(--gap-md, 1.5rem) var(--gap-sm, 1rem) 0;min-height:78vh;width:100vw;margin-left:calc(50% - 50vw);background:radial-gradient(1100px 460px at 50% -8%,rgba(255,138,61,.1),transparent 62%),var(--white, #fefefe);align-items:stretch}.estudio>*{width:100%;max-width:900px;margin-left:auto;margin-right:auto}.estudio__topbar{display:flex;align-items:center;gap:var(--gap-xs, .5rem);padding:var(--gap-xs, .5rem) 0}.estudio__back{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-pill, 50px);color:var(--accent-dark, #E66A1F);background:#ff8a3d1f;text-decoration:none;transition:background .18s ease}.estudio__back:hover{background:#ff8a3d38}.estudio__title{font-family:var(--font-title, sans-serif);font-size:1.25rem;margin:0;flex:1;color:var(--txt, #463E37)}.estudio__identity{display:inline-flex;flex-direction:column;align-items:flex-end;font-size:.75rem;line-height:1.2;color:#463e3799;text-align:right}.estudio__identity strong{color:var(--accent-dark, #E66A1F);font-size:.9rem}.estudio__identity--clickable{cursor:pointer}.estudio__identity--clickable:hover strong{text-decoration:underline}.estudio__intro{margin:0 auto;color:#463e37b8;font-size:1rem;line-height:1.5}.estudio__unsupported{display:flex;flex-direction:column;gap:var(--gap-sm, 1rem);align-items:center;text-align:center;padding:var(--gap-lg, 2rem);background:var(--bg-light-gray, #f8f9fa);border:1px solid var(--shadow, rgba(70, 62, 55, .1));border-radius:var(--radius-lg, 20px)}.estudio__upload input{position:absolute;width:1px;height:1px;opacity:0}.estudio__stage{background:var(--bg-light-gray, #f8f9fa);border:1px solid var(--shadow, rgba(70, 62, 55, .1));border-radius:var(--radius-lg, 20px);padding:var(--gap-sm, 1rem);box-shadow:inset 0 1px 3px #463e370d;overflow:hidden}.estudio__tracks{display:flex;flex-direction:column;gap:var(--gap-xs, .5rem)}.estudio-track{display:flex;flex-direction:column;gap:.35rem;position:relative}.estudio-track__head{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:700;color:#463e37b3}.estudio-track__icon{width:22px;text-align:center;color:var(--accent, #FF8A3D)}.estudio-track--effect .estudio-track__icon{color:var(--color-blue, #2196F3)}.estudio-track--melody .estudio-track__icon{color:var(--second-accent, #8a4baf)}.estudio-track__name{margin-right:auto}.estudio-track__add{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;height:34px;padding:0 .85rem;border:1px solid var(--shadow-hover, rgba(70, 62, 55, .18));border-radius:var(--radius-pill, 50px);background:var(--white, #fefefe);color:var(--accent-dark, #E66A1F);font-family:var(--font-body, sans-serif);font-size:.85rem;font-weight:700;cursor:pointer;transition:background .16s ease,transform .12s ease}.estudio-track__add-label{line-height:1;white-space:nowrap}.estudio-track__add:hover{background:#ff8a3d1f}.estudio-track__add:active{transform:scale(.92)}.estudio-track__add.is-recording{background:var(--color-red, #dc3545);border-color:var(--color-red, #dc3545);color:var(--white, #fff);animation:estudioPulse 1.1s ease-in-out infinite}.estudio-track__add--rec{color:var(--color-red, #dc3545);border-color:#dc354566}.estudio-track__add--rec:hover{background:#dc35451a}.estudio-track.is-active .estudio-track__head{color:var(--txt, #463E37)}.estudio-track.is-active .estudio-track__lane{border-color:var(--accent, #FF8A3D);box-shadow:0 0 0 1px #ff8a3d59}.estudio-track__tools{display:flex;gap:.4rem;padding-top:.1rem}.estudio-track__tool{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .8rem;border:1px solid var(--shadow-hover, rgba(70, 62, 55, .18));border-radius:var(--radius-pill, 50px);background:var(--white, #fefefe);color:var(--txt, #463E37);font-family:var(--font-body, sans-serif);font-weight:700;font-size:.8rem;cursor:pointer;transition:background .16s ease}.estudio-track__tool:hover{background:var(--bg-light-orange, #fff3e0)}.estudio-track__tool--danger{color:var(--color-red, #dc3545);border-color:#dc35454d}.estudio-track__tool--danger:hover{background:#dc35451a}.estudio-track__head .estudio-track__add{margin-left:auto}.estudio-track__lane{position:relative;height:58px;width:100%;min-width:0;border-radius:var(--radius-md, 10px);background:var(--white, #fefefe);border:1px solid var(--shadow, rgba(70, 62, 55, .1));overflow-x:auto;overflow-y:hidden;touch-action:pan-x}.estudio-track__lane-inner{position:relative;height:100%}.estudio-track__empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.85rem;color:#463e3766;pointer-events:none;padding:0 1rem;text-align:center}.estudio-clip{position:absolute;top:0;bottom:0;background:#ff8a3d33;border:0;border-right:1px solid rgba(255,138,61,.45);overflow:hidden;cursor:grab}.estudio-clip--effect{background:#2196f32e;border-right-color:#2196f373}.estudio-clip--melody{background:#8a4baf2e;border-right-color:#8a4baf73}.estudio-clip.is-selected{box-shadow:inset 0 0 0 2px var(--accent, #FF8A3D);z-index:2}.estudio-clip--voice{cursor:pointer}.estudio-clip__canvas{display:block;width:100%;height:100%}.estudio-clip__handle{position:absolute;top:0;bottom:0;width:16px;background:#ff8a3d8c;cursor:ew-resize}.estudio-clip__handle--l{left:0;border-radius:var(--radius-sm, 8px) 0 0 var(--radius-sm, 8px)}.estudio-clip__handle--r{right:0;border-radius:0 var(--radius-sm, 8px) var(--radius-sm, 8px) 0}.estudio-playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--color-red, #dc3545);pointer-events:none;z-index:2}.estudio-playhead__play{position:absolute;top:0;left:0;transform:translate(-50%,-50%);width:34px;height:34px;display:none;align-items:center;justify-content:center;border:2px solid var(--white, #fff);border-radius:50%;background:var(--color-red, #dc3545);color:var(--white, #fff);font-size:.8rem;cursor:pointer;pointer-events:auto;z-index:4;box-shadow:0 2px 8px #463e3759}.estudio--has-audio .estudio-track.is-active .estudio-playhead__play{display:flex}.estudio-playhead__play:hover{background:#c62f3d}.estudio__transport{display:flex;align-items:center;justify-content:center;gap:var(--gap-sm, 1rem);flex-wrap:wrap;position:sticky;bottom:0;z-index:5;width:100vw;max-width:none;margin-left:calc(50% - 50vw);padding:.7rem var(--gap-sm, 1rem);background:#fefefef0;border:0;border-top:1px solid var(--shadow, rgba(70, 62, 55, .1));box-shadow:0 -4px 16px #463e371a;backdrop-filter:blur(8px)}.estudio__btn{display:inline-flex;align-items:center;gap:.35rem;min-height:48px;padding:0 var(--gap-sm, 1rem);border:1px solid var(--shadow-hover, rgba(70, 62, 55, .18));border-radius:var(--radius-pill, 50px);background:var(--white, #fefefe);color:var(--txt, #463E37);font-family:var(--font-body, sans-serif);font-size:.95rem;font-weight:700;cursor:pointer;transition:transform .12s ease,background .18s ease,opacity .18s ease,box-shadow .18s ease}.estudio__btn:hover{background:var(--bg-light-orange, #fff3e0);box-shadow:0 2px 8px #463e371f}.estudio__btn:active{transform:scale(.96)}.estudio__btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.estudio__btn--primary{background:var(--accent, #FF8A3D);border-color:var(--accent, #FF8A3D);color:var(--white, #fff)}.estudio__btn--primary:hover{background:var(--accent-dark, #E66A1F)}.estudio__btn--ghost{background:transparent}.estudio__btn--play{background:var(--accent, #FF8A3D);border-color:var(--accent, #FF8A3D);color:var(--white, #fff)}.estudio__btn--play:hover{background:var(--accent-dark, #E66A1F)}.estudio__btn--play:disabled{background:var(--white, #fefefe);border-color:var(--shadow-hover, rgba(70, 62, 55, .18));color:#463e3773}.estudio__time{font-variant-numeric:tabular-nums;font-weight:700;font-size:.95rem;color:#463e3799;padding:0 .4rem}.estudio__time.is-over{color:var(--color-red, #dc3545)}@keyframes estudioPulse{0%,to{box-shadow:0 0 #dc354573}50%{box-shadow:0 0 0 12px #dc354500}}.estudio__submit{display:block;width:100vw;max-width:none;margin-left:calc(50% - 50vw);margin-top:calc(-1 * var(--gap-sm, 1rem));padding:var(--gap-sm, 1rem) var(--gap-sm, 1rem);background:var(--bg, #F7E4C8);border:0;border-radius:0;box-shadow:none}.estudio__submit-inner{width:100%;max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:var(--gap-sm, 1rem)}.estudio__field{display:flex;flex-direction:column;gap:.35rem}.estudio__field-label{font-size:.85rem;font-weight:700;color:#463e37bf}.estudio__field input[type=text]{min-height:48px;padding:0 var(--gap-sm, 1rem);border:2px solid var(--shadow-hover, rgba(70, 62, 55, .18));border-radius:var(--radius-md, 10px);background:var(--white, #fefefe);color:var(--txt, #463E37);font-size:1rem}.estudio__field input[type=text]:focus{outline:none;border-color:var(--accent, #FF8A3D)}.estudio__consent{display:flex;align-items:center;gap:var(--gap-xs, .5rem);font-size:.9rem;line-height:1.4;cursor:pointer;color:#463e37cc}.estudio__consent input{width:22px;height:22px;flex:0 0 auto;accent-color:var(--accent, #FF8A3D)}.estudio__actions{display:flex;gap:var(--gap-sm, 1rem);justify-content:center;flex-wrap:wrap}.estudio__feedback{margin:0;font-size:.9rem;min-height:0;text-align:center}.estudio__feedback.is-error{color:var(--color-red, #dc3545)}.estudio__feedback.is-ok{color:var(--color-green-dark, #28a745)}.estudio__result{display:flex;flex-direction:column;align-items:center;gap:var(--gap-xs, .5rem);text-align:center;padding:var(--gap-md, 1.5rem);background:var(--bg-light-orange, #fff3e0);border:1px solid rgba(255,138,61,.25);border-radius:var(--radius-lg, 20px)}.estudio__result-msg{font-size:1.1rem;font-weight:700;margin:0;color:var(--txt, #463E37)}body.estudio-modal-open{overflow:hidden}.estudio-modal{position:fixed;inset:0;z-index:3000}.estudio-modal.hidden,.estudio-modal .hidden{display:none!important}.estudio-modal__overlay{position:absolute;inset:0;background:#28221cd1}.estudio-modal__panel{position:absolute;inset:0;display:flex;flex-direction:column;gap:var(--gap-sm, 1rem);background:var(--white, #fefefe);padding:var(--gap-lg, 2rem) var(--gap-sm, 1rem);overflow-y:auto}.estudio-modal__head,.estudio-modal__body{width:100%;max-width:680px;margin-left:auto;margin-right:auto}.estudio-modal__head{display:flex;align-items:center;justify-content:space-between;gap:var(--gap-xs, .5rem)}.estudio-modal__title{margin:0;font-family:var(--font-title, sans-serif);font-size:1.4rem;color:var(--txt, #463E37)}.estudio-modal__x{flex:0 0 auto;border:none;background:transparent;color:#463e3799;width:44px;height:44px;border-radius:var(--radius-pill, 50px);cursor:pointer;font-size:1.2rem}.estudio-modal__x:hover{background:var(--bg-light-gray, #f8f9fa)}.estudio-modal__body{display:flex;flex-direction:column;gap:var(--gap-sm, 1rem);min-height:0;margin-top:var(--gap-sm, 1rem)}.estudio-lib__tabs{display:flex;gap:.35rem}.estudio-lib__tab{border:1px solid var(--shadow-hover, rgba(70, 62, 55, .18));background:var(--white, #fefefe);color:var(--txt, #463E37);padding:.4rem .9rem;border-radius:var(--radius-pill, 50px);font-weight:700;font-size:.85rem;cursor:pointer;transition:background .16s ease}.estudio-lib__tab:hover{background:var(--bg-light-orange, #fff3e0)}.estudio-lib__tab.is-active{background:var(--accent, #FF8A3D);border-color:var(--accent, #FF8A3D);color:var(--white, #fff)}.estudio-lib__search{min-height:44px;padding:0 var(--gap-sm, 1rem);border:2px solid var(--shadow-hover, rgba(70, 62, 55, .18));border-radius:var(--radius-md, 10px);background:var(--white, #fefefe);color:var(--txt, #463E37);font-size:.95rem}.estudio-lib__search:focus{outline:none;border-color:var(--accent, #FF8A3D)}.estudio-lib__list{display:flex;flex-direction:column;gap:.35rem;max-height:40vh;overflow-y:auto}.estudio-lib__item{display:flex;align-items:center;gap:var(--gap-xs, .5rem);padding:.5rem .6rem;border-radius:var(--radius-md, 10px);background:var(--bg-light-gray, #f8f9fa)}.estudio-lib__title{flex:1;font-size:.9rem;color:var(--txt, #463E37);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.estudio-lib__play,.estudio-lib__add{flex:0 0 auto;width:38px;height:38px;cursor:pointer;border-radius:var(--radius-pill, 50px);background:var(--white, #fefefe);border:1px solid var(--shadow-hover, rgba(70, 62, 55, .18));color:var(--txt, #463E37)}.estudio-lib__add{background:var(--accent, #FF8A3D);border-color:var(--accent, #FF8A3D);color:var(--white, #fff)}.estudio-lib__play.is-playing{background:var(--color-red, #dc3545);border-color:var(--color-red, #dc3545);color:var(--white, #fff)}.estudio-lib__loading,.estudio-lib__empty{color:#463e3773;text-align:center;padding:var(--gap-sm, 1rem)}.estudio-lib__generate{display:flex;flex-direction:column;gap:.35rem;border-top:1px solid var(--shadow, rgba(70, 62, 55, .1));padding-top:var(--gap-xs, .5rem)}.estudio-lib__gen-label{font-size:.85rem;font-weight:700;color:#463e37bf}.estudio-lib__gen-row{display:flex;gap:.35rem}.estudio-lib__gen-row input{flex:1;min-height:44px;padding:0 var(--gap-sm, 1rem);border:2px solid var(--shadow-hover, rgba(70, 62, 55, .18));border-radius:var(--radius-md, 10px);background:var(--white, #fefefe);color:var(--txt, #463E37);font-size:.95rem}.estudio-lib__gen-row input:focus{outline:none;border-color:var(--accent, #FF8A3D)}.estudio-lib__duration{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}.estudio-lib__duration-label{font-size:.82rem;font-weight:700;color:#463e37b3;margin-right:.2rem}.estudio-lib__dur{border:1px solid var(--shadow-hover, rgba(70, 62, 55, .18));background:var(--white, #fefefe);color:var(--txt, #463E37);padding:.3rem .85rem;border-radius:var(--radius-pill, 50px);font-family:var(--font-body, sans-serif);font-weight:700;font-size:.82rem;cursor:pointer;transition:background .16s ease,border-color .16s ease}.estudio-lib__dur:hover{background:var(--bg-light-orange, #fff3e0)}.estudio-lib__dur.is-active{background:var(--accent, #FF8A3D);border-color:var(--accent, #FF8A3D);color:var(--white, #fff)}.estudio-lib__feedback{margin:0;font-size:.85rem;min-height:1em}.estudio-lib__feedback.is-error{color:var(--color-red, #dc3545)}.estudio .hidden{display:none!important}@media(min-width:768px){.estudio{padding-top:var(--gap-lg, 2rem);gap:var(--gap-md, 1.5rem)}.estudio__title{font-size:1.6rem}.estudio__intro{font-size:1.1rem}.estudio-track__lane{height:74px}.estudio__submit{margin-top:calc(-1 * var(--gap-md, 1.5rem))}}
