:root{--bg-1: #120a05;--bg-2: #2b1a0c;--logo: #ffdf8f;--shadow: rgba(0, 0, 0, .45);--ui-shadow: rgba(0, 0, 0, .28)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;position:relative;background:radial-gradient(circle at 20% 18%,rgba(255,166,58,.18),transparent 38%),radial-gradient(circle at 82% 82%,rgba(255,95,46,.14),transparent 42%),linear-gradient(160deg,var(--bg-1),var(--bg-2));overflow:hidden}.stage-map{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;pointer-events:none;transition:opacity .9s ease}body.map-visible.view-mode .stage-map{opacity:1}body.map-visible.edit-mode .stage-map{opacity:.5}.stage-map img{width:100%;height:100%;object-fit:cover;filter:saturate(1.08) contrast(1.02)}#info{position:absolute;left:30%;top:5%;padding:20px;z-index:11;background-color:#ffb6c1;color:#000;opacity:.9;border-radius:30px}.logo-wrap{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10}body.ready .logo-wrap{animation:logo-dock 1.3s cubic-bezier(.25,1,.35,1) forwards}.logo{display:block;width:min(74vw,680px);min-width:250px;height:auto;filter:drop-shadow(0 14px 24px var(--shadow));animation:float-in .78s ease-out both;pointer-events:none;-webkit-user-select:none;user-select:none}.control-stack{position:absolute;left:22px;top:180px;z-index:12;display:flex;flex-direction:column;align-items:flex-start;gap:10px;opacity:0;transform:translateY(8px);transition:opacity .28s ease,transform .28s ease}body.ready .control-stack{opacity:1;transform:translateY(0);transition-delay:1.32s}.mode-switch{position:relative;display:inline-flex;align-items:center}.mode-switch-input{position:absolute;opacity:0;pointer-events:none}.mode-switch-track{width:88px;height:44px;border-radius:999px;border:2px solid rgba(255,255,255,.5);background:linear-gradient(180deg,#20170cbd,#0e0905d6);box-shadow:0 8px 16px var(--ui-shadow);position:relative;cursor:pointer}.mode-switch-thumb{position:absolute;top:3px;left:3px;width:34px;height:34px;border-radius:50%;background:linear-gradient(180deg,#fff2be,#ffc95e);box-shadow:0 5px 10px #00000059;transition:transform .22s ease}.mode-switch-icon{position:absolute;top:50%;transform:translateY(-50%);font-size:18px;color:#d3d3d3;opacity:.72;transition:opacity .22s ease;-webkit-user-select:none;user-select:none}.mode-switch-icon.view{left:12px}.mode-switch-icon.edit{right:12px}.mode-switch-input:checked+.mode-switch-track .mode-switch-thumb{transform:translate(44px)}.mode-switch-input:not(:checked)+.mode-switch-track .mode-switch-icon.view,.mode-switch-input:checked+.mode-switch-track .mode-switch-icon.edit{opacity:1}.add-stage-btn{width:52px;height:52px;border:0;border-radius:14px;font-size:34px;line-height:1;color:#2b1a0c;background:linear-gradient(180deg,#ffd778,#ffbb53);box-shadow:0 8px 18px var(--ui-shadow);cursor:pointer;opacity:0;transform:translateY(6px);transition:opacity .28s ease,transform .28s ease,filter .18s ease}.db-io-row{display:flex;gap:8px}.db-io-btn{min-width:72px;height:34px;border:0;border-radius:10px;font-size:12px;font-weight:700;color:#ffefcf;background:linear-gradient(180deg,#5c3b1d,#3a2310);box-shadow:0 6px 12px var(--ui-shadow);cursor:pointer}.db-io-btn:hover{filter:brightness(1.08)}body.ready.edit-mode .add-stage-btn{opacity:1;transform:translateY(0)}body.ready:not(.edit-mode) .add-stage-btn{opacity:0;transform:translateY(6px);pointer-events:none}.add-stage-btn:hover{filter:brightness(1.05)}.add-stage-btn:active{transform:translateY(1px)}.stage-object{position:absolute;width:158px;height:74px;border-radius:20%;border:3px solid rgba(255,255,255,.85);background:radial-gradient(circle at 32% 26%,#fff6cc 4%,var(--stage-base-color, #ffc96b) 46%,#7a4213 100%);box-shadow:0 12px 20px #00000059,inset 0 0 0 2px #ffffff29;cursor:grab;touch-action:none;overflow:visible;z-index:8}body.view-mode .stage-object{cursor:default}.stage-object:before{content:attr(data-stage-label);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-weight:700;font-size:13px;color:#3e1f06;text-shadow:0 1px 0 rgba(255,255,255,.55)}.stage-object.dragging{cursor:grabbing;box-shadow:0 15px 25px #0000006b,inset 0 0 0 2px #ffffff2e}.stage-object-hp{position:absolute;left:50%;top:calc(100% + 6px);transform:translate(-50%);width:76px;height:11px;border-radius:999px;background:#150e08eb;border:1px solid rgba(255,220,162,.55);padding:1px;pointer-events:none}.stage-object-hp-fill{display:block;width:100%;height:100%;border-radius:999px;background:#4dd26d;transition:width .18s ease,background-color .18s ease}.stage-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 42%,#00000059,#000000a6);z-index:39}.stage-settings-dialog{width:min(92vw,540px);border:1px solid rgba(255,213,142,.28);border-radius:20px;padding:0;background:linear-gradient(160deg,#2a180b,#120d08 72%);color:#ffe3b6;box-shadow:0 22px 42px #00000085,inset 0 1px #ffdea31f;z-index:40}.stage-settings-dialog::backdrop{background:transparent}.stage-dialog-shell{padding:20px 20px 16px}.stage-dialog-title{margin:0;font-size:21px;letter-spacing:.02em}.stage-dialog-sub{margin:6px 0 0;font-size:13px;color:#ffe3b6cc}.stage-dialog-body{display:flex;flex-direction:column;gap:12px;margin-top:16px}.stage-field{display:flex;flex-direction:column;gap:6px}.stage-field label{font-size:13px;color:#ffe3b6db}.stage-field input,.stage-field textarea{width:100%;border:1px solid rgba(255,215,146,.32);border-radius:12px;background:#18100ae6;color:#fff3d9;padding:10px 12px;font-size:14px}.stage-field textarea{min-height:94px;resize:vertical}.hp-gauge{border:1px solid rgba(255,215,146,.34);border-radius:999px;background:#0c0804e6;padding:3px}.hp-gauge-fill{height:16px;width:100%;border-radius:999px;background:#4dd26d;transition:width .18s ease,background-color .18s ease}.hp-meta{display:flex;justify-content:space-between;align-items:center;margin-top:4px;font-size:12px}.hp-value{font-weight:700;color:#4dd26d}.stage-progress-range{width:100%}.stage-dialog-footer{margin-top:16px;display:flex;justify-content:flex-end;gap:10px}.stage-dialog-btn{border:0;border-radius:11px;font-size:14px;font-weight:700;padding:9px 14px;cursor:pointer}.stage-dialog-btn.cancel{color:#f4d9ab;background:#66492bc7}.stage-dialog-btn.save{color:#2d1806;background:linear-gradient(180deg,#ffd889,#f4b752)}@keyframes float-in{0%{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes logo-dock{0%{left:50%;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:20px;top:16px;transform:translate(0) scale(.42);transform-origin:top left}}@media(max-width:768px){.control-stack{left:12px;top:82px;gap:8px}.mode-switch-track{width:76px;height:38px}.mode-switch-thumb{width:28px;height:28px}.mode-switch-icon{font-size:16px}.mode-switch-icon.view{left:10px}.mode-switch-icon.edit{right:10px}.mode-switch-input:checked+.mode-switch-track .mode-switch-thumb{transform:translate(38px)}@keyframes logo-dock{0%{left:50%;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:10px;top:10px;transform:translate(0) scale(.34);transform-origin:top left}}}
