@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300&family=Inter:wght@400;500;600;700&family=Noto+Serif+JP:wght@200;300;400;600&family=Shippori+Mincho:wght@400;500;600&family=Space+Mono:wght@400;700&family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap";:root{--bg-primary: #0a0708;--bg-secondary: #140d10;--bg-card: rgba(26, 17, 21, .85);--bg-card-hover: rgba(40, 25, 32, .95);--accent: #d81e35;--accent-secondary: #ff4d64;--accent-glow: rgba(216, 30, 53, .4);--accent-rgb: 216, 30, 53;--text-primary: #f8f2f4;--text-muted: #ad9ba0;--text-dim: #6e5f64;--border-color: rgba(216, 30, 53, .25);--border-focus: rgba(216, 30, 53, .65);--frame-edge: #2f141a;--frame-shadow: rgba(0, 0, 0, .8);--theme-name: "アネモネ I (赤×黒)";--theme-icon: "🌹"}[data-theme=anemone-1]{--bg-primary: #0a0708;--bg-secondary: #140d10;--bg-card: rgba(26, 17, 21, .85);--bg-card-hover: rgba(40, 25, 32, .95);--accent: #d81e35;--accent-secondary: #ff4d64;--accent-glow: rgba(216, 30, 53, .4);--accent-rgb: 216, 30, 53;--text-primary: #f8f2f4;--text-muted: #ad9ba0;--text-dim: #6e5f64;--border-color: rgba(216, 30, 53, .25);--border-focus: rgba(216, 30, 53, .65);--frame-edge: #2f141a;--theme-name: "アネモネ I (赤×黒)";--theme-icon: "🌹"}[data-theme=anemone-2]{--bg-primary: #080f14;--bg-secondary: #0e1a24;--bg-card: rgba(18, 34, 48, .85);--bg-card-hover: rgba(26, 48, 68, .95);--accent: #3ec8ee;--accent-secondary: #8ae4fc;--accent-glow: rgba(62, 200, 238, .45);--accent-rgb: 62, 200, 238;--text-primary: #f2f9fc;--text-muted: #95b6cb;--text-dim: #5c7b90;--border-color: rgba(62, 200, 238, .25);--border-focus: rgba(62, 200, 238, .65);--frame-edge: #153246;--theme-name: "アネモネ II (白×水色)";--theme-icon: "🪞"}[data-theme=nemophila-1]{--bg-primary: #060b17;--bg-secondary: #0c152a;--bg-card: rgba(16, 28, 56, .85);--bg-card-hover: rgba(24, 42, 82, .95);--accent: #2e86fa;--accent-secondary: #74adfb;--accent-glow: rgba(46, 134, 250, .45);--accent-rgb: 46, 134, 250;--text-primary: #f0f5ff;--text-muted: #97abdc;--text-dim: #5c719e;--border-color: rgba(46, 134, 250, .25);--border-focus: rgba(46, 134, 250, .65);--frame-edge: #162a52;--theme-name: "ネモフィラ I (白×青)";--theme-icon: "🪻"}[data-theme=nemophila-2]{--bg-primary: #030408;--bg-secondary: #070a14;--bg-card: rgba(10, 15, 30, .9);--bg-card-hover: rgba(16, 24, 48, .95);--accent: #1952cd;--accent-secondary: #4d82f7;--accent-glow: rgba(25, 82, 205, .4);--accent-rgb: 25, 82, 205;--text-primary: #e6ecfa;--text-muted: #7d8db5;--text-dim: #485473;--border-color: rgba(25, 82, 205, .25);--border-focus: rgba(25, 82, 205, .65);--frame-edge: #0c1936;--theme-name: "ネモフィラ II (黒×青)";--theme-icon: "🌌"}[data-theme=sunflower]{--bg-primary: #0e0c06;--bg-secondary: #1a160b;--bg-card: rgba(36, 30, 16, .85);--bg-card-hover: rgba(54, 44, 24, .95);--accent: #f2ba1d;--accent-secondary: #ffd566;--accent-glow: rgba(242, 186, 29, .45);--accent-rgb: 242, 186, 29;--text-primary: #fdfaf0;--text-muted: #c4b998;--text-dim: #7d7355;--border-color: rgba(242, 186, 29, .25);--border-focus: rgba(242, 186, 29, .65);--frame-edge: #3c3214;--theme-name: "サンフラワー (白×黄)";--theme-icon: "🌻"}:root{--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--transition-fast: .18s ease;--shadow-elevation: 0 16px 44px rgba(0, 0, 0, .7);--bg-surface: rgba(22, 17, 21, .75);--bg-surface-hover: rgba(34, 25, 31, .88);--border-subtle: rgba(255, 255, 255, .09);--border-active: var(--accent)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased}body{font-family:Inter,Zen Kaku Gothic New,"Noto Serif JP",-apple-system,BlinkMacSystemFont,sans-serif;background-color:var(--bg-primary);background-image:radial-gradient(circle at 15% 20%,rgba(var(--accent-rgb),.12) 0%,transparent 45%),radial-gradient(circle at 85% 80%,rgba(var(--accent-rgb),.08) 0%,transparent 45%);color:var(--text-primary);min-height:100vh;line-height:1.5;overflow-x:hidden;transition:background-color .4s ease,color .4s ease}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(rgba(255,255,255,.035) 1px,transparent 0);background-size:24px 24px;pointer-events:none;z-index:0}.app-layout{position:relative;z-index:1;display:flex;flex-direction:column;min-height:100vh;max-width:1560px;margin:0 auto;padding:16px 24px;gap:18px}.app-header{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;background:var(--bg-surface);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-color);border-radius:var(--radius-md);gap:16px;flex-wrap:wrap}.header-content{display:flex;flex-direction:column}.logo{font-family:Cinzel,"Noto Serif JP",serif;font-size:1.35rem;font-weight:700;letter-spacing:.12em;background:linear-gradient(135deg,#ffffff 40%,var(--accent-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:flex;align-items:center;gap:8px}.logo-icon{color:var(--accent);-webkit-text-fill-color:initial;filter:drop-shadow(0 0 10px var(--accent-glow))}.tagline{font-size:.76rem;color:var(--text-muted);letter-spacing:.04em;margin-top:2px}.costume-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.costume-label{font-size:.72rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.1em;margin-right:4px}.costume-btn{background:#ffffff0a;border:1px solid var(--border-color);color:var(--text-muted);padding:.4rem .8rem;font-size:.75rem;font-weight:500;border-radius:var(--radius-sm);cursor:pointer;display:inline-flex;align-items:center;gap:5px;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.costume-btn:hover{background:var(--bg-surface-hover);color:var(--text-primary);border-color:var(--border-focus)}.costume-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 0 14px var(--accent-glow);font-weight:600}.main-workspace{display:grid;grid-template-columns:1fr 380px;gap:20px;flex:1;align-items:start}@media(max-width:1024px){.main-workspace{grid-template-columns:1fr}}.canvas-section{display:flex;flex-direction:column;gap:14px}.canvas-container{position:relative;width:100%;aspect-ratio:4 / 3;max-height:76vh;background:#000;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-elevation),0 0 25px rgba(var(--accent-rgb),.12);border:1px solid var(--border-color);display:flex;justify-content:center;align-items:center}@media(max-width:960px){.canvas-container{aspect-ratio:1 / 1;max-height:none}}.canvas-holder{width:100%;height:100%;display:flex;justify-content:center;align-items:center;line-height:0}.canvas-holder canvas{display:block;max-width:100%;max-height:100%;object-fit:contain}.recording-badge{position:absolute;top:18px;right:18px;background:#dc143ce6;color:#fff;padding:6px 14px;border-radius:20px;font-size:.75rem;font-weight:600;display:none;align-items:center;gap:8px;box-shadow:0 0 15px #dc143c99;z-index:20}.recording-dot{width:8px;height:8px;border-radius:50%;background:#fff;animation:blink 1s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.toolbar-playback-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.btn-reseed-highlight{background:linear-gradient(135deg,rgba(var(--accent-rgb),.4),#b388ff59,rgba(var(--accent-rgb),.5))!important;border:1px solid var(--accent-secondary)!important;color:#fff!important;font-weight:700!important;box-shadow:0 0 16px var(--accent-glow),inset 0 0 8px #ffffff26!important;text-shadow:0 1px 4px rgba(0,0,0,.6);transition:all var(--transition-fast)!important}.btn-reseed-highlight:hover{background:linear-gradient(135deg,rgba(var(--accent-rgb),.6),#b388ff8c,rgba(var(--accent-rgb),.7))!important;border-color:#fff!important;box-shadow:0 0 24px var(--accent-glow),0 0 12px #ffffff80!important;transform:translateY(-1px) scale(1.02)}.btn-reseed-highlight:active{transform:translateY(1px) scale(.99)}.toolbar-export-group{display:flex;align-items:center;gap:10px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:4px 8px 4px 14px;box-shadow:inset 0 0 12px rgba(var(--accent-rgb),.05);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.toolbar-group-label{font-size:.74rem;font-weight:700;color:var(--accent);letter-spacing:.05em;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}.toolbar-group-label:before{content:"✨";font-size:.8rem}.toolbar-export-buttons{display:flex;align-items:center;gap:8px}@media(max-width:640px){.canvas-toolbar{flex-direction:column;align-items:stretch}.toolbar-playback-group,.toolbar-export-group{justify-content:space-between;width:100%}}.art-plate-bar{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.74rem;color:var(--text-muted);gap:12px;flex-wrap:wrap}.plate-info{display:flex;align-items:center;gap:8px;font-family:Cinzel,"Noto Serif JP",serif}.plate-tag{font-size:.65rem;font-weight:700;color:var(--accent);background:rgba(var(--accent-rgb),.15);padding:2px 6px;border-radius:4px;letter-spacing:.1em}.plate-title{color:var(--text-primary);font-weight:600;letter-spacing:.05em}.canvas-tip{font-size:.72rem;color:var(--text-dim);display:flex;align-items:center;gap:5px}.control-panel{display:flex;flex-direction:column;gap:14px}.panel-tabs{display:flex;gap:6px;background:var(--bg-surface);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:5px}.panel-tab-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:10px 12px;font-size:.8rem;font-weight:700;border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;color:var(--text-dim);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap}.panel-tab-btn .tab-icon{font-size:.92rem}.panel-tab-btn:hover{color:var(--text-primary);background:#ffffff0d}.panel-tab-btn.active{color:#fff;background:rgba(var(--accent-rgb),.22);border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.tab-content{display:none!important}.tab-content.active{display:flex!important;animation:fadeInTab .18s ease forwards}@keyframes fadeInTab{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}.panel-card{background:var(--bg-surface);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:18px;display:flex;flex-direction:column;gap:16px}.section-label{font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}.section-header-flex{display:flex;justify-content:space-between;align-items:center}.section-sublabel{font-size:.7rem;color:var(--text-dim)}.song-grid{display:flex;flex-direction:column;gap:8px}.song-card{background:#ffffff08;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:.8rem 1rem;cursor:pointer;transition:all var(--transition-fast);display:flex;flex-direction:column;gap:.25rem;text-align:left}.song-card:hover{background:var(--bg-surface-hover);border-color:var(--border-focus);transform:translate(3px)}.song-card.active{border-color:var(--accent);background:rgba(var(--accent-rgb),.12);box-shadow:0 0 16px var(--accent-glow)}.song-header{display:flex;justify-content:space-between;align-items:baseline}.song-title{font-size:.92rem;font-weight:600;color:var(--text-primary);letter-spacing:.05em}.song-card.active .song-title{color:var(--accent)}.song-no{font-family:Space Mono,monospace;font-size:.7rem;color:var(--text-dim)}.song-motif{font-size:.72rem;color:var(--text-muted);line-height:1.35}.mv-info-card{margin-top:4px;background:#ffffff05;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:12px;display:flex;flex-direction:column;gap:8px}.mv-info-title{font-size:.74rem;color:var(--text-muted);display:flex;align-items:center;gap:5px}.mv-card-title{font-weight:600;font-size:.85rem;color:var(--text-primary)}.mv-card-desc{font-size:.72rem;color:var(--text-muted);line-height:1.45}.mv-link-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:.74rem;font-weight:600;color:#f55;text-decoration:none;background:#ff55551a;border:1px solid rgba(255,85,85,.35);padding:.45rem .75rem;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.mv-link-btn:hover{background:#ff555538;border-color:#f55;box-shadow:0 0 10px #ff55554d}.sliders-list{display:flex;flex-direction:column;gap:16px}.slider-group{display:flex;flex-direction:column;gap:6px}.slider-header{display:flex;justify-content:space-between;font-size:.78rem}.slider-title{color:var(--text-muted);font-weight:500}.slider-val{font-weight:700;color:var(--accent);font-family:Space Mono,monospace}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:5px;background:#ffffff1a;border-radius:3px;outline:none;transition:background .3s}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 8px var(--accent-glow);transition:transform var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-labels{display:flex;justify-content:space-between;font-size:.65rem;color:var(--text-dim)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;font-size:.82rem;font-weight:600;border-radius:var(--radius-sm);cursor:pointer;border:1px solid transparent;transition:all var(--transition-fast);text-decoration:none;-webkit-user-select:none;user-select:none;white-space:nowrap}.btn-primary{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-secondary) 100%);color:#fff;border-color:var(--accent);box-shadow:0 4px 14px var(--accent-glow)}.btn-primary:hover{filter:brightness(1.15);transform:translateY(-1px);box-shadow:0 6px 20px var(--accent-glow)}.btn-tool{background:var(--bg-surface);border:1px solid var(--border-color);color:var(--text-primary)}.btn-tool:hover{background:var(--bg-surface-hover);border-color:var(--border-focus)}.btn-outline{background:#ffffff0d;border:1px solid var(--border-subtle);color:var(--text-primary)}.btn-outline:hover{background:#ffffff1a;border-color:#ffffff40}body.fullscreen-active .app-header,body.fullscreen-active .art-plate-bar,body.fullscreen-active .control-panel{display:none!important}body.fullscreen-active .canvas-toolbar{position:fixed;top:16px;right:16px;z-index:9999;background:transparent;border:none;padding:0;margin:0}body.fullscreen-active .toolbar-playback-group button:not(#btn-fullscreen),body.fullscreen-active .toolbar-export-group{display:none!important}body.fullscreen-active #btn-fullscreen{background:#0a0a10bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.25);color:#fff;padding:8px 16px;border-radius:var(--radius-full);box-shadow:0 4px 20px #0009}body.fullscreen-active #btn-fullscreen:hover{background:#14141ee6;border-color:#ffffff80;transform:scale(1.05)}body.fullscreen-active .app-layout{padding:0;max-width:none}body.fullscreen-active .main-workspace{grid-template-columns:1fr;gap:0}body.fullscreen-active .canvas-container{aspect-ratio:auto;width:100vw;height:100vh;max-height:100vh;border-radius:0;border:none}