.app{display:flex;flex-direction:column;height:100vh;height:100dvh}.stage-wrap{display:flex;flex:1;min-height:0}.appbar{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;padding:12px 20px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 1px #fff9;position:relative;z-index:10}.brand{display:flex;align-items:center;gap:11px}.brand__mark{width:38px;height:38px;flex:none;display:block;transform-origin:center 72%;animation:jelly-pop .7s cubic-bezier(.34,1.56,.64,1) both}.brand:hover .brand__mark{animation:jelly-pop .6s cubic-bezier(.34,1.56,.64,1)}.brand__text{display:flex;flex-direction:column;line-height:1.15}.brand__name{font-family:var(--font-display);font-weight:900;font-size:19px;letter-spacing:.01em}.brand__tag{font-size:11px;font-weight:500;color:var(--ink-soft)}.appbar__center{flex:1 1 auto;display:flex;justify-content:center}.appbar__actions{display:flex;align-items:center;gap:10px}.segmented{display:inline-flex;gap:4px;padding:5px;background:#2b22430f;border:1px solid var(--line);border-radius:var(--r-pill)}.seg{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;font-family:var(--font-body);font-weight:700;font-size:14px;color:var(--ink-soft);padding:9px 16px;border-radius:var(--r-pill);cursor:pointer;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;transition:transform .14s cubic-bezier(.34,1.56,.64,1),color .2s}.seg:before{content:"";width:9px;height:9px;border-radius:3px;background:var(--line-strong);box-shadow:var(--gloss)}.seg--edit:before{background:var(--gel-cool)}.seg--play:before{background:var(--gel-warm)}.seg:disabled{opacity:.45;cursor:not-allowed}.seg:not(:disabled):active{transform:scale(.95)}.seg.is-active{background:var(--card);box-shadow:var(--shadow-1),var(--gloss)}.seg--edit.is-active{color:#11968f}.seg--play.is-active{color:#d8336a}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:var(--font-body);font-weight:700;font-size:14px;line-height:1;display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:var(--r-md);cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--ink);box-shadow:var(--shadow-1),var(--gloss);transition:transform .14s cubic-bezier(.34,1.56,.64,1),box-shadow .2s}.btn:not(:disabled):hover{transform:translateY(-1px);box-shadow:var(--shadow-2),var(--gloss)}.btn:not(:disabled):active{transform:translateY(1px) scale(.97);box-shadow:var(--shadow-1)}.btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn--primary{color:#fff;border-color:transparent;background:linear-gradient(135deg,#ff7a45,#e63a6b);box-shadow:var(--shadow-warm),var(--gloss);text-shadow:0 1px 2px rgba(120,10,40,.35)}.btn--primary:not(:disabled):hover{box-shadow:0 12px 26px #ff4e7c66,var(--gloss)}.btn--ghost{background:#ffffff8c}.stage{position:relative;flex:1;min-width:0;overflow:hidden;background:linear-gradient(180deg,var(--studio-top),var(--studio-bottom))}.stage:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background-image:radial-gradient(circle at center,rgba(255,255,255,.05) 1px,transparent 1.4px);background-size:22px 22px}.stage:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:radial-gradient(70% 55% at 50% 6%,rgba(151,99,184,.28),transparent 70%),radial-gradient(130% 90% at 50% 42%,transparent 45%,rgba(8,5,15,.55));transition:box-shadow .2s}.stage.is-dragging:after{box-shadow:inset 0 0 0 3px var(--rose),inset 0 0 70px #ff4e7c47}.stage__canvas{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;touch-action:none}.dropzone{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center;color:#fff;pointer-events:none}.dropzone__art{width:120px;height:120px;filter:drop-shadow(0 18px 32px rgba(255,78,124,.4));animation:breathe 2.8s ease-in-out infinite}.dropzone__title{margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(20px,4vw,28px)}.dropzone__sub{margin:0;font-size:14px;color:#ffffffb8}.dropzone__chip{margin-top:2px;font-family:var(--font-num);font-size:11px;letter-spacing:.06em;color:#ffffffa6;border:1px solid rgba(255,255,255,.2);border-radius:var(--r-pill);padding:5px 12px}.stage__error{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}.stage__error span{background:#140e1eb3;color:#fff;font-size:14px;line-height:1.7;padding:16px 20px;border-radius:var(--r-md);border:1px solid rgba(255,255,255,.12)}.inspector{width:300px;flex:none;background:var(--paper);border-left:1px solid var(--line);overflow-y:auto;padding:18px 16px 26px}.inspector__head{display:flex;align-items:center;gap:10px;margin:2px 2px 16px}.inspector__title{margin:0;font-family:var(--font-display);font-weight:700;font-size:18px}.inspector__count{font-family:var(--font-num);font-weight:700;font-size:12px;color:#fff;background:var(--ink);min-width:23px;height:23px;padding:0 7px;border-radius:var(--r-pill);display:inline-flex;align-items:center;justify-content:center}.inspector__intro{margin:-4px 2px 14px;font-size:12px;line-height:1.7;color:var(--ink-soft)}.inspector__empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:30px 14px;color:var(--ink-soft)}.inspector__empty-art{width:60px;height:60px;opacity:.9}.inspector__empty p{margin:0;font-size:13px;line-height:1.75}.rcard{position:relative;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 14px 14px 18px;margin-bottom:12px;box-shadow:var(--shadow-1)}.rcard:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--rc)}.rcard__head{display:flex;align-items:center;gap:9px;margin-bottom:14px}.rcard__chip{width:14px;height:14px;flex:none;border-radius:5px;background:var(--rc);box-shadow:var(--gloss),0 1px 2px #0000002e}.rcard__name{font-family:var(--font-display);font-weight:700;font-size:15px;margin-right:auto}.rcard__del{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--ink-soft);width:30px;height:30px;border-radius:var(--r-sm);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .2s,color .2s,transform .12s}.rcard__del:hover{background:#ff4e7c1f;color:var(--rose)}.rcard__del:active{transform:scale(.9)}.rfield{margin-bottom:14px}.rfield:last-child{margin-bottom:2px}.rfield__top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px}.rfield__label{font-size:13px;font-weight:500;color:var(--ink)}.rfield__val{font-family:var(--font-num);font-weight:700;font-size:13px;color:var(--ink-soft)}.rfield__ends{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--ink-soft)}.slider{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:100%;height:10px;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--rc) 0 var(--fill),rgba(43,34,67,.1) var(--fill) 100%);cursor:pointer}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border:none;border-radius:50%;background:#fff;box-shadow:0 2px 6px #2b22434d,var(--gloss);cursor:grab;transition:transform .12s}.slider::-webkit-slider-thumb:active{transform:scale(1.15);cursor:grabbing}.slider::-moz-range-thumb{width:22px;height:22px;border:none;border-radius:50%;background:#fff;box-shadow:0 2px 6px #2b22434d;cursor:grab}.slider::-moz-range-progress{height:10px;border-radius:var(--r-pill);background:var(--rc)}.slider:focus-visible{outline-offset:4px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);z-index:50;display:flex;align-items:center;gap:10px;max-width:min(92vw,420px);padding:13px 18px;background:var(--ink);color:#fff;border-radius:var(--r-pill);box-shadow:var(--shadow-2);font-size:14px;font-weight:500;animation:toast-in .4s cubic-bezier(.34,1.56,.64,1)}.toast__dot{width:9px;height:9px;flex:none;border-radius:50%;background:var(--gel-warm)}@keyframes jelly-pop{0%{transform:scale(1)}22%{transform:scale(1.16,.84)}44%{transform:scale(.9,1.1)}64%{transform:scale(1.06,.96)}82%{transform:scale(.98,1.02)}to{transform:scale(1)}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.05,.95)}}@keyframes toast-in{0%{transform:translate(-50%,16px);opacity:0}to{transform:translate(-50%);opacity:1}}@media(max-width:860px){.appbar{padding:10px 14px;gap:10px 12px}.brand__tag{display:none}.appbar__center{order:3;flex-basis:100%;justify-content:flex-start}.stage-wrap{flex-direction:column}.inspector{width:auto;max-height:42vh;border-left:none;border-top:1px solid var(--line)}}@media(max-width:420px){.seg{padding:9px 12px;font-size:13px}.btn{padding:10px 13px}}@media(prefers-reduced-motion:reduce){*,.brand__mark,.dropzone__art{animation:none!important}.btn,.seg,.rcard__del,.slider::-webkit-slider-thumb{transition:none}}:root{--ink: #2b2243;--ink-soft: #6e6385;--paper: #fbf6f2;--card: #ffffff;--line: rgba(43, 34, 67, .1);--line-strong: rgba(43, 34, 67, .16);--studio-top: #2a2040;--studio-bottom: #15101f;--peach: #ff9259;--rose: #ff4e7c;--mint: #2fc8be;--gel-warm: linear-gradient(135deg, var(--peach), var(--rose));--gel-cool: linear-gradient(135deg, #54e3d8, var(--mint));--font-display: "Zen Maru Gothic", system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;--font-body: "Zen Kaku Gothic New", system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;--font-num: "Space Grotesk", ui-monospace, "SFMono-Regular", monospace;--r-sm: 10px;--r-md: 14px;--r-lg: 20px;--r-pill: 999px;--shadow-1: 0 1px 2px rgba(43, 34, 67, .08), 0 2px 6px rgba(43, 34, 67, .06);--shadow-2: 0 6px 16px rgba(43, 34, 67, .12), 0 2px 4px rgba(43, 34, 67, .08);--shadow-warm: 0 8px 20px rgba(255, 78, 124, .32);--shadow-cool: 0 8px 20px rgba(47, 200, 190, .3);--gloss: inset 0 1px 0 rgba(255, 255, 255, .85)}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font-family:var(--font-body);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}:focus-visible{outline:3px solid var(--rose);outline-offset:2px;border-radius:4px}.num{font-family:var(--font-num);font-feature-settings:"tnum" 1;letter-spacing:.02em}