html{height:100%}body{margin:0;padding:0;overflow:hidden;font-family:Arial,sans-serif;background:#1a1a1a;position:relative;height:100%}.no-select{user-select:none;-webkit-user-select:none}#canvas-container{width:100vw;height:100vh;height:100dvh}#toolbar{position:fixed;top:max(8px,env(safe-area-inset-top,0px));right:max(8px,env(safe-area-inset-right,0px));z-index:1000;pointer-events:auto;display:flex;gap:8px;opacity:0;transition:opacity .15s ease-out}#toolbar.ready{opacity:1}#toolbar-toggle{display:none;width:50px;height:50px;padding:0;align-items:center;justify-content:center}#toolbar.collapsed>button:not(#toolbar-toggle){display:none}@media (max-width: 768px),(max-height: 500px){#toolbar-toggle{display:flex}}#toolbar.mobile-mode #toolbar-toggle{display:flex}button{padding:12px 24px;font-size:16px;background:#4caf50;color:#fff;border:none;border-radius:4px;cursor:pointer;box-shadow:0 2px 4px #0003}button:hover{background:#45a049}button:active{transform:scale(.98)}#clear-btn{padding:0 12px;font-size:21px;position:relative;height:50px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:8px}#clear-btn .btn-text{position:relative}#clear-btn .reset-icon-btn{width:50px;height:50px;padding:0;background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background-color .15s ease;flex-shrink:0}#clear-btn .reset-icon-btn:hover{background:#ffffff1a}#clear-btn .reset-icon-btn:active{background:#fff3;transform:scale(.95)}#help-btn,#perf-btn,#axis-btn,#palette-btn,#settings-btn{width:50px;height:50px;padding:0;font-size:21px;font-weight:700;display:flex;align-items:center;justify-content:center;box-sizing:border-box}#help-btn.active,#settings-btn.active{background:#3d8b40}#help-text{position:absolute;top:calc(66px + max(8px,env(safe-area-inset-top,0px)));right:max(8px,env(safe-area-inset-right,0px));z-index:999;background:#000000eb;color:#f0f0f0;padding:16px 20px;border-radius:10px;font-size:15px;line-height:1.6;max-width:380px;box-shadow:0 6px 20px #00000080;display:none}#help-text.visible{display:block}#help-text h3{margin:0 0 12px;font-size:18px;font-weight:600;color:#fff;border-bottom:1px solid #555;padding-bottom:10px}#help-text .section{margin-bottom:12px}#help-text .section:last-child{margin-bottom:0}#help-text .section-title{color:#66bb6a;font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}#help-text kbd{display:inline-block;background:linear-gradient(180deg,#555,#3a3a3a);padding:4px 10px;border-radius:5px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,monospace;font-size:13px;font-weight:500;color:#fff;border:1px solid #666;box-shadow:0 2px #222;margin:2px 0}#help-text .controls-list{display:flex;flex-direction:column;gap:8px}#help-text .control-row{display:flex;align-items:center;gap:10px}#help-text .control-row span{color:#ccc}@media (max-height: 500px){#help-text{max-height:calc(100vh - 80px);overflow-y:auto;padding:12px 16px;font-size:14px;max-width:340px}#help-text h3{font-size:16px;margin-bottom:8px;padding-bottom:8px}#help-text .section{margin-bottom:8px}#help-text .section-title{font-size:12px;margin-bottom:4px}#help-text kbd{padding:3px 8px;font-size:12px}#help-text .controls-list{gap:6px}#help-text .control-row{gap:8px}}.stats-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000b3;z-index:9998;display:none;align-items:center;justify-content:center}.stats-modal-overlay.visible{display:flex}.stats-dialog{background:#fff;padding:30px;border-radius:8px;box-shadow:0 4px 16px #0000004d;max-width:500px;width:90%;max-height:80vh;overflow-y:auto}.stats-dialog h2{margin:0 0 20px;color:#333;font-size:24px;text-align:center}.stats-list{margin-bottom:20px}.stats-item{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #eee}.stats-item:last-child{border-bottom:none}.stats-label{font-weight:700;color:#555}.stats-value{color:#4caf50;font-family:monospace}.stats-close-btn{width:100%;padding:12px;background:#4caf50;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer;margin-top:10px}.stats-close-btn:hover{background:#45a049}.stats-section-header{font-weight:700;color:#333;padding:12px 0 6px;border-bottom:2px solid #4CAF50;margin-top:10px;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.stats-section-header:first-child{margin-top:0}.stats-liquid-header{padding:8px 0 4px;color:#333}.stats-liquid-header strong{color:#2196f3}.stats-net{color:#888;font-size:12px}.stats-indent{padding-left:16px;padding-top:4px;padding-bottom:4px}.stats-indent .stats-label{font-weight:400;color:#666}.stats-sources{font-size:11px}.stats-sources .stats-value{color:#888;font-size:11px}#version-info{position:fixed;bottom:16px;right:36px;font-size:14px;font-family:monospace;color:#fffc;text-shadow:0 1px 3px rgba(0,0,0,.5);pointer-events:none;z-index:100}#sandbox-mode-indicator{position:fixed;bottom:44px;right:20px;font-size:15px;font-weight:700;font-family:monospace;color:#fff9;text-shadow:0 1px 3px rgba(0,0,0,.5);pointer-events:none;z-index:100;letter-spacing:.5px}.tutorial-active #version-info,.tutorial-active #sandbox-mode-indicator{display:none}.catch-basin-stats-panel{background:linear-gradient(135deg,#1e3a8af2,#142864f2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:12px;padding:14px 18px;min-width:200px;max-width:280px;color:#fff;font-family:system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.5;box-shadow:0 6px 20px #1e3a8a80,0 0 0 2px #ff8c0099,0 0 12px #ff8c004d;border:2px solid rgba(255,140,0,.7)}.catch-basin-stats-header{font-weight:700;font-size:15px;color:#ff8c00;margin-bottom:10px;padding-bottom:8px;border-bottom:2px solid rgba(255,140,0,.7);text-transform:uppercase;letter-spacing:1px;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 8px rgba(255,140,0,.3)}.catch-basin-stats-section{font-weight:600;font-size:12px;color:orange;margin-top:10px;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.4),0 0 4px rgba(255,165,0,.2)}.catch-basin-stats-row{display:flex;align-items:baseline;gap:6px;padding:3px 0;font-size:12px}.catch-basin-stats-indent{padding-left:8px}.catch-basin-stats-label{color:#fffffff2;flex-shrink:0;font-weight:500}.catch-basin-stats-value{color:#ff8c00;font-weight:600;margin-left:auto;font-family:SF Mono,Monaco,Menlo,monospace;font-size:12px;text-shadow:0 1px 3px rgba(0,0,0,.5),0 0 6px rgba(255,140,0,.3)}.catch-basin-stats-bullet{color:orange;margin-right:4px;flex-shrink:0;font-weight:700;font-size:14px;text-shadow:0 0 4px rgba(255,165,0,.4)}#rotate-overlay{display:none;position:fixed;inset:0;background:#888;z-index:10000;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:18.2vh;gap:40px;color:#e0e0e0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#rotate-overlay .message{font-size:22px;font-weight:800;text-align:center;max-width:320px;line-height:1.4;text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000,0 0 8px rgba(0,0,0,.5);letter-spacing:.5px;z-index:1}#rotate-overlay .floating-entities{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,1fr);padding:24px;gap:8px}#rotate-overlay .floating-entity{width:96px;height:96px;justify-self:center;align-self:center;animation:entity-bounce 4s ease-in-out infinite}@keyframes entity-bounce{0%,85%,to{transform:scale(1)}90%{transform:scale(1.15) translateY(-4px)}95%{transform:scale(.95)}}#rotate-overlay .rotate-version{position:absolute;bottom:8px;left:50%;transform:translate(-50%);font-size:16px;font-family:monospace;color:#323232cc;z-index:1}@media (orientation: portrait) and (pointer: coarse){#rotate-overlay{display:flex}}#rotate-overlay.unblocked{display:none!important}#rotate-overlay.tutorial-complete{background:linear-gradient(135deg,#8b7355,#c9a961,#8b7355)}.dg{right:env(safe-area-inset-right,0px)!important;left:auto!important;font-size:14px!important}.dg.main{margin-top:calc(66px + max(8px,env(safe-area-inset-top,0px)))!important}.dg .close-button{display:none!important}.dg .c{border-left:none!important}.dg .modified-from-default{position:relative}.dg .modified-from-default:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#ff0;z-index:10;box-shadow:0 0 2px #ff0c}.dg .folder-has-modified{position:relative}.dg .folder-has-modified:before{content:"";position:absolute;left:0;top:0;height:100%;width:3px;background-color:#ff0;z-index:10;box-shadow:0 0 2px #ff0c}@media (max-width: 768px),(max-height: 500px){body:not(.toolbar-expanded) .dg.main{display:none!important}.dg.main,.dg.main.a{position:fixed!important;top:0!important;right:0!important;left:auto!important;transform:none!important;margin-right:env(safe-area-inset-right,0px)!important;margin-top:calc(66px + max(8px,env(safe-area-inset-top,0px)))!important}}body.mobile-mode:not(.toolbar-expanded) .dg.main{display:none!important}
