:root{color-scheme:light;font-family:Avenir Next,Segoe UI,sans-serif;background:radial-gradient(circle at top left,rgba(237,233,225,.96),transparent 34%),radial-gradient(circle at 85% 18%,rgba(220,223,228,.78),transparent 26%),radial-gradient(circle at 50% 120%,rgba(206,214,226,.24),transparent 40%),linear-gradient(180deg,#faf8f5,#efede8);color:#111}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{min-height:100vh;background:radial-gradient(circle at 12% 10%,rgba(255,255,255,.82) 0%,transparent 22%),radial-gradient(circle at 90% 12%,rgba(212,220,230,.28) 0%,transparent 18%)}button,input,select{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:40px 28px 28px;display:grid;gap:24px;grid-template-columns:minmax(0,1.25fr) minmax(300px,360px);grid-template-rows:auto minmax(0,1fr)}.hero-copy{max-width:760px}.eyebrow{margin:0 0 12px;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:#11111194}.hero-copy h1,.panel-header h2{margin:0;font-family:Georgia,Times New Roman,serif;font-weight:600;letter-spacing:-.03em}.hero-copy h1{font-size:clamp(2.8rem,5vw,5rem);line-height:.95}.lede{margin:18px 0 0;max-width:58ch;line-height:1.7;color:#111111b8}.stage-intro{padding:0 6px 16px}.stage-copy{margin:0;max-width:62ch;font-size:.94rem;line-height:1.65;color:#1111118f}.stage-card,.control-panel{border:1px solid rgba(17,17,17,.08);background:#ffffffb3;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 52px #18181814}.stage-card{grid-column:1 / 2;display:flex;flex-direction:column;padding:20px;border-radius:28px;min-height:640px}.stage-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:6px 6px 18px}.stage-label,.stage-value,.stage-hint{margin:0}.stage-label{color:#1111118c;font-size:.86rem}.stage-value{font-size:1.05rem}.stage-hint{margin-top:6px;color:#1111118c;font-size:.88rem}.ghost-button{border:none;border-radius:999px;padding:12px 18px;background:#121212;color:#faf8f5;opacity:.42;transition:transform .18s ease,opacity .18s ease,box-shadow .18s ease}.ghost-button.is-ready{opacity:1}.ghost-button.is-ready:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 14px 30px #1212122e}.ghost-button:disabled{cursor:not-allowed;opacity:.42}.stage-canvas{position:relative;width:100%;flex:1;border-radius:24px;overflow:hidden;background:radial-gradient(circle at 50% 28%,#fffffffa,#f3f1ecdb),radial-gradient(circle at 20% 80%,rgba(219,228,235,.26),transparent 26%),linear-gradient(180deg,#fffffff0,#eceae6fa);box-shadow:inset 0 1px #ffffffbf,inset 0 -20px 60px #b1bac429}.stage-canvas canvas{position:relative;z-index:2;width:100%;height:100%;display:block}.rive-preview-shell{display:flex;flex-direction:column;gap:14px;padding:18px}.rive-preview-meta{display:grid;gap:4px;padding:2px 4px 0}.rive-preview-canvas{flex:1;min-height:520px;border-radius:22px;overflow:hidden;background:radial-gradient(circle at 50% 18%,#fffffffa,#f3f1ece0),linear-gradient(180deg,#fffffffa,#efece7f0);box-shadow:inset 0 1px #ffffffd9,inset 0 -16px 42px #b1bac41f}.spirit-stage{position:relative}.spirit-stage.is-drawing{cursor:none}.spirit-path-probe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;opacity:0;z-index:0}.spirit-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none}.spirit-region-outline{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.spirit-region-path{stroke:#11111124;filter:none}.spirit-debug-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:3}.spirit-draw-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:4}.spirit-instance{position:absolute;transform-origin:50% 50%;will-change:transform,width,height}.spirit-canvas{width:100%;height:100%;display:block;background:transparent!important}.spirit-canvas--pending{border-radius:999px;background:radial-gradient(circle at 50% 42%,rgba(17,17,17,.92) 0%,rgba(17,17,17,.92) 58%,transparent 59%),radial-gradient(circle at 38% 42%,#ffffff 0%,#ffffff 11%,transparent 12%),radial-gradient(circle at 62% 42%,#ffffff 0%,#ffffff 11%,transparent 12%),radial-gradient(circle at 38% 42%,rgba(17,17,17,.95) 0%,rgba(17,17,17,.95) 4%,transparent 5%),radial-gradient(circle at 62% 42%,rgba(17,17,17,.95) 0%,rgba(17,17,17,.95) 4%,transparent 5%)}.spirit-canvas canvas{background:transparent!important}.glyph-keyboard{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.glyph-key{border:1px solid rgba(17,17,17,.1);border-radius:12px;padding:10px 0;background:#ffffffdb;color:#111111c2;transition:transform .14s ease,background-color .14s ease,color .14s ease,border-color .14s ease,box-shadow .14s ease}.glyph-key:hover{transform:translateY(-1px);border-color:#1111112e;background:#fffffffa}.glyph-key.is-active{border-color:#111111c2;background:#111;color:#faf8f5;box-shadow:0 10px 18px #11111124}.ghost-glyph-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none;z-index:1}.ghost-glyph{font-size:clamp(18rem,42vw,34rem);line-height:.9;font-weight:700;color:#11111114;filter:blur(.6px);transform:translateY(2%);-webkit-user-select:none;user-select:none}.ghost-glyph-svg{width:100%;height:100%;overflow:visible}.ghost-glyph-path{fill:#11111114;filter:blur(.6px)}.spirit-region-text-layer{z-index:1}.spirit-region-text{color:#1111110f;filter:none}.panel-wrap{grid-column:2 / 3;grid-row:1 / 3;position:sticky;top:28px;max-height:calc(100vh - 56px);overflow:auto;padding-right:4px}.control-panel{border-radius:24px;padding:22px 18px 18px;display:grid;gap:18px;position:static}.panel-header{padding-bottom:8px;border-bottom:1px solid rgba(17,17,17,.08)}.field{display:grid;gap:10px}.field span{font-size:.92rem;color:#111111c2}.text-input,.select-input{width:100%;border:1px solid rgba(17,17,17,.12);border-radius:16px;padding:14px 16px;background:#fffc}.text-input:focus,.select-input:focus,.range-input:focus,.preset-chip:focus{outline:2px solid rgba(24,24,24,.2);outline-offset:2px}.range-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px}.range-input{width:100%}output{font-variant-numeric:tabular-nums;color:#1119}.preset-row{display:flex;flex-wrap:wrap;gap:10px;padding-top:4px}.preset-chip{border:1px solid rgba(17,17,17,.1);background:#ffffffdb;border-radius:999px;padding:10px 14px;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}.preset-chip:hover{transform:translateY(-1px);border-color:#1113;background:#fffffffa}.panel-footnote{margin:14px 4px 0;font-size:.88rem;line-height:1.6;color:#1111118a}.dev-layout-panel{margin-top:18px;border:1px solid rgba(17,17,17,.08);border-radius:20px;background:#ffffff9e;padding:14px 14px 16px}.dev-layout-panel summary{cursor:pointer;font-weight:600;color:#111111d1}.dev-layout-copy{margin:12px 0 0;font-size:.84rem;line-height:1.5;color:#1111118f}.dev-layout-floating{position:fixed;width:min(360px,calc(100vw - 40px));max-height:calc(100vh - 44px);overflow:auto;display:grid;gap:12px;padding:14px;border:1px solid rgba(17,17,17,.08);border-radius:22px;background:#fffc;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 44px #1010101f;z-index:12}.dev-layout-floating-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 2px 4px;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;font-size:.84rem;color:#111111c7}.dev-layout-floating-header:active{cursor:grabbing}.dev-layout-drag-hint{color:#1111117a;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}.dev-layout-grid{display:grid;gap:12px;margin-top:14px}.dev-layout-preview-row{display:grid;grid-template-columns:1fr;gap:12px;margin-top:14px}.dev-pose-card{border:1px solid rgba(17,17,17,.08);border-radius:16px;background:#ffffff85;padding:10px}.dev-pose-card p{margin:0 0 8px;font-size:.84rem;color:#111111c7}.dev-pose-stage{position:relative;height:430px;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 50% 24%,#fffffffa,#f4f2eee0),linear-gradient(180deg,#fffffff5,#efece7f0)}.dev-blob{position:absolute;display:block;pointer-events:none}.dev-layout-group{border:1px solid rgba(17,17,17,.08);border-radius:16px;padding:10px 12px;background:#ffffff85}.dev-layout-group p{margin:0 0 8px;font-size:.88rem;color:#111111c7}.dev-layout-slider{gap:8px}.dev-layout-actions{margin-top:14px}.dev-layout-json{min-height:240px;border:1px solid rgba(17,17,17,.12);border-radius:14px;padding:12px;resize:vertical;background:#ffffffd1;font:.8rem/1.5 SFMono-Regular,Menlo,Monaco,monospace;color:#111111c7}@media(max-width:1100px){.app-shell{grid-template-columns:1fr;grid-template-rows:auto auto auto}.stage-card,.panel-wrap{grid-column:auto;grid-row:auto}.control-panel{position:static}.dev-layout-floating{position:static;width:100%;max-height:none;margin-bottom:16px}}@media(max-width:680px){.app-shell{padding:22px 16px 18px}.stage-card{min-height:480px;padding:14px}.stage-meta{align-items:flex-start;flex-direction:column}.ghost-button{width:100%}}.ui-page-shell{position:relative;width:100%;height:100%;min-height:100vh;background:#fff;overflow:hidden}.ui-stage-shell{--stage-size: min(56vh, 92vw, 920px);position:absolute;left:50%;top:39.5%;transform:translate(-50%,-50%);width:var(--stage-size);height:var(--stage-size);z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}.ui-stage-shell>*{width:100%;height:100%;pointer-events:auto}.ui-overlay-shell{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.ui-overlay-shell.is-disabled{pointer-events:none}.ui-overlay-rive{width:100%;height:100%;display:block}.ui-overlay-rive canvas{width:100%!important;height:100%!important;display:block}.ui-stage-shell .stage-canvas{width:100%;height:100%;min-height:100%;border-radius:0;background:transparent;box-shadow:none}.ui-stage-shell .stage-canvas.is-drawing:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px dashed rgba(128,128,128,.9);pointer-events:none;z-index:4}.ui-stage-shell .stage-canvas canvas{background:transparent}@media(max-width:1100px){.ui-stage-shell{top:38.5%;--stage-size: min(52vh, 94vw, 780px)}}@media(max-width:780px){.ui-stage-shell{top:36.5%;--stage-size: min(48vh, 98vw, 680px)}.ui-stage-shell>*{width:100%}.ui-overlay-shell{top:0;right:0;bottom:0;left:0}}