*{box-sizing:border-box;margin:0;padding:0}@font-face{font-family:Velvelyne;src:url(/assets/Velvelyne-Regular-DDjsfwww.otf)format("opentype");font-weight:400}@font-face{font-family:Velvelyne;src:url(/assets/Velvelyne-Book-r4zXS0cv.otf)format("opentype");font-weight:300}@font-face{font-family:Velvelyne;src:url(/assets/Velvelyne-Bold-BoDzioDS.otf)format("opentype");font-weight:700}body{color:#1a1a1a;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;background:#d8d8d8;width:100vw;height:100vh;font-family:Syne Mono,monospace;overflow:hidden}#app{justify-content:center;align-items:center;height:100dvh;padding:14px;display:flex;position:relative}.starfish-bg{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.starfish-bg:before{content:"";opacity:.12;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-size:200px 200px;position:absolute;inset:0}.starfish-grid{grid-template-columns:repeat(100,1fr);gap:0;width:200%;height:200%;animation:120s linear infinite starfish-drift;display:grid}@keyframes starfish-drift{0%{transform:translate(0)}to{transform:translate(-50%,-50%)}}.starfish-char{color:#ccc;justify-content:center;align-items:center;padding:2px 0;font-size:26px;line-height:1;display:flex}.dark-stars .starfish-char{color:#252525}.dark-stars:before{display:none}.editor-frame{z-index:1;background:#fff;border:1px solid #000;border-radius:5px;flex-direction:column;width:100%;max-width:min(100% - 140px,1200px);height:100%;max-height:calc(100% - 140px);display:flex;position:relative;overflow:hidden}.editor-frame:after{content:"";opacity:.08;mix-blend-mode:multiply;pointer-events:none;z-index:100;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-size:200px 200px;position:absolute;inset:0}.menu-bar{background:#ddd;border-bottom:1px solid #000;flex-shrink:0;align-items:center;height:38px;padding:0 4px;display:flex;position:relative}.menu-title{color:#000;padding:0 12px 0 8px;font-size:14px;font-weight:700}.menu-item{color:#000;cursor:default;-webkit-user-select:none;user-select:none;align-items:center;height:100%;padding:0 10px;font-size:13px;display:flex}.menu-item:hover{color:#000}.menu-spacer{flex:1}.font-toggle{color:#000;cursor:pointer;background:0 0;border:none;height:100%;padding:0 10px;font-family:inherit;font-size:13px}.font-toggle:hover{color:#000}.menu-byline{color:#000;padding:0 8px;font-size:11px}.menu-byline a{color:#000;text-decoration:none}.menu-byline a:hover{color:#000;text-decoration:underline}.menu-dropdown{z-index:30;background:#fff;border:1px solid #000;min-width:160px;padding:2px 0;position:absolute;top:34px}.menu-dropdown-item{color:#333;cursor:default;white-space:nowrap;justify-content:space-between;gap:20px;padding:4px 14px;font-size:13px;display:flex}.menu-shortcut{color:#999;font-size:11px}.menu-dropdown-item:hover{color:#fff;background:#000}.menu-sep{background:#000;height:1px;margin:2px 6px}.workspace{background:#fff;flex:1;min-height:0;display:flex}.panel-section{padding:8px 14px}.panel-header{color:#000;letter-spacing:.05em;margin-bottom:6px;font-size:11px}.header-val{color:#000}.left-panel{background:#fff;border-right:1px solid #000;flex-direction:column;flex-shrink:0;width:150px;display:flex;overflow-y:auto}.tool-grid{grid-template-columns:1fr 1fr;gap:6px;display:grid}.tool-btn{aspect-ratio:1;cursor:pointer;color:#000;background:#fff;border:1px dashed #000;justify-content:center;align-items:center;padding:6px;transition:all 80ms;display:flex}.tool-btn:hover{background:#fafafa}.tool-btn.active{border:1px solid #000}.tool-btn svg{width:16px;height:16px}.color-grid{grid-template-columns:repeat(3,1fr);gap:5px;display:grid}.color-swatch{aspect-ratio:1;cursor:pointer;border:1px dashed #000;transition:all 80ms;position:relative}.color-swatch:after{content:"";opacity:.18;mix-blend-mode:multiply;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-size:cover;position:absolute;inset:0}.color-swatch:hover{background:#fafafa}.color-swatch.active{border:1px solid #000}.slider-box{background:#fff;border:1px dashed #000;align-items:center;gap:8px;padding:8px 10px;display:flex;overflow:hidden}.slider-val{color:#999;text-align:right;flex-shrink:0;min-width:14px;font-size:12px}.slider{appearance:none;cursor:pointer;background:#ddd;outline:none;flex:1;min-width:0;height:4px}.slider::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#000;border:none;width:10px;height:10px}.slider::-moz-range-thumb{cursor:pointer;background:#000;border:none;border-radius:0;width:10px;height:10px}.canvas-area{flex:1;justify-content:stretch;align-items:stretch;min-width:0;display:flex}.canvas-container{background:#919191;width:100%;height:100%;padding:12px;position:relative;overflow:auto}.canvas-inner{background:#fff;width:100%;height:100%;position:relative}.ruler{position:absolute}.ruler-top{height:12px;top:0;left:0;right:0}.ruler-left{width:12px;top:0;bottom:0;left:0}.ruler-top .ruler-tick{background:#aaa;width:1px;height:4px;position:absolute;top:0}.ruler-top .ruler-tick.major{background:#666;height:10px}.ruler-left .ruler-tick{background:#aaa;width:5px;height:1px;position:absolute;left:0}.ruler-left .ruler-tick.major{background:#666;width:10px}.canvas-inner canvas{width:100%;height:100%;position:absolute;top:0;left:0}#drawing-canvas{z-index:2;cursor:crosshair}#physics-canvas{z-index:1}.right-panel{background:#fff;border-left:1px solid #000;flex-direction:column;flex-shrink:0;width:190px;display:flex;overflow-y:auto}.stamp-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.stamp-btn{aspect-ratio:1;cursor:pointer;background:#fff;border:1px dashed #000;justify-content:center;align-items:center;padding:4px;transition:all 80ms;display:flex}.stamp-btn:hover{background:#fafafa}.stamp-btn.active{border:1px solid #000}.stamp-btn canvas{object-fit:contain;width:100%;height:100%}.stamp-btn svg{width:100%;height:100%}.bottom-bar{background:#ddd;border-top:1px solid #000;flex-shrink:0}.action-strip{align-items:stretch;height:34px;display:flex}.action-btn{cursor:pointer;color:#000;white-space:nowrap;background:0 0;border:none;border-right:1px solid #000;align-items:center;padding:0 12px;font-family:inherit;font-size:13px;transition:color 80ms;display:flex}.action-btn:hover,.action-btn.action-active{color:#000}.action-spacer{flex:1}.scene-tabs{display:flex}.scene-tab{cursor:pointer;color:#000;white-space:nowrap;background:0 0;border:none;border-right:1px solid #000;align-items:center;padding:0 10px;font-family:inherit;font-size:13px;display:flex;position:relative}.scene-tab:hover{color:#666}.scene-tab.active{color:#000}.scene-tab .delete-scene{color:#999;cursor:pointer;background:0 0;border:none;font-size:11px;display:none;position:absolute;top:4px;right:2px}.scene-tab:hover .delete-scene{display:block}.play-overlay{z-index:100;background:#000000f2;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.play-canvas-wrap{background:#fff;border:1px solid #000}.play-controls{gap:1px;margin-top:20px;display:flex}.play-control-btn{cursor:pointer;color:#888;background:0 0;border:1px solid #fff;padding:8px 24px;font-family:inherit;font-size:12px}.play-control-btn:hover{color:#fff;border-color:#fff}.play-scene-label{color:#555;letter-spacing:3px;margin-bottom:10px;font-size:10px}.play-narrative{color:#888;text-align:center;max-width:560px;margin-bottom:14px;font-size:14px;font-style:italic;line-height:1.6}.gallery-page{flex-direction:column;flex:1;display:flex;overflow:hidden}.gallery-page-header{border-bottom:1px solid #000;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.gallery-page-title{color:#000;font-size:14px}.gallery-back-btn{cursor:pointer;color:#000;background:0 0;border:1px dashed #000;padding:4px 12px;font-family:inherit;font-size:12px}.gallery-back-btn:hover{border-style:solid}.gallery-submit-row{border-bottom:1px solid #000;align-items:center;gap:8px;padding:12px 20px;display:flex}.gallery-input{background:#fff;border:1px dashed #000;outline:none;flex:1;padding:6px 10px;font-family:inherit;font-size:13px}.gallery-input:focus{border-style:solid}.gallery-submit-btn{cursor:pointer;color:#000;white-space:nowrap;background:#fff;border:1px solid #000;padding:6px 14px;font-family:inherit;font-size:13px}.gallery-submit-btn:hover{color:#fff;background:#000}.gallery-grid-full{flex:1;grid-template-columns:repeat(4,1fr);align-content:start;gap:12px;padding:16px 20px;display:grid;overflow-y:auto}.gallery-card{border:1px dashed #000;position:relative}.gallery-card:after{content:"";opacity:.1;mix-blend-mode:multiply;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-size:200px 200px;position:absolute;inset:0}.gallery-card img{aspect-ratio:4/3;object-fit:cover;border-bottom:1px dashed #000;width:100%;display:block}.gallery-card-info{flex-direction:column;gap:3px;padding:8px;display:flex}.gallery-card-name{color:#000;word-wrap:break-word;font-size:12px}.gallery-card-msg{color:#999;word-wrap:break-word;font-size:10px}.submit-popup{z-index:50;background:#fff;border:1px solid #000;width:300px;position:absolute;bottom:40px;right:12px}.submit-popup-header{border-bottom:1px solid #000;justify-content:space-between;align-items:center;padding:8px 12px;font-size:12px;display:flex}.submit-popup-close{cursor:pointer;color:#999;background:0 0;border:none;font-family:inherit;font-size:16px}.submit-popup-close:hover{color:#000}.submit-popup-body{flex-direction:column;gap:8px;padding:10px 12px;display:flex}.hidden{display:none!important}.play-nav-btn{cursor:pointer;color:#000;background:#ffffffe6;border:1px solid #ccc;justify-content:center;align-items:center;width:28px;height:28px;font-family:inherit;font-size:13px;display:flex}.play-nav-btn:hover{color:#fff;background:#000;border-color:#000}.editor-frame.fullbleed{border:1px solid #000;border-radius:0;max-width:100%;max-height:100%}.editor-frame.dark{background:#222;border-color:#444}.editor-frame.dark .menu-bar{background:#2a2a2a;border-color:#444}.editor-frame.dark .menu-title,.editor-frame.dark .menu-item,.editor-frame.dark .font-toggle{color:#ccc}.editor-frame.dark .menu-byline,.editor-frame.dark .menu-byline a{color:#888}.editor-frame.dark .menu-dropdown{background:#2a2a2a;border-color:#444}.editor-frame.dark .menu-dropdown-item{color:#ccc}.editor-frame.dark .menu-dropdown-item:hover{color:#fff;background:#444}.editor-frame.dark .menu-sep{background:#444}.editor-frame.dark .menu-shortcut{color:#666}.editor-frame.dark .menu-item:hover,.editor-frame.dark .font-toggle:hover{color:#fff}.editor-frame.dark .left-panel,.editor-frame.dark .right-panel{background:#222;border-color:#444}.editor-frame.dark .panel-header{color:#888}.editor-frame.dark .panel-section{border-color:#333}.editor-frame.dark .tool-btn{color:#ccc;background:#2a2a2a;border-color:#555}.editor-frame.dark .tool-btn.active{color:#fff;border-style:solid;border-color:#fff}.editor-frame.dark .color-swatch{border-color:#555}.editor-frame.dark .color-swatch.active{border-color:#fff}.editor-frame.dark .slider{background:#444}.editor-frame.dark .slider-box{background:#2a2a2a;border-color:#555}.editor-frame.dark .slider-val{color:#888}.editor-frame.dark .stamp-btn{background:#2a2a2a;border-color:#555}.editor-frame.dark .stamp-btn.active{border-color:#fff}.editor-frame.dark .canvas-container{background:#333}.editor-frame.dark .bottom-bar{background:#222;border-color:#444}.editor-frame.dark .action-btn{color:#888;border-color:#333}.editor-frame.dark .action-btn:hover,.editor-frame.dark .action-btn.action-active{color:#fff}.editor-frame.dark .scene-tab{color:#666;border-color:#333}.editor-frame.dark .scene-tab:hover{color:#ccc}.editor-frame.dark .scene-tab.active{color:#fff}.editor-frame.dark .gallery-page{background:#222}.editor-frame.dark .gallery-page-header{border-color:#444}.editor-frame.dark .gallery-page-title{color:#ccc}.editor-frame.dark .gallery-back-btn{color:#ccc;border-color:#555}.editor-frame.dark .gallery-grid-full{background:#222}.editor-frame.dark .gallery-card{background:#2a2a2a;border-color:#555}.editor-frame.dark .gallery-card-name{color:#ccc}.editor-frame.dark .gallery-card-msg{color:#666}.editor-frame.dark .submit-popup{background:#222;border-color:#444}.editor-frame.dark .submit-popup-header{color:#ccc;border-color:#444}.editor-frame.dark .gallery-input,.editor-frame.dark .gallery-submit-btn{color:#ccc;background:#2a2a2a;border-color:#555}.editor-frame.dark .gallery-submit-btn:hover{color:#000;background:#fff}@media (width<=768px){#app{padding:0}.starfish-bg{display:none}.editor-frame{border:none;border-radius:0;max-width:100%;max-height:100%}.editor-frame.fullbleed{border:none}.menu-bar{gap:0;height:36px;padding:0 4px;overflow-x:auto}.menu-title{padding:0 8px 0 4px;font-size:13px}.menu-item{padding:0 8px;font-size:12px}.menu-byline{display:none}.font-toggle{padding:0 6px;font-size:14px}.workspace{flex-direction:column}.left-panel{border-bottom:1px solid #000;border-right:none;flex-direction:row;flex-shrink:0;width:100%;height:auto;max-height:none;overflow:auto hidden}.left-panel .panel-section{border-bottom:none;border-right:1px solid #eee;flex-shrink:0;padding:6px 8px}.left-panel .panel-header{display:none}.tool-grid{gap:4px;display:flex}.tool-btn{aspect-ratio:auto;flex-shrink:0;width:36px;height:36px;padding:6px}.tool-btn svg{width:18px;height:18px}.color-grid{grid-template-rows:1fr 1fr;grid-auto-flow:column;gap:3px;display:grid}.color-swatch{aspect-ratio:auto;flex-shrink:0;width:20px;height:20px}.slider-box{min-width:100px;padding:6px 8px}.canvas-area{flex:1;min-height:0}.canvas-container{padding:4px}.right-panel{border-top:1px solid #000;border-left:none;flex-direction:row;flex-shrink:0;width:100%;height:auto;max-height:none;overflow:auto hidden}.right-panel .panel-section{flex-shrink:0;width:auto;padding:6px 8px}.right-panel .panel-header{display:none}.stamp-grid{gap:4px;display:flex}.stamp-btn{aspect-ratio:auto;flex-shrink:0;width:44px;height:44px}.action-strip{flex-wrap:nowrap;height:32px;overflow-x:auto}.action-btn{padding:6px 8px;font-size:11px}.scene-tabs{flex-wrap:nowrap;flex-shrink:0}.scene-tab{flex-shrink:0;padding:6px 8px;font-size:11px}.action-spacer{flex:0;width:0}.gallery-grid-full{grid-template-columns:1fr 1fr;gap:8px;padding:8px}.gallery-submit-row{flex-direction:column;padding:8px 12px}.submit-popup{width:auto;bottom:36px;left:8px;right:8px}.ruler{display:none}.editor-frame.fullbleed .menu-bar{height:36px}.editor-frame.fullbleed .action-strip{height:auto}}@media (width<=480px){.menu-item[data-menu=view],.menu-item[data-menu=help]{display:none}.action-btn{padding:5px 6px;font-size:10px}.color-swatch{width:20px;height:20px}.stamp-btn{width:38px;height:38px}.tool-btn{width:32px;height:32px}}@font-face{font-family:Syne Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/syne-mono-latin-ext-400-normal-CcK8JL-r.woff2)format("woff2"),url(/assets/syne-mono-latin-ext-400-normal-VVWgLRdL.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Syne Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/syne-mono-latin-400-normal-KJbW1Qny.woff2)format("woff2"),url(/assets/syne-mono-latin-400-normal-DLtpCS0I.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
