@import "https://fonts.googleapis.com/css2?family=DungGeunMo&family=Press+Start+2P&family=Fredoka:wght@400;500;600;700&display=swap";:root{--bg-primary:#180d05;--bg-secondary:#3b1d07;--wood-dark:#381a04;--wood-medium:#703a11;--wood-light:#bf773d;--wood-panel:#d58c4f;--wood-inner:#fbf2cc;--wood-inner-hover:#fcf6dc;--gold-border:#f1ab29;--gold-highlight:#ffda68;--primary-emerald:#4d8c2b;--primary-green:#67b833;--primary-dark:#3c731f;--accent-gold:#f1ab29;--accent-pink:#f78fb3;--accent-orange:#cf6a17;--accent-blue:#2980b9;--accent-red:#c0392b;--text-primary:#381a04;--text-secondary:#5c3514;--text-muted:#8b5d37;--text-light:#fbf2cc;--font-main:"Fredoka", "DungGeunMo", sans-serif;--font-pixel:"DungGeunMo", "Fredoka", sans-serif;--font-label:"Press Start 2P", monospace;--transition-retro:all .1s steps(3)}*{box-sizing:border-box;font-family:var(--font-main);-webkit-font-smoothing:antialiased;margin:0;padding:0}body{background:radial-gradient(circle at center, var(--bg-secondary) 0%, var(--bg-primary) 100%);color:var(--text-primary);width:100vw;height:100vh;overflow:hidden}.glass-panel{background:var(--wood-panel);border:4px solid var(--wood-dark);box-shadow:0 8px 0 #0006, inset -4px -4px 0 var(--wood-medium), inset 4px 4px 0 #ffffff40;transition:var(--transition-retro);border-radius:6px;position:relative}.glass-panel:after{content:"";border:2px solid var(--gold-border);pointer-events:none;border-radius:4px;position:absolute;inset:4px}.glass-panel:hover{background:#db9357}.glass-card{background:var(--wood-inner);border:3px solid var(--wood-dark);transition:var(--transition-retro);color:var(--text-primary);border-radius:6px;padding:12px;box-shadow:inset 2px 2px #00000014}.glass-card:hover{background:var(--wood-inner-hover);box-shadow:0 4px 0 var(--wood-dark), inset 2px 2px 0 #0000000a;transform:translateY(-2px)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--wood-dark);border-radius:2px}::-webkit-scrollbar-thumb{background:var(--wood-light);border:2px solid var(--wood-dark);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--gold-border)}.app-container{flex-direction:column;width:100vw;height:100vh;display:flex;position:relative}.ui-overlay{pointer-events:none;z-index:10;grid-template-rows:auto 1fr auto;grid-template-columns:370px 1fr 370px;gap:20px;width:100%;height:100%;padding:24px;display:grid;position:absolute;top:0;left:0}.ui-element{pointer-events:auto}.header-panel{grid-column:1/-1;justify-content:space-between;align-items:center;margin-bottom:4px;padding:16px 28px;display:flex}.header-title-group h1{font-family:var(--font-pixel);letter-spacing:1px;color:#fff;text-shadow:-2px -2px 0 var(--wood-dark), 2px -2px 0 var(--wood-dark), -2px 2px 0 var(--wood-dark), 2px 2px 0 var(--wood-dark), 0px 4px 0 var(--wood-dark);font-size:1.7rem;font-weight:700}.header-title-group p{font-family:var(--font-pixel);color:var(--wood-inner);text-shadow:1px 1px 0 var(--wood-dark);margin-top:2px;font-size:.85rem}.left-sidebar{flex-direction:column;grid-area:2/1/-1;gap:16px;max-height:80vh;display:flex;overflow-y:auto}.right-sidebar{flex-direction:column;grid-area:2/3/-1;gap:16px;max-height:80vh;display:flex;overflow-y:auto}.bottom-control-panel{grid-area:3/2;justify-self:center;align-items:center;gap:12px;padding:12px 24px;display:flex}.canvas-viewport{z-index:1;width:100vw;height:100vh;position:absolute;top:0;left:0}.btn-primary{background:var(--primary-green);color:#fff;border:3px solid var(--wood-dark);font-family:var(--font-pixel);cursor:pointer;box-shadow:0 4px 0 var(--wood-dark);text-shadow:1px 1px #00000080;transition:var(--transition-retro);border-radius:6px;align-items:center;gap:8px;padding:10px 16px;font-weight:700;display:flex}.btn-primary:hover{box-shadow:0 2px 0 var(--wood-dark);background:#74cc3a;transform:translateY(2px)}.btn-primary:active{box-shadow:0 0 0 var(--wood-dark);transform:translateY(4px)}.btn-secondary{background:var(--wood-inner);color:var(--text-primary);border:3px solid var(--wood-dark);font-family:var(--font-pixel);cursor:pointer;box-shadow:0 4px 0 var(--wood-dark);transition:var(--transition-retro);border-radius:6px;align-items:center;gap:8px;padding:10px 16px;font-weight:700;display:flex}.btn-secondary:hover{box-shadow:0 2px 0 var(--wood-dark);background:#fff;transform:translateY(2px)}.btn-secondary:active{box-shadow:0 0 0 var(--wood-dark);transform:translateY(4px)}.input-field{background:var(--wood-inner);border:3px solid var(--wood-dark);color:var(--text-primary);font-family:var(--font-pixel);transition:var(--transition-retro);border-radius:6px;outline:none;padding:10px 14px;font-size:.95rem;box-shadow:inset 1px 1px #0000001a}.input-field:focus{border-color:var(--gold-border);background:#fff}select.input-field{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg fill='%23381a04' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");background-position:right 8px center;background-repeat:no-repeat;padding-right:32px}h2,h3,h4{font-family:var(--font-pixel);color:var(--text-primary)}.pixel-progress-container{background:var(--wood-dark);border:2px solid var(--wood-dark);border-radius:4px;width:100%;height:16px;position:relative;overflow:hidden}.pixel-progress-fill{background:repeating-linear-gradient(-45deg, var(--primary-green), var(--primary-green) 4px, var(--primary-dark) 4px, var(--primary-dark) 8px);border-radius:2px;height:100%;transition:width .3s steps(5,end)}.pixel-progress-fill-pink{background:repeating-linear-gradient(-45deg, var(--accent-pink), var(--accent-pink) 4px, #e8638f 4px, #e8638f 8px)}.modal-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal-content{width:500px;max-width:90vw;max-height:85vh;padding:28px;overflow-y:auto}.glow-gold{color:var(--accent-gold);text-shadow:1px 1px 0 var(--wood-dark)}@media (width<=992px){.ui-overlay{pointer-events:auto;grid-template-rows:auto auto auto auto;grid-template-columns:1fr;overflow-y:auto}.left-sidebar,.right-sidebar{grid-column:1;max-height:none}.bottom-control-panel{grid-area:auto/1;justify-content:center;width:100%}body{overflow-y:auto}.canvas-viewport{position:fixed}}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:.9s linear infinite spin}
