:root{--COLOR-1: rgb(27, 27, 31);--COLOR-1-ON: rgb(255, 255, 255);--COLOR-1-CONTAINER: rgb(222, 222, 228);--COLOR-1-CONTAINER-ON: rgb(27, 27, 31);--COLOR-1-FIXED: rgb(236, 236, 240);--COLOR-1-FIXED-ON: rgb(27, 27, 31);--COLOR-1-FIXED-DIM: rgb(200, 200, 208);--COLOR-1-FIXED-VARIANT-ON: rgb(70, 70, 78);--COLOR-SURFACE-TINT: rgb(27, 27, 31);--alq-label: 11rem;--alq-mono: "Roboto Mono", ui-monospace, Menlo, Consolas, monospace;--alq-row: 2.5rem;--alq-key: #f0a531;--alq-audio: #7b5bc9}alquimia-app{display:flex;flex-direction:column;flex:1;min-width:0;height:100vh;height:100dvh}alquimia-app output[part=status]{font-size:.75rem;color:var(--COLOR-SURFACE-VARIANT-ON);padding:0 var(--SPACE-S);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:32rem}alquimia-app output[part=status][state=error]{color:var(--COLOR-ERROR, #b3261e)}alquimia-app panel-layout>panel-content{flex:1;min-height:0;padding:0}alquimia-app panel-slot:has(>[widget]){flex:1;min-height:0;height:auto;margin:0}alquimia-app panel-slot>[widget]{display:flex;flex-direction:column;flex:1;min-height:0}scenes-menu,aspects-menu,preview-area,time-line,style-menu,behavior-menu{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0;height:100%;box-sizing:border-box;color:var(--COLOR-SURFACE-ON);font-size:.875rem}panel-head{display:flex;align-items:flex-start;gap:var(--SPACE-S);padding:var(--SPACE-M) 2.75rem var(--SPACE-S) var(--SPACE-L)}panel-head [part=titles]{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}panel-head h2{display:flex;align-items:center;gap:var(--SPACE-S);margin:0;font-size:1rem;font-weight:500;letter-spacing:.01em}panel-head h2 icon{font-size:20px;color:var(--COLOR-1)}panel-head p:empty{display:none}panel-head p{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:.78rem;color:var(--COLOR-SURFACE-VARIANT-ON)}panel-head [part=actions]{display:flex;align-items:center;gap:2px}panel-head output{font-family:var(--alq-mono);font-size:.72rem;color:var(--COLOR-SURFACE-VARIANT-ON);margin-right:var(--SPACE-S);white-space:nowrap}icon-action{display:inline-flex}icon-action button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;margin:0;border-radius:var(--RADIUS-XXXL);background:transparent;color:var(--COLOR-SURFACE-VARIANT-ON);cursor:pointer;transition:background-color var(--TRANSITION-DURATION) var(--TRANSITION-EASE-IN-OUT)}icon-action button:hover{background:var(--COLOR-SURFACE-CONTAINER-HIGH);color:var(--COLOR-SURFACE-ON)}icon-action button:focus-visible{outline:2px solid var(--COLOR-1);outline-offset:1px}icon-action icon{font-size:22px;cursor:inherit}icon-action[role=primary] button{background:var(--COLOR-1);color:var(--COLOR-1-ON)}icon-action[role=primary] button:hover{background:var(--COLOR-1);box-shadow:var(--ELEVATION-LEVEL-1);color:var(--COLOR-1-ON)}icon-action[state=on] button,icon-action[state=on] button:hover{background:var(--COLOR-1);color:var(--COLOR-1-ON)}icon-action[hidden]{display:none}node-name{display:inline-block;font-family:var(--alq-mono);font-size:.78rem;line-height:1.5;padding:0 6px;border-radius:var(--RADIUS-XS);background:var(--COLOR-SURFACE-CONTAINER-HIGH);color:var(--COLOR-SURFACE-ON);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}node-name[kind=scene],node-name[kind=watch]{background:var(--COLOR-1-FIXED);color:var(--COLOR-1-FIXED-ON)}node-name[kind=mark]{background:#fdebc8;color:#5b3d00}node-name[kind=property]{background:transparent;padding:0;font-weight:500}node-name[kind=value]{background:transparent;padding:0;color:var(--COLOR-1)}scenes-menu [part=list]{display:flex;flex-direction:column;gap:var(--SPACE-S);padding:0 var(--SPACE-M) var(--SPACE-M);overflow:auto}scene-card{display:flex;align-items:center;gap:var(--SPACE-M);padding:var(--SPACE-S);border-radius:var(--RADIUS-M);border:1px solid var(--COLOR-OUTLINE-VARIANT);background:var(--COLOR-SURFACE-CONTAINER-LOWEST);cursor:pointer;transition:border-color var(--TRANSITION-DURATION),box-shadow var(--TRANSITION-DURATION)}scene-card:hover{box-shadow:var(--ELEVATION-LEVEL-1)}scene-card:focus-visible{outline:2px solid var(--COLOR-1);outline-offset:1px}scene-card[state=selected]{border-color:var(--COLOR-1);background:var(--COLOR-1-FIXED)}scene-card [part=thumb]{display:grid;place-items:center;width:56px;height:36px;border-radius:var(--RADIUS-S);background:var(--COLOR-SURFACE-CONTAINER-HIGHEST);color:var(--COLOR-SURFACE-VARIANT-ON);flex:none}scene-card[state=selected] [part=thumb]{background:var(--COLOR-1);color:var(--COLOR-1-ON)}scene-card [part=thumb] icon{font-size:20px;cursor:inherit}scene-card [part=body]{display:flex;flex-direction:column;gap:2px;min-width:0}scene-card [part=body] node-name{background:transparent;padding:0;font-size:.85rem;font-weight:500}scene-card p{margin:0;font-size:.72rem;color:var(--COLOR-SURFACE-VARIANT-ON)}aspects-menu [part=groups]{display:flex;flex-direction:column;gap:var(--SPACE-M);padding:0 var(--SPACE-S) var(--SPACE-M);overflow:auto}aspect-group{display:flex;flex-direction:column;gap:1px}aspect-group h3{display:flex;justify-content:space-between;margin:0 0 2px;padding:0 var(--SPACE-S);font-size:.7rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--COLOR-SURFACE-VARIANT-ON)}aspect-row{user-select:none;display:flex;align-items:center;gap:var(--SPACE-S);padding:4px var(--SPACE-S);border-radius:var(--RADIUS-XXXL);cursor:pointer}aspect-row:hover{background:var(--COLOR-SURFACE-CONTAINER-HIGH)}aspect-row:focus-visible{outline:2px solid var(--COLOR-1);outline-offset:-2px}aspect-row[state=selected]{background:var(--COLOR-1-CONTAINER);color:var(--COLOR-1-CONTAINER-ON)}aspect-row icon{font-size:18px;color:var(--COLOR-SURFACE-VARIANT-ON);cursor:inherit}aspect-row [part=names]{display:flex;align-items:baseline;gap:6px;min-width:0}aspect-row node-name{background:transparent;padding:0}aspect-row small{font-size:.7rem;color:var(--COLOR-SURFACE-VARIANT-ON);white-space:nowrap}preview-area [part=frame]{position:relative;flex:1;min-height:0;margin:0 var(--SPACE-M) var(--SPACE-M);overflow:hidden;border-radius:var(--RADIUS-M);background-color:var(--COLOR-SURFACE-CONTAINER-HIGHEST);background-image:radial-gradient(var(--COLOR-OUTLINE-VARIANT) 1px,transparent 1px);background-size:16px 16px}preview-area [part=stage]{position:absolute;left:50%;top:50%;transform-origin:center;overflow:hidden;background:var(--COLOR-SURFACE-CONTAINER-LOWEST);box-shadow:var(--ELEVATION-LEVEL-2);font-family:var(--FONT-FAMILY)}preview-area [part=empty]{position:absolute;inset:auto 0 var(--SPACE-L);margin:0;text-align:center;font-size:.8rem;color:var(--COLOR-SURFACE-VARIANT-ON);pointer-events:none}stage-piece{position:absolute;display:block;cursor:pointer;user-select:none}stage-piece[kind=element]{overflow:hidden}stage-piece[kind=object] canvas{display:block}stage-piece:hover{outline:1px dashed var(--COLOR-1);outline-offset:2px}stage-piece[state=selected]{outline:2px solid var(--COLOR-1);outline-offset:3px}time-line [part=board]{position:relative;flex:1;min-height:0;margin:0 var(--SPACE-M) var(--SPACE-M);overflow:auto;border-radius:var(--RADIUS-M);border:1px solid var(--COLOR-OUTLINE-VARIANT);background:var(--COLOR-SURFACE-CONTAINER-LOWEST);user-select:none;touch-action:none}time-line[state=static] [part=board]{display:none}time-line [part=empty]{margin:0 var(--SPACE-L) var(--SPACE-L);font-size:.8rem;color:var(--COLOR-SURFACE-VARIANT-ON)}time-line [part=ruler]{position:sticky;top:0;z-index:2;height:1.6rem;margin-left:var(--alq-label);margin-right:var(--SPACE-L);background:var(--COLOR-SURFACE-CONTAINER-LOWEST);border-bottom:1px solid var(--COLOR-OUTLINE-VARIANT);cursor:ew-resize}time-line [part=ruler] span{position:absolute;bottom:0;transform:translate(-50%);padding-bottom:4px;font-family:var(--alq-mono);font-size:.66rem;color:var(--COLOR-SURFACE-VARIANT-ON)}time-line [part=ruler] span:after{content:"";position:absolute;left:50%;bottom:-1px;width:1px;height:5px;background:var(--COLOR-OUTLINE)}track-row{display:grid;grid-template-columns:var(--alq-label) 1fr;height:var(--alq-row);border-bottom:1px solid var(--COLOR-SURFACE-CONTAINER-HIGH)}track-row [part=label]{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:6px;padding:0 var(--SPACE-S) 0 var(--SPACE-M);min-width:0;overflow:hidden;border-right:1px solid var(--COLOR-OUTLINE-VARIANT);background:var(--COLOR-SURFACE-CONTAINER-LOW)}track-row [part=label] icon{grid-row:span 2;font-size:16px;color:var(--COLOR-SURFACE-VARIANT-ON)}track-row [part=label] node-name{font-size:.74rem;line-height:1.2}track-row [part=label] small{font-size:.64rem;line-height:1.2;color:var(--COLOR-SURFACE-VARIANT-ON);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}track-row[state=selected] [part=label]{background:var(--COLOR-1-FIXED)}track-row[state=selected] [part=label] icon{color:var(--COLOR-1)}track-row [part=lane]{position:relative;margin-right:var(--SPACE-L);cursor:ew-resize}track-row [part=lane]:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--COLOR-SURFACE-CONTAINER-HIGHEST)}key-frame{position:absolute;top:50%;width:10px;height:10px;transform:translate(-50%,-50%) rotate(45deg);background:var(--alq-key);border:1.5px solid #8a5a00;border-radius:2px;cursor:pointer;z-index:1}key-frame:hover{transform:translate(-50%,-50%) rotate(45deg) scale(1.3)}track-row[state=selected] key-frame{background:var(--COLOR-1);border-color:var(--COLOR-1-FIXED-ON)}track-row [part=clip]{position:absolute;top:6px;bottom:6px;padding:0 var(--SPACE-S);border-radius:var(--RADIUS-XS);overflow:hidden;display:flex;align-items:center;font-size:.68rem;color:#fff;white-space:nowrap;background:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 2px,transparent 2px 6px),var(--alq-audio)}time-line [part=cursor]{position:absolute;top:0;bottom:0;width:2px;z-index:3;pointer-events:none;background:var(--COLOR-1);left:calc(var(--alq-label) + (100% - var(--alq-label) - var(--SPACE-L)) * var(--at, 0) - 1px)}time-line [part=cursor]:before{content:"";position:absolute;top:0;left:-5px;border:6px solid transparent;border-top-color:var(--COLOR-1)}style-menu{overflow:auto}style-menu [part=kind]{display:inline-flex;align-items:center;gap:3px;font-size:.72rem;font-weight:500;color:var(--COLOR-1)}style-menu [part=kind] icon{font-size:16px}style-menu [part=chain]{padding:0 var(--SPACE-L) var(--SPACE-S)}style-menu h3{margin:0 0 var(--SPACE-XS);font-size:.7rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--COLOR-SURFACE-VARIANT-ON)}style-menu [part=chain] ol{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;counter-reset:link}style-menu [part=chain] li{display:inline-flex;align-items:center;gap:4px;padding:2px 8px 2px 4px;border-radius:var(--RADIUS-XXXL);border:1px solid var(--COLOR-OUTLINE-VARIANT);background:var(--COLOR-SURFACE-CONTAINER-LOWEST);cursor:pointer}style-menu [part=chain] li:hover{border-color:var(--COLOR-1)}style-menu [part=chain] li[relation=own]{border-color:var(--COLOR-1);background:var(--COLOR-1-FIXED)}style-menu [part=chain] li[relation=anchor]{border-style:dashed}style-menu [part=chain] li node-name{background:transparent}style-menu [part=chain] small{font-size:.66rem;color:var(--COLOR-SURFACE-VARIANT-ON)}style-menu [part=message]{margin:0 var(--SPACE-L);font-family:var(--alq-mono);font-size:.72rem;color:#b3261e;white-space:pre-wrap}style-menu [part=message]:empty{display:none}style-menu [part=groups] section{padding:var(--SPACE-S) var(--SPACE-L);border-top:1px solid var(--COLOR-SURFACE-CONTAINER-HIGH)}style-row{display:grid;grid-template-columns:7.5rem 1fr;align-items:center;gap:2px var(--SPACE-S);padding:3px 0}style-row [part=property]{font-family:var(--alq-mono);font-size:.76rem;color:var(--COLOR-SURFACE-VARIANT-ON);overflow:hidden;text-overflow:ellipsis}style-row[origin=own] [part=property]{color:var(--COLOR-1);font-weight:500}style-row select,style-row input,style-row output{box-sizing:border-box;height:28px;min-width:0;padding:0 var(--SPACE-S);font-family:var(--alq-mono);font-size:.78rem;border:1px solid var(--COLOR-OUTLINE-VARIANT);border-radius:var(--RADIUS-XS);background:var(--COLOR-SURFACE-CONTAINER-LOWEST);color:var(--COLOR-SURFACE-ON)}style-row select:focus,style-row input:focus{outline:none;border-color:var(--COLOR-1);box-shadow:0 0 0 1px var(--COLOR-1)}style-row label[part=editor]{display:flex;align-items:center;gap:4px;min-width:0}style-row label[part=editor] input{flex:1;width:0}style-row label[part=editor] span{font-family:var(--alq-mono);font-size:.7rem;color:var(--COLOR-SURFACE-VARIANT-ON)}style-row output{display:flex;align-items:center;background:transparent}style-row [part=sources]{grid-column:2;display:flex;flex-wrap:wrap;gap:3px}style-row [part=sources] span{font-family:var(--alq-mono);font-size:.64rem;padding:0 5px;border-radius:var(--RADIUS-XS);color:var(--COLOR-SURFACE-VARIANT-ON);background:var(--COLOR-SURFACE-CONTAINER)}style-row [part=sources] span[state=wins]{color:var(--COLOR-1-FIXED-ON);background:var(--COLOR-1-FIXED)}style-row [part=sources] span[state=overridden]{text-decoration:line-through;opacity:.7}style-row [part=sources] span[state=initial]{font-style:italic}behavior-menu{overflow:auto}behavior-menu [part=steps]{display:flex;flex-direction:column;gap:2px;padding:0 var(--SPACE-M)}behavior-step{display:flex;align-items:center;gap:var(--SPACE-S);padding:4px var(--SPACE-S);border-radius:var(--RADIUS-S);cursor:pointer}behavior-step:hover{background:var(--COLOR-SURFACE-CONTAINER-HIGH)}behavior-step [part=frame]{min-width:2.2rem;font-family:var(--alq-mono);font-size:.72rem;text-align:right;color:#8a5a00}behavior-step [part=frame]:before{content:"\25c6  ";color:var(--alq-key)}behavior-menu [part=empty]{margin:0;padding:0 var(--SPACE-S);font-size:.8rem;color:var(--COLOR-SURFACE-VARIANT-ON)}preview-area [part=virtual]{font-size:.72rem;font-weight:500;padding:0 8px;border-radius:var(--RADIUS-XXXL);background:var(--COLOR-1);color:var(--COLOR-1-ON)}preview-area panel-head small{font-size:.7rem;color:var(--COLOR-SURFACE-VARIANT-ON)}preview-area[scene=virtual] [part=frame]{box-shadow:inset 0 0 0 2px var(--COLOR-1)}filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:0 var(--SPACE-M) var(--SPACE-S)}filter-tag,filter-add{position:relative;display:inline-flex;align-items:center;height:28px;border-radius:var(--RADIUS-XXXL);border:1px solid var(--COLOR-OUTLINE-VARIANT);background:var(--COLOR-SURFACE-CONTAINER-LOWEST);font-size:.76rem}filter-tag [part=mark]{padding:0 2px 0 10px;font-family:var(--alq-mono);font-size:.72rem;color:var(--COLOR-SURFACE-VARIANT-ON);white-space:nowrap}filter-tag select,filter-add select{appearance:none;-webkit-appearance:none;height:100%;width:auto;margin:0;padding:0 24px 0 4px;border:0;border-radius:var(--RADIUS-XXXL);background:transparent;color:var(--COLOR-SURFACE-ON);font:inherit;font-weight:500;cursor:pointer}filter-tag select:focus,filter-add select:focus{outline:none;box-shadow:none}filter-tag:focus-within,filter-add:focus-within{border-color:var(--COLOR-1)}filter-tag [part=arrow]{position:absolute;right:6px;font-size:16px;pointer-events:none;color:var(--COLOR-SURFACE-VARIANT-ON)}filter-tag:has(>button) [part=arrow]{right:30px}filter-tag:has(>button) select{padding-right:22px}filter-tag[state=set]{background:var(--COLOR-1);border-color:var(--COLOR-1)}filter-tag[state=set] [part=mark],filter-tag[state=set] select,filter-tag[state=set] [part=arrow]{color:var(--COLOR-1-ON)}filter-tag[state=set] select option{color:var(--COLOR-SURFACE-ON)}filter-tag button[part=remove]{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin:0 3px 0 0;padding:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}filter-tag button[part=remove]:hover{background:var(--COLOR-SURFACE-CONTAINER-HIGH);color:var(--COLOR-SURFACE-ON)}filter-tag[state=set] button[part=remove]{color:var(--COLOR-1-ON)}filter-tag button[part=remove] icon{font-size:16px;cursor:inherit}filter-add{border-style:dashed;padding-left:6px;color:var(--COLOR-SURFACE-VARIANT-ON)}filter-add icon{font-size:16px}filter-add select{padding-right:10px;color:var(--COLOR-SURFACE-VARIANT-ON);font-weight:400}
