:root{--bg: #F5F5F7;--surface: #FFFFFF;--ink: #1D1D1F;--ink-2: #6E6E73;--ink-3: #86868B;--line: rgba(0, 0, 0, .06);--line-2: rgba(0, 0, 0, .1);--fill: rgba(0, 0, 0, .045);--accent: #D97757;--accent-press: #C4664A;--on-accent: #FFFFFF;--hover: rgba(0, 0, 0, .075);--track: rgba(0, 0, 0, .1);--off: rgba(0, 0, 0, .12);--spot-a: rgba(20, 16, 24, .11);--spot-b: rgba(20, 16, 24, .04);--veil: rgba(245, 245, 247, .94);--veil-2: rgba(245, 245, 247, .7);--danger: #C2372C;--handle: rgba(0, 0, 0, .15);--surface-solid: #FFFFFF;--raised: #FFFFFF;--thumb: #FFFFFF;--shadow-panel: 0 20px 50px -30px rgba(0, 0, 0, .3);--app-bg: var(--bg);--ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", system-ui, sans-serif;--num: "SF Pro Display", -apple-system, "Helvetica Neue", system-ui, sans-serif;--ease: cubic-bezier(.2, .8, .2, 1);--ease-io: cubic-bezier(.65, 0, .25, 1);color-scheme:light}:root[data-theme=dark]{--bg: #1B1714;--bg-2: #2B231E;--glow: rgba(217, 119, 87, .16);--surface: rgba(44, 37, 32, .82);--surface-solid: #2C2520;--raised: rgba(255, 238, 226, .14);--thumb: #EFE7E0;--ink: #F6F1EC;--ink-2: #CBC1B8;--ink-3: #A2968B;--line: rgba(255, 238, 226, .09);--line-2: rgba(255, 238, 226, .17);--fill: rgba(255, 238, 226, .06);--accent: #E8906F;--accent-press: #D97757;--hover: rgba(255, 238, 226, .1);--track: rgba(255, 238, 226, .16);--off: rgba(255, 238, 226, .14);--spot-a: rgba(232, 144, 111, .16);--spot-b: rgba(255, 226, 205, .035);--veil: rgba(27, 23, 20, .9);--veil-2: rgba(27, 23, 20, .68);--danger: #FF7A6B;--handle: rgba(255, 238, 226, .22);--shadow-panel: 0 30px 70px -30px rgba(0, 0, 0, .85);--app-bg: var(--grain, none), radial-gradient(120% 55% at 50% 0%, var(--glow), transparent 62%), linear-gradient(180deg, var(--bg-2), var(--bg) 42%);color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 var(--ui);overflow:hidden;-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}kbd{font:500 11px/1 var(--num);padding:2px 5px;border-radius:5px;background:var(--fill);color:var(--ink-2)}#app{height:100%}html.theming .app *:not(canvas){transition:color .6s ease,background-color .6s ease,border-color .6s ease,box-shadow .6s ease,fill .6s ease!important}.curtain{position:absolute;inset:0;z-index:0;pointer-events:none}.curtain-hole{position:absolute;border-radius:50%;will-change:transform;overflow:hidden;-webkit-mask-image:radial-gradient(closest-side,#000 96.5%,transparent 100%);mask-image:radial-gradient(closest-side,#000 96.5%,transparent 100%)}.curtain-hole>i{position:absolute;display:block;will-change:transform;background:var(--app-bg);background-color:var(--bg)}.app .curtain .curtain-hole>i{transition:none!important}.app{position:relative;width:100%;height:100%;height:100dvh;background:var(--app-bg);overflow:hidden;overflow:clip;container:app / size;display:flex;flex-direction:column}.nav{flex:none;height:56px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:env(safe-area-inset-top,0px) max(20px,env(safe-area-inset-right,0px)) 0 max(20px,env(safe-area-inset-left,0px));position:relative;z-index:5;box-sizing:content-box}.brand{display:flex;align-items:center;gap:9px;font:600 15px var(--ui);letter-spacing:-.01em;color:inherit;background:none;border:0;cursor:pointer;padding:10px 14px 10px 10px;margin:-10px 0 -10px -10px;border-radius:12px;justify-self:start;transition:background .2s}.brand:hover{background:var(--fill, rgba(0,0,0,.04))}.brand:active .brand-mark{transform:scale(.92)}.brand-mark{transition:transform .15s}.brand:focus-visible{outline:2px solid var(--accent, #D97757);outline-offset:2px}.brand-mark{width:15px;height:21px;border-radius:3.5px;background:conic-gradient(from 210deg,#ff8fb1,#ffd27a,#9df2c8,#8cc8ff,#c9a2ff,#ff8fb1);box-shadow:inset 0 0 0 1.5px #ffffff8c}.nav-mid{justify-self:center}.back-btn{border:0;background:var(--fill);height:30px;padding:0 14px 0 9px;border-radius:999px;display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--ink)}.back-btn:hover{background:var(--hover)}.nav-right{justify-self:end;display:flex;gap:2px;align-items:center}.lang-btn{font:600 12px var(--num);letter-spacing:.02em}.icon-btn{width:34px;height:34px;border-radius:50%;border:0;background:none;display:grid;place-items:center;color:var(--ink-2);transition:background .2s,color .2s}.icon-btn:hover{background:var(--fill);color:var(--ink)}.icon-btn svg{width:19px;height:19px}.page{position:relative;flex:1;min-height:0;overflow:clip;z-index:1}.gl{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;pointer-events:none}.stage-host{position:absolute;inset:0;z-index:2;touch-action:none;-webkit-user-select:none;user-select:none}.stage-host.over-card{cursor:grab}.stage-host.dragging{cursor:grabbing}.stage.fx{z-index:3}.stage{position:absolute;left:0;top:0;right:var(--pr, 0px);bottom:var(--pb, 0px);transition:right .45s var(--ease),bottom .45s var(--ease);pointer-events:none}.spot{position:absolute;inset:0;pointer-events:none}.spot:before,.spot:after{content:"";position:absolute;inset:0;transition:opacity .6s ease}.spot:before{background:radial-gradient(38% 44% at 50% 50%,rgba(20,16,24,.11),rgba(20,16,24,.04) 55%,transparent 75%)}.spot:after{background:radial-gradient(38% 44% at 50% 50%,rgba(232,144,111,.16),rgba(255,226,205,.035) 55%,transparent 75%);opacity:0}:root[data-theme=dark] .spot:before{opacity:0}:root[data-theme=dark] .spot:after{opacity:1}.legend{position:absolute;right:calc(var(--pr, 0px) + 22px);top:calc((100% - var(--pb, 0px)) / 2);transform:translateY(-50%);display:flex;flex-direction:column;gap:4px;opacity:0;pointer-events:none;transition:opacity .3s;z-index:4}.legend.on{opacity:1;pointer-events:auto}.legend button{display:grid;grid-template-columns:8px auto auto;align-items:center;gap:8px;border:0;background:none;padding:6px 10px;border-radius:10px;text-align:left;font-size:11px;color:var(--ink-2)}.legend button i{width:8px;height:8px;border-radius:2px;background:var(--ink-3)}.legend button b{font-weight:600;color:var(--ink)}.legend button span{font:500 11px var(--num);color:var(--ink-3);font-variant-numeric:tabular-nums}.legend button[aria-pressed=true]{background:var(--raised);box-shadow:0 1px 4px #00000014}.legend button[aria-pressed=true] i{background:var(--accent)}.halo{position:absolute;left:50%;top:50%;width:132px;height:132px;margin:-66px 0 0 -66px;border-radius:50%;display:grid;place-items:center;z-index:4;pointer-events:none;opacity:0;transition:opacity .25s}.halo.on{opacity:1}.halo:before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#d9775700,#d97757e6,#8cc8ffcc,#d9775700);-webkit-mask:radial-gradient(circle,transparent 60px,#000 61px);mask:radial-gradient(circle,transparent 60px,#000 61px);animation:spin 1s linear infinite}.halo span{font-size:12px;color:var(--ink-2)}@keyframes spin{to{transform:rotate(360deg)}}.drop-ov{position:absolute;inset:14px;border-radius:26px;border:1.5px dashed var(--ink-3);display:grid;place-items:center;color:var(--ink-2);font-size:14px;background:var(--veil-2);opacity:0;pointer-events:none;transition:opacity .2s;z-index:6}.drop-ov.on{opacity:1}.empty-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;color:var(--ink-3);font-size:13px;pointer-events:none}.dock{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));transition:transform .45s var(--ease),opacity .3s;z-index:3}.app[data-mode=edit] .dock{transform:translateY(48px);opacity:0;pointer-events:none}.caption{text-align:center;padding-bottom:4px;max-width:92vw}.caption h1{margin:0;font-size:20px;font-weight:600;letter-spacing:-.015em;text-wrap:balance}.caption p{margin:2px 0 0;font-size:12.5px;color:var(--ink-3)}.reveal{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .42s var(--ease),opacity .28s;max-width:100%}.reveal>.reveal-in{overflow:hidden;min-height:0;display:flex;justify-content:center}.reveal.on{grid-template-rows:1fr;opacity:1}.rv-actions .actions{padding:10px 0 4px}.rv-actions .actions .btn{transform:translateY(6px);transition:transform .4s var(--ease),background .2s}.rv-actions.on .actions .btn{transform:none}.rv-actions.on .actions .btn:nth-child(2){transition-delay:.03s}.rv-actions.on .actions .btn:nth-child(3){transition-delay:.06s}.rv-strip .strip-wrap{padding-top:6px}.counter{margin-top:6px;border:0;background:none;color:var(--ink-3);font:500 12px var(--num);font-variant-numeric:tabular-nums;display:inline-flex;gap:6px;align-items:center;height:28px;padding:0 12px;border-radius:999px;transition:background .2s,color .2s}.counter:hover{background:var(--fill);color:var(--ink)}.actions{display:flex;gap:8px}.btn{height:36px;padding:0 18px;border-radius:999px;border:0;background:var(--fill);color:var(--ink);font-size:13.5px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:background .2s,transform .15s;white-space:nowrap}.btn:hover{background:var(--hover)}.btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);color:var(--on-accent)}.btn.primary:hover{background:var(--accent-press)}.btn.icon{width:36px;padding:0}.btn[disabled]{opacity:.45;pointer-events:none}.btn kbd{background:var(--fill)}.strip-wrap{max-width:100%;display:flex;align-items:center;gap:10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}.strip{display:flex;gap:10px;overflow-x:auto;padding:8px 4px;scrollbar-width:none;scroll-behavior:smooth}.strip::-webkit-scrollbar{display:none}.th{flex:none;width:48px;height:72px;border-radius:6px;border:0;padding:0;background:var(--surface-solid);position:relative;overflow:hidden;box-shadow:0 1px 3px #0000001f;transition:transform .3s var(--ease),box-shadow .3s}.th canvas{width:100%;height:100%;display:block}.th:hover{transform:translateY(-3px)}.th[aria-current=true]{transform:translateY(-5px);box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--ink),0 8px 18px -8px #00000059}.th{-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}.th.grp{margin-left:8px}.th.lifted{box-shadow:0 14px 28px -10px #00000073,0 0 0 1px var(--line-2);cursor:grabbing}.th.add{background:none;box-shadow:inset 0 0 0 1.5px var(--line-2);color:var(--ink-2);font-size:22px;font-weight:300;display:grid;place-items:center}.th.add:hover{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink-3)}.all-btn{flex:none;border:0;background:none;color:var(--ink-2);font-size:12px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px;border-radius:10px}.all-btn:hover{color:var(--ink);background:var(--fill)}.all-btn svg{width:18px;height:18px}.menu{position:absolute;z-index:30;min-width:180px;padding:6px;border-radius:14px;background:var(--surface-solid);box-shadow:0 0 0 1px var(--line),0 16px 40px -12px #00000040;display:flex;flex-direction:column;opacity:0;transform:translateY(6px) scale(.98);pointer-events:none;transition:opacity .18s,transform .2s var(--ease)}.menu.on{opacity:1;transform:none;pointer-events:auto}.menu button{border:0;background:none;text-align:left;padding:9px 12px;border-radius:9px;font-size:13.5px;display:flex;justify-content:space-between;gap:18px}.menu button:hover{background:var(--fill)}.menu button small{color:var(--ink-3)}.menu button.danger{color:var(--danger)}.menu hr{border:0;height:1px;background:var(--line);margin:4px 6px}.grid-ov{position:absolute;inset:0;z-index:8;background:var(--veil);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;flex-direction:column;opacity:0;pointer-events:none;transition:opacity .3s}.grid-ov.on{opacity:1;pointer-events:auto}.grid-head{display:flex;justify-content:space-between;align-items:center;padding:14px max(20px,env(safe-area-inset-right,0px)) 6px max(20px,env(safe-area-inset-left,0px))}.grid-head h2{margin:0;font-size:17px;font-weight:600}.grid-head span{color:var(--ink-3);font-weight:400;font-size:13px;margin-left:6px}.grid{flex:1;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:22px 18px;align-content:start;padding:14px max(20px,env(safe-area-inset-right,0px)) 30px max(20px,env(safe-area-inset-left,0px))}.grid figure{margin:0;display:flex;flex-direction:column;gap:8px;cursor:pointer;transform:translateY(10px);opacity:0;transition:transform .45s var(--ease),opacity .35s}.grid-ov.on .grid figure{transform:none;opacity:1}.grid figure canvas{width:100%;height:auto;aspect-ratio:var(--ar);border-radius:7px;box-shadow:0 10px 22px -14px #0006;max-width:100%}.grid figcaption{font-size:12.5px;color:var(--ink-2);text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.grid figure.cur figcaption{color:var(--ink);font-weight:600}.ip-group{grid-column:1 / -1;display:flex;align-items:baseline;gap:8px;margin-top:8px;font-size:13px;font-weight:600;color:var(--ink)}.ip-group:first-child{margin-top:0}.ip-group small{font-weight:400;color:var(--ink-3);font-variant-numeric:tabular-nums}.editor{position:absolute;top:0;right:0;bottom:0;width:372px;background:var(--surface);backdrop-filter:blur(24px) saturate(1.2);-webkit-backdrop-filter:blur(24px) saturate(1.2);box-shadow:-1px 0 0 var(--line);display:flex;flex-direction:column;transform:translate(102%);transition:transform .45s var(--ease);z-index:7}.app[data-mode=edit] .editor{transform:none}.ed-head{padding:16px 18px 10px;display:flex;flex-direction:column;gap:12px}.ed-head h2{margin:0;font-size:15px;font-weight:600;display:flex;justify-content:space-between;align-items:center}.ed-head h2 span{font-weight:400;color:var(--ink-3);font-size:12px}.seg{display:flex;padding:3px;border-radius:10px;background:var(--fill);gap:2px}.seg button{flex:1;border:0;background:none;height:30px;border-radius:8px;font-size:13px;color:var(--ink-2);transition:background .2s,color .2s;white-space:nowrap;padding:0 8px}.seg button[aria-selected=true],.seg button[aria-checked=true]{background:var(--raised);color:var(--ink);box-shadow:0 1px 3px #0000001a;font-weight:500}.ed-pages{flex:1;min-height:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none}.ed-pages::-webkit-scrollbar{display:none}.ed-page{flex:none;width:100%;overflow-y:auto;scroll-snap-align:start;padding:6px 18px 18px;display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.ed-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field>span{font-size:12px;color:var(--ink-3);display:flex;justify-content:space-between;gap:10px}.field>span em{font-style:normal;text-align:right}.field input[type=text]{height:40px;border-radius:10px;border:0;background:var(--fill);padding:0 12px;font-size:14px;outline:none;transition:box-shadow .2s,background .2s;width:100%}.field input[type=text]:focus{box-shadow:0 0 0 1.5px var(--ink),0 0 0 5px #0000000d}.field input.big{height:48px;font-size:18px;font-weight:600;letter-spacing:-.01em}.ip-row{display:flex;flex-wrap:wrap;gap:6px}.ip-chip{border:0;height:30px;padding:0 12px;border-radius:999px;background:var(--fill);color:var(--ink-2);font-size:12.5px;transition:background .2s,color .2s,box-shadow .2s}.ip-chip:hover{background:var(--hover);color:var(--ink)}.ip-chip[aria-checked=true]{background:var(--raised);color:var(--ink);box-shadow:0 0 0 1.5px var(--ink);font-weight:500}.ip-new{height:30px;width:110px;border-radius:999px;border:1px dashed var(--line-2);background:none;padding:0 12px;font-size:12.5px;color:var(--ink);outline:none}.ip-new:focus{border-style:solid;border-color:var(--ink-3)}.styles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.style-tile{border:0;padding:0;background:none;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-2)}.style-tile canvas{width:100%;aspect-ratio:var(--ar);border-radius:5px;box-shadow:0 1px 4px #00000026;transition:transform .25s var(--ease),box-shadow .25s;background:var(--fill);max-width:100%}.style-tile[aria-checked=true]{color:var(--ink);font-weight:600}.style-tile[aria-checked=true] canvas{box-shadow:0 0 0 2px var(--surface-solid),0 0 0 3.5px var(--ink);transform:translateY(-2px)}.hint{font-size:12px;color:var(--ink-3);line-height:1.55;margin:0}.finishes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.finish{border:0;background:var(--fill);border-radius:12px;padding:10px 6px 8px;display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12px;color:var(--ink-2);transition:box-shadow .2s,background .2s}.finish i{width:30px;height:30px;border-radius:50%;display:block;box-shadow:inset 0 0 0 1px #00000014}.finish[data-f=pearl] i{background:conic-gradient(#ffb3c8,#ffe29a,#a8f5d3,#a3d4ff,#d7baff,#ffb3c8)}.finish[data-f=silver] i{background:linear-gradient(135deg,#fdfdfd,#9a9ea4 45%,#f1f2f4 60%,#7b7f86)}.finish[data-f=gold] i{background:linear-gradient(135deg,#fff0c2,#b08431 45%,#f7dc8e 60%,#7a5a1c)}.finish[data-f=none] i{background:linear-gradient(135deg,#eee,#ddd)}.finish[aria-checked=true]{background:var(--raised);box-shadow:0 0 0 1.5px var(--ink);color:var(--ink);font-weight:500}.place{display:flex;gap:14px;align-items:center}.place-pad{position:relative;width:56px;flex:none;border-radius:5px;background:var(--fill);box-shadow:inset 0 0 0 1px var(--line);cursor:crosshair;touch-action:none;outline:none}.place-pad:before,.place-pad:after{content:"";position:absolute;background:var(--line-2)}.place-pad:before{left:50%;top:8%;bottom:8%;width:1px}.place-pad:after{top:50%;left:8%;right:8%;height:1px}.place-pad:focus-visible{box-shadow:inset 0 0 0 1px var(--line),0 0 0 2px var(--ink)}.place-pad i{position:absolute;z-index:1;width:14px;height:14px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 2px var(--surface-solid);pointer-events:none}.place-side{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}.range{display:flex;flex-direction:column;gap:8px}.range>span{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-3)}.range>span b{font:500 12px var(--num);color:var(--ink);font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:22px;background:none;margin:0}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--ink) var(--v, 50%),var(--track) var(--v, 50%))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--thumb);margin-top:-8px;box-shadow:0 1px 4px #0000004d,0 0 0 .5px #0000001a}input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:var(--track)}input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--ink)}input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;border:0;background:var(--thumb);box-shadow:0 1px 4px #0000004d}details.adv{border-top:1px solid var(--line);padding-top:4px}details.adv summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:10px 0;font-size:13px;color:var(--ink-2)}details.adv summary::-webkit-details-marker{display:none}details.adv summary:after{content:"";width:7px;height:7px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);transform:rotate(45deg) translateY(-3px);transition:transform .25s}details.adv[open] summary:after{transform:rotate(-135deg) translateY(-1px)}.adv-body{display:flex;flex-direction:column;gap:14px;padding:4px 0 8px}.row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px}.row small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:1px}.swatches{display:flex;gap:8px}.swatch{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000001a;position:relative;overflow:hidden;cursor:pointer;display:block}.swatch input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;border:0;padding:0}.link-btn{border:0;background:var(--fill);border-radius:9px;padding:0 12px;height:32px;font-size:12.5px;color:var(--ink);white-space:nowrap}.link-btn:hover{background:var(--hover)}.sub-panel{display:flex;flex-direction:column;gap:12px;padding:12px;border-radius:12px;background:var(--fill)}.ed-foot{display:flex;align-items:center;gap:8px;padding:12px 18px calc(14px + env(safe-area-inset-bottom,0px));box-shadow:0 -1px 0 var(--line)}.ed-foot .sp{flex:1}.ed-foot .btn.layers[aria-pressed=true]{background:var(--ink);color:var(--bg)}.ed-foot .btn.layers[aria-pressed=true] kbd{background:#ffffff2e;color:var(--bg)}.switch{-webkit-appearance:none;appearance:none;flex:none;width:42px;height:26px;border-radius:999px;background:var(--off);position:relative;cursor:pointer;transition:background .25s;margin:0}.switch:after{content:"";position:absolute;left:2px;top:2px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 5px #00000040;transition:transform .3s var(--ease)}.switch:checked{background:#34c759}.switch:checked:after{transform:translate(16px)}.ex{display:grid;grid-template-columns:1fr 372px;height:100%}.ex-stage{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:12px 20px 18px}.ex-frame{position:relative;overflow:hidden;border-radius:14px;box-shadow:0 0 0 1px var(--line),0 30px 60px -36px #00000059;flex:none;max-width:100%;background:#ececef}.ex-frame canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.ex-badge{position:absolute;left:12px;top:10px;font:500 10.5px var(--num);color:#00000061;letter-spacing:.04em;z-index:4;pointer-events:none}.ex-frame.darkbg .ex-badge{color:#ffffff80}.transport{display:flex;align-items:center;gap:12px;width:min(520px,100%)}.transport .icon-btn{background:var(--raised);box-shadow:0 1px 3px #0000001a;color:var(--ink);flex:none}.transport input{flex:1}.transport time{font:500 12px var(--num);color:var(--ink-2);font-variant-numeric:tabular-nums;min-width:92px;text-align:right}.ex-panel{background:var(--surface);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:-1px 0 0 var(--line);display:flex;flex-direction:column;min-height:0}.ex-scroll{flex:1;overflow-y:auto;padding:22px 20px 20px;display:flex;flex-direction:column;gap:18px}.ex-sum h2{margin:0;font-size:19px;font-weight:600;letter-spacing:-.015em}.ex-sum p{margin:4px 0 0;font-size:12.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}.ex-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ex-actions .btn{height:42px;font-size:14px}.ex-progress{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:12px;background:var(--fill);font-size:12.5px}.ex-progress .bar{height:4px;border-radius:2px;background:var(--track);overflow:hidden}.ex-progress .bar i{display:block;height:100%;width:0;background:var(--accent);border-radius:2px;transition:width .12s linear}.ex-progress p{margin:0;color:var(--ink-2);font-variant-numeric:tabular-nums;word-break:break-all}.ex-progress p b{color:var(--ink);font-weight:600}.ex-progress .ex-res{display:flex;gap:8px;align-items:center;justify-content:space-between}.ex-progress video,.ex-progress img{width:100%;border-radius:8px;background:#000;max-height:220px;object-fit:contain}.ex-label{font-size:12px;color:var(--ink-3);margin-bottom:8px}.presets{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.preset{border:0;background:var(--fill);border-radius:12px;padding:10px 6px;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;color:var(--ink-2)}.preset svg{width:30px;height:30px;color:var(--ink-2)}.preset[aria-checked=true]{background:var(--raised);box-shadow:0 0 0 1.5px var(--ink);color:var(--ink);font-weight:500}.preset[aria-checked=true] svg{color:var(--accent)}.timeline{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 8px}.clip{flex:none;display:flex;align-items:center;gap:8px;padding:6px 8px 6px 6px;border-radius:10px;background:var(--fill);font-size:12px;cursor:grab;user-select:none;touch-action:none;transition:transform .2s var(--ease),box-shadow .2s}.clip canvas{width:24px;height:36px;border-radius:3px}.clip small{display:block;color:var(--ink-3);font-size:10.5px;font-variant-numeric:tabular-nums}.clip.cap{background:none;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-3);cursor:pointer}.clip.cap[aria-pressed=true]{box-shadow:inset 0 0 0 1.5px var(--ink);color:var(--ink);background:var(--raised)}.clip.lifted{box-shadow:0 10px 20px -10px #00000059;background:var(--surface-solid);z-index:2;position:relative;transition:none}.clip .x{border:0;background:none;color:var(--ink-3);padding:0 2px;font-size:14px}.desk-only-note{display:none}.scrim{position:absolute;inset:0;z-index:20;background:#1414182e;opacity:0;pointer-events:none;transition:opacity .3s}.scrim.on{opacity:1;pointer-events:auto}.settings{position:absolute;top:0;right:0;bottom:0;width:340px;z-index:21;background:var(--surface);backdrop-filter:blur(24px) saturate(1.2);-webkit-backdrop-filter:blur(24px) saturate(1.2);box-shadow:-1px 0 0 var(--line),var(--shadow-panel);transform:translate(104%);transition:transform .45s var(--ease);display:flex;flex-direction:column}.settings.on{transform:none}.set-head{display:flex;justify-content:space-between;align-items:center;padding:calc(16px + env(safe-area-inset-top,0px)) 18px 8px}.set-head h2{margin:0;font-size:17px;font-weight:600}.set-body{flex:1;overflow-y:auto;padding:4px 18px 20px;display:flex;flex-direction:column;gap:22px}.set-group{display:flex;flex-direction:column;gap:12px}.set-group h3{margin:0;font-size:12px;font-weight:500;color:var(--ink-3);letter-spacing:.04em}.set-btns{display:flex;gap:8px;flex-wrap:wrap}.set-foot{padding:12px 18px calc(16px + env(safe-area-inset-bottom,0px));font-size:11.5px;color:var(--ink-3)}.toast{position:absolute;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);z-index:60;padding:10px 16px;border-radius:999px;background:var(--ink);color:var(--bg);font-size:13px;opacity:0;pointer-events:none;transition:opacity .25s,transform .35s var(--ease);max-width:calc(100% - 32px);text-align:center}.toast.on{opacity:1;transform:translate(-50%)}@container app (max-width: 640px){.nav{grid-template-columns:auto 1fr auto;gap:10px}.editor{top:auto;left:0;width:auto;height:47%;box-shadow:0 -1px 0 var(--line),0 -20px 40px -30px #0000004d;border-radius:22px 22px 0 0;transform:translateY(102%)}.ed-head{padding-top:10px}.ed-head:before{content:"";width:36px;height:5px;border-radius:3px;background:var(--handle);align-self:center}.ed-head h2{display:none}.legend{right:8px}.legend button{padding:5px 6px}.legend button span{display:none}.settings{top:auto;left:0;width:auto;height:74%;border-radius:22px 22px 0 0;transform:translateY(104%)}.ex{grid-template-columns:1fr;grid-template-rows:54% 1fr}.ex-stage{padding:6px 16px 10px;gap:8px}.ex-panel{box-shadow:0 -1px 0 var(--line)}.ex-scroll{padding:14px 16px calc(30px + env(safe-area-inset-bottom,0px));gap:14px}.desk-only{display:none!important}.desk-only-note{display:block}.caption h1{font-size:18px}.dock{padding-bottom:calc(22px + env(safe-area-inset-bottom,0px))}.app.kb .nav{display:none}.app.kb .editor{top:clamp(96px,26%,150px);height:auto}.app.kb .ed-head:before{display:none}.styles{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.style-tile{font-size:10.5px;gap:5px;white-space:nowrap}.style-tile canvas{border-radius:3.5px}}@media(prefers-reduced-motion:reduce){.halo:before{animation:none}}.static-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:auto;cursor:pointer}.static-card canvas{border-radius:14px;box-shadow:0 30px 60px -30px #00000073}.static-card p{margin:0;font-size:12px;color:var(--ink-3);text-align:center;max-width:260px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ritual{position:absolute;inset:0;z-index:40;cursor:pointer;transition:opacity .2s ease;touch-action:none}.ritual.fading{opacity:0}.ritual canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.ritual-skip{position:absolute;right:max(calc(3.5vmin + 26px),env(safe-area-inset-right,0px));top:calc(3.5vmin + 4px + env(safe-area-inset-top,0px));border:0;background:none;color:#f4e0c59e;font:500 11px/1 var(--num);letter-spacing:.14em;text-transform:uppercase;opacity:0;transition:opacity .4s;pointer-events:none}.ritual-skip.on{opacity:1}.guide{position:absolute;inset:0;z-index:45;cursor:pointer;-webkit-user-select:none;user-select:none}.guide-spot{position:absolute;left:0;top:0;width:0;height:0;border-radius:20px;pointer-events:none;box-shadow:0 0 0 200vmax #18120f66;opacity:0;transition:opacity .4s ease;will-change:transform}.guide-spot:after{content:"";position:absolute;inset:-2px;border-radius:inherit;box-shadow:0 0 0 2px rgba(244,224,197,calc(var(--ring, 0) * .9)),0 0 24px 4px rgba(221,114,63,calc(var(--ring, 0) * .35));animation:guide-ring 1.8s ease-in-out infinite}@keyframes guide-ring{50%{opacity:.55}}.guide.in .guide-spot{opacity:1}.guide-char{position:absolute;bottom:-.5%;left:0;width:40vh;height:46vh;pointer-events:none;opacity:0;transform:translateY(40px);transition:opacity .5s ease .06s,transform .7s cubic-bezier(.2,.9,.25,1.05) .06s,left .45s var(--ease)}.guide.in .guide-char{opacity:1;transform:none}.guide-char img{width:100%;height:100%;object-fit:fill;display:block;transform-origin:50% 100%;transition:transform .35s var(--ease)}.guide-char.mirror img{transform:scaleX(-1)}:root[data-theme=dark] .guide-char img{filter:drop-shadow(0 0 1px #F4E0C5) drop-shadow(0 0 1px #F4E0C5)}.guide-char[data-pose]{animation:none}.guide-char[data-pose=surprise]{animation:g-hop .5s cubic-bezier(.3,1.6,.5,1)}.guide-char[data-pose=smile]{animation:g-tilt .9s var(--ease)}.guide-char[data-pose=wave]{animation:g-sway 1.2s ease-in-out}.guide-char[data-pose=point]{animation:g-lean .6s var(--ease)}.guide-char.talking img{animation:g-talk .32s ease-in-out infinite alternate}@keyframes g-hop{0%{translate:0 0}40%{translate:0 -14px}to{translate:0 0}}@keyframes g-tilt{0%{rotate:0deg}45%{rotate:-1.6deg}to{rotate:0deg}}@keyframes g-sway{0%,to{rotate:0deg}25%{rotate:-1.8deg}60%{rotate:1.4deg}}@keyframes g-lean{0%{translate:0 0}50%{translate:10px 0}to{translate:4px 0}}@keyframes g-talk{0%{translate:0 0}to{translate:0 -2px}}.guide-box{position:absolute;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:min(680px,calc(100% - 32px));transform:translate(-50%,16px);opacity:0;transition:opacity .4s ease,transform .5s var(--ease);padding:22px 24px 14px;border-radius:20px;background:#fffcf7f2;color:#221916;box-shadow:0 0 0 1px #22191614,0 24px 60px -28px #22191673;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}:root[data-theme=dark] .guide-box{background:#2c2520f0;color:#f6f1ec;box-shadow:0 0 0 1px #ffeee21f,0 30px 70px -30px #000c}.guide.in .guide-box{opacity:1;transform:translate(-50%)}.guide.box-top .guide-box{bottom:auto;top:calc(14px + env(safe-area-inset-top,0px));transition:opacity .4s ease,transform .5s var(--ease),top .45s var(--ease)}.guide-name{position:absolute;left:20px;top:-13px;height:26px;padding:0 14px;border-radius:999px;background:#dd723f;color:#fff8ef;font-size:12.5px;font-weight:600;letter-spacing:.04em;display:inline-flex;align-items:center;box-shadow:0 6px 16px -8px #dd723fb3}.guide-text{margin:0;min-height:3.3em;font-size:16px;line-height:1.65;letter-spacing:.01em;text-wrap:pretty}.guide-caret{display:inline-block;width:0;height:0;margin-left:6px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #DD723F;vertical-align:middle;animation:g-caret .9s ease-in-out infinite}@keyframes g-caret{50%{transform:translateY(3px);opacity:.5}}.guide-foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px}.guide-dots{display:flex;gap:5px}.guide-dots i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.18;transition:opacity .3s,transform .3s}.guide-dots i.on{opacity:.75;transform:scale(1.3)}.guide-skip{border:0;background:none;color:inherit;opacity:.55;font-size:12.5px;padding:6px 8px;border-radius:8px}.guide-skip:hover{opacity:1;background:#7f7f7f1f}@container app (max-width: 640px){.guide-box{padding:20px 18px 12px}.guide-text{font-size:15px}}@media(prefers-reduced-motion:reduce){.guide-char[data-pose],.guide-char.talking img,.guide-spot:after,.guide-caret{animation:none!important}}.ex-nogl{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:24px;text-align:center;font-size:13px;color:var(--ink-2)}@media(hover:none)and (pointer:coarse){kbd{display:none}}:root[data-native=mac]{--native-bar: 52px}:root[data-native=mac] .nav{display:none}:root[data-native=mac] .page .stage{top:var(--native-bar)}:root[data-native=mac] .legend{top:calc(var(--native-bar) + (100% - var(--pb, 0px) - var(--native-bar)) / 2)}:root[data-native=mac] .grid-head{padding-top:calc(14px + var(--native-bar))}:root[data-native=mac] .editor{padding-top:var(--native-bar)}:root[data-native=mac] .ex-stage{padding-top:calc(12px + var(--native-bar))}:root[data-native=mac] .ex-scroll{padding-top:calc(22px + var(--native-bar))}:root[data-native=mac] .set-head{padding-top:calc(16px + var(--native-bar))}:root[data-native=mac] .ritual-skip{top:calc(3.5vmin + 4px + var(--native-bar))}:root[data-native=mac] .guide.box-top .guide-box{top:calc(14px + var(--native-bar))}