:root{font-family:Segoe UI Variable,Trebuchet MS,Verdana,sans-serif;color:var(--text);background-color:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--text: #1f1b16;--bg: #efe9dd;--bg-r1: #f8f2e8;--bg-r2: #e9e1d3;--bg-r3: #ded4c4;--panel-bg: #fffaf2;--panel-border: #d7cbb7;--panel-shadow: rgba(38, 30, 21, .08);--field-bg: #f7f3ea;--field-border: #c8bca8;--button-bg: #1f1b16;--button-text: #f9f3e7;--dock-bg: #f7e0d9;--dock-border: #d7cbb7;--dock-shadow: rgba(38, 30, 21, .12);--error-text: #8f1e17;--error-bg: #fde8e7;--error-border: #d23429;--preview-bg-1: rgba(226, 214, 198, .3);--preview-bg-2: rgba(255, 248, 236, .6);--accent: #2eb774;--note: #4b463f;--notch: #1f1b16}html[data-theme=light]{--text: #1f1b16;--bg: #f4f4f1;--bg-r1: #ffffff;--bg-r2: #f0f0ec;--bg-r3: #e7e7e1;--panel-bg: #ffffff;--panel-border: #d2d2c8;--panel-shadow: rgba(20, 18, 14, .08);--field-bg: #ffffff;--field-border: #c8c8bf;--button-bg: #1f1b16;--button-text: #f9f3e7;--dock-bg: #f2efe8;--dock-border: #d2d2c8;--dock-shadow: rgba(20, 18, 14, .12);--error-text: #8f1e17;--error-bg: #ffe8e6;--error-border: #d93a2f;--preview-bg-1: rgba(220, 220, 220, .4);--preview-bg-2: rgba(245, 245, 245, .7);--accent: #2eb774;--note: #4b4b45;--notch: #1f1b16}html[data-theme=dark]{--text: #f3efe6;--bg: #1e1b17;--bg-r1: #2a251f;--bg-r2: #1f1b17;--bg-r3: #15120f;--panel-bg: #2a251f;--panel-border: #3a332b;--panel-shadow: rgba(0, 0, 0, .4);--field-bg: #1e1b17;--field-border: #4b4236;--button-bg: #f3efe6;--button-text: #1e1b17;--dock-bg: #2f2822;--dock-border: #3a332b;--dock-shadow: rgba(0, 0, 0, .5);--error-text: #ffb4a8;--error-bg: #3a1f1b;--error-border: #b33a2e;--preview-bg-1: rgba(60, 54, 46, .35);--preview-bg-2: rgba(40, 35, 30, .6);--accent: #2eb774;--note: #c9c0b2;--notch: #f3efe6}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,var(--bg-r1),var(--bg-r2) 60%,var(--bg-r3))}#app{display:flex;flex-direction:column;gap:16px;min-height:100vh;padding:20px}#errors{min-height:24px;color:var(--error-text);font-size:.95rem;white-space:pre-line;background:var(--error-bg);border:1px solid var(--error-border);border-left-width:6px;border-radius:10px;padding:10px 12px}#errors:empty{display:none}.app-shell{position:relative;min-height:70vh}#controls{position:fixed;inset:0;z-index:5;pointer-events:none}#right-rail{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:auto;z-index:6}.right-rail-menu{position:absolute;right:calc(100% + 14px);top:0;display:none;flex-direction:column;gap:8px;padding:12px;min-width:200px;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:16px;box-shadow:0 14px 30px var(--panel-shadow)}.right-rail-menu.is-open{display:flex}.right-rail-panel{position:absolute;right:calc(100% + 16px);top:50%;transform:translateY(-50%);display:none;flex-direction:column;gap:12px;padding:14px;min-width:280px;max-width:320px;max-height:70vh;overflow:auto;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:18px;box-shadow:0 16px 36px var(--panel-shadow)}.right-rail-panel.is-open{display:flex}.attributes-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.attributes-menu-item{border:1px solid var(--field-border);background:var(--field-bg);color:var(--text);border-radius:14px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}.attributes-menu-item:hover{background:var(--panel-bg)}.attributes-menu-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--panel-bg);border:1px solid var(--panel-border);font-size:.75rem;font-weight:700}.attributes-menu-icon img{width:22px;height:22px;display:block}.attributes-menu-icon.is-text{letter-spacing:.08em}.attributes-menu-label{font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;text-align:center}.floating-panel{position:absolute;left:120px;top:120px;display:none;flex-direction:column;min-width:280px;max-width:360px;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:16px;box-shadow:0 18px 36px var(--panel-shadow);pointer-events:auto;z-index:6}.floating-panel.is-open{display:flex}.floating-panel.is-minimized .floating-panel-body{display:none}.floating-panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid var(--panel-border);cursor:grab}.floating-panel-header:active{cursor:grabbing}.floating-panel-title{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.floating-panel-controls{display:flex;gap:6px}.floating-panel-control{border:1px solid var(--field-border);background:var(--field-bg);color:var(--text);border-radius:8px;padding:2px 8px;font-size:.85rem;cursor:pointer}.floating-panel-body{padding:12px}.floating-panel-content{border:none;box-shadow:none;padding:0;background:transparent}.floating-panel-content .panel-heading{display:none}.floating-panel-content .panel-body{padding:0}.right-rail-tab-shell{display:flex;flex-direction:column;gap:12px}.right-rail-tab-bar{display:flex;gap:8px;flex-wrap:wrap}.right-rail-tab{border:1px solid var(--field-border);background:var(--field-bg);color:var(--text);border-radius:12px;padding:6px 10px;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.right-rail-tab.is-active{background:var(--button-bg);color:var(--button-text);border-color:transparent}.right-rail-tab-body{display:flex;flex-direction:column;gap:12px}.right-rail-tab-panel{display:none}.right-rail-tab-panel.is-active{display:block}.right-rail-panel .panel{border:none;box-shadow:none;padding:0;background:transparent}.right-rail-panel .panel-heading{display:none}.right-rail-panel .panel-body{padding:0}.right-rail-menu-item{border:1px solid var(--field-border);background:var(--field-bg);color:var(--text);border-radius:12px;padding:8px 12px;text-align:left;font-size:.8rem;font-weight:600;cursor:pointer}.right-rail-menu-item:hover{background:var(--panel-bg)}.right-rail-button{min-width:78px;min-height:78px;padding:8px 10px;border-radius:18px;border:1px solid var(--panel-border);background:var(--panel-bg);color:var(--text);font-size:.65rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;box-shadow:0 10px 24px var(--panel-shadow);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center}.right-rail-button.is-attr{min-width:72px;min-height:72px;border-width:2px;text-transform:none}.right-rail-button img{width:38px;height:38px;object-fit:contain;display:block}.right-rail-label{display:block;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase}.right-rail-icon{font-size:2.2rem;line-height:1;font-weight:800}.panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:16px;padding:16px;box-shadow:0 10px 30px var(--panel-shadow)}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.panel h2{margin:0;font-size:.9rem;letter-spacing:.12em;text-transform:uppercase}.panel-collapse{border:1px solid var(--panel-border);background:transparent;color:inherit;font-size:1rem;line-height:1;padding:2px 8px;border-radius:8px}.panel.is-collapsed .panel-body{display:none}.field{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;margin-bottom:10px}.field span{flex:1}.field input[type=number],.field input[type=text]{width:120px;padding:6px 8px;border-radius:10px;border:1px solid var(--field-border);background:var(--field-bg);color:var(--text)}.field select{width:140px;padding:6px 8px;border-radius:10px;border:1px solid var(--field-border);background:var(--field-bg);color:var(--text)}.field input[type=checkbox]{transform:scale(1.1)}.safe-zone-list{display:flex;flex-direction:column;gap:12px}.safe-zone-row{border:1px dashed #c8bca8;border-radius:12px;padding:12px;background:#fff4e3}.safe-zone-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.safe-zone-header strong{font-size:.95rem}.safe-zone-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}button{border:1px solid var(--field-border);background:var(--button-bg);color:var(--button-text);padding:8px 12px;border-radius:12px;font-size:.85rem;cursor:pointer}button:hover{opacity:.9}button.ghost{background:transparent;color:var(--text)}button.icon-button{padding:6px 10px;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:38px}button.icon-button img{width:22px;height:22px}button[aria-pressed=true]{background:var(--accent);color:#fff}#preview{min-height:520px;border-radius:18px;border:1px solid var(--panel-border);background:repeating-linear-gradient(45deg,var(--preview-bg-1),var(--preview-bg-1) 10px,var(--preview-bg-2) 10px,var(--preview-bg-2) 20px);aspect-ratio:16 / 9;max-width:3840px;max-height:2160px;padding:12px;display:flex;align-items:center;justify-content:center;position:relative}#preview .preview-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1;pointer-events:none;z-index:0}#preview-frame{position:relative;width:100%;height:100%;padding:30mm;display:flex;align-items:center;justify-content:center;z-index:1}#preview-canvas{width:100%;height:100%;display:flex;align-items:center;justify-content:center}#artboard-tabs{position:absolute;top:12px;left:12px;display:flex;gap:8px;flex-wrap:wrap;z-index:2}.artboard-tab{border:1px solid var(--field-border);background:var(--panel-bg);color:var(--text);border-radius:14px;padding:6px 10px;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;box-shadow:0 8px 18px var(--panel-shadow)}.artboard-tab.is-active{background:var(--button-bg);color:var(--button-text);border-color:transparent}.start-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#ffffffb8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:3}.start-overlay.is-visible{display:flex}.start-card{min-width:320px;padding:22px;border-radius:18px;background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:0 20px 40px var(--panel-shadow);display:flex;flex-direction:column;gap:14px}.start-card h2{margin:0;font-size:1rem;letter-spacing:.12em;text-transform:uppercase}.start-button{border:1px solid var(--field-border);background:var(--button-bg);color:var(--button-text);border-radius:12px;padding:8px 12px;font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}#preview svg{width:auto;height:auto;max-width:100%;max-height:100%;display:block}#preview svg[data-select-enabled=true] [data-role=safe-zone],#preview svg[data-select-enabled=true] [data-role=safe-zone-handle]{cursor:default!important}#dock-shell{position:absolute;left:0;top:0;transform:translate(-50%,-100%);display:inline-flex;flex-direction:column;align-items:center;gap:6px;pointer-events:auto}#dock{background:var(--dock-bg);border:1px solid var(--dock-border);border-radius:14px;padding:8px 6px;display:flex;flex-direction:row;gap:8px;box-shadow:0 12px 30px var(--dock-shadow)}#dock-panel{position:absolute;left:calc(100% + 12px);top:24px;min-width:320px;max-width:360px;display:none}#dock-panel.is-visible{display:block}.dock-menu{position:absolute;right:0;top:calc(100% + 10px);min-width:180px;padding:10px;border-radius:12px;background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:0 12px 30px var(--dock-shadow);display:none;flex-direction:column;gap:6px}.dock-menu.is-open{display:flex}.dock-menu-item{border:1px solid var(--field-border);background:var(--field-bg);color:var(--text);border-radius:10px;padding:8px 10px;display:flex;align-items:center;gap:8px;cursor:pointer}.dock-menu-item:hover{background:var(--panel-bg)}.dock-menu-icon{width:18px;text-align:center;font-size:.9rem}.dock-menu-item.is-active{border-color:var(--accent)}.dock-menu-check{margin-left:auto;width:12px;text-align:center;color:var(--accent);opacity:0}.dock-menu-item.is-active .dock-menu-check{opacity:1}.dock-panel{display:none}.dock-panel.is-active{display:block}.dock-button{border:1px solid var(--field-border);background:var(--panel-bg);color:var(--text);padding:6px 8px;border-radius:10px;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.dock-button.is-active{background:var(--button-bg);color:var(--button-text)}.dock-button.icon-button{min-width:38px;min-height:36px;padding:6px}.dock-notch{width:72px;height:6px;border-radius:4px;background:var(--notch);cursor:grab}.dock-notch:active{cursor:grabbing}.panel-note{margin:0;font-size:.85rem;color:var(--note)}#controls[data-measurement-active=true] [data-role=safe-zone-x],#controls[data-measurement-active=true] [data-role=safe-zone-y],#controls[data-measurement-active=true] [data-role=fold-line-offset]{display:none}@media(max-width:960px){.app-shell{min-height:auto}#preview{min-height:420px}#controls{position:static;pointer-events:auto}#dock-panel{position:static;margin-top:10px}#dock-shell{position:static;transform:none}}