@import"https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;600;700;900&display=swap";:root{font-family:"Noto Serif KR",serif;color:#f5ead2;background:#100b08;font-synthesis:none}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;min-height:100dvh;margin:0}body{overflow:hidden;touch-action:manipulation}button,input{font:inherit}button{color:inherit}.splash{position:relative;display:grid;width:100%;height:100%;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 35%,rgba(139,34,19,.38),transparent 35%),repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px),linear-gradient(#1d100b,#0a0705)}.splash:before{content:"";position:absolute;top:22px;right:22px;bottom:22px;left:22px;border:1px solid rgba(197,148,75,.35);box-shadow:inset 0 0 50px #000000d9;pointer-events:none}.splash-art{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.seal{position:absolute;top:8%;left:50%;display:grid;width:88px;height:88px;place-items:center;transform:translate(-50%) rotate(-3deg);border:5px double rgba(199,48,29,.48);color:#d239238c;font-size:46px;font-weight:900}.mountains{position:absolute;right:-5%;bottom:-14%;left:-5%;height:45%;opacity:.34}.mountain-back{background:linear-gradient(145deg,transparent 0 36%,#8e3f22 36% 49%,transparent 49%) 0 0 / 45% 100% repeat-x}.mountain-front{bottom:-25%;background:linear-gradient(35deg,transparent 0 35%,#0b0806 35% 70%,transparent 70%) 0 0 / 38% 100% repeat-x;opacity:.95}.title-card{position:relative;z-index:1;width:min(620px,calc(100% - 52px));padding:50px 42px 38px;text-align:center;border-top:1px solid rgba(222,170,91,.48);border-bottom:1px solid rgba(222,170,91,.48);background:linear-gradient(90deg,transparent,rgba(20,11,7,.9) 18% 82%,transparent)}.eyebrow{margin:0 0 20px;color:#b88a50;font:600 11px/1.4 "Noto Serif KR",serif;letter-spacing:.28em}h1{margin:0;color:#ead39b;font-size:clamp(42px,8vw,78px);font-weight:900;line-height:1;letter-spacing:-.07em;text-shadow:0 3px 0 #5a2418,0 0 24px rgba(203,105,50,.26)}h1 span{display:block;margin-bottom:10px;color:#ad3926;font-size:.38em;letter-spacing:.55em;transform:translate(.3em);text-shadow:none}.subtitle{margin:24px 0 34px;color:#c5b89e;font-size:14px;letter-spacing:.06em}.start-button{display:inline-flex;align-items:center;justify-content:center;gap:34px;min-width:230px;padding:14px 22px;border:1px solid #b88446;background:linear-gradient(#8e2f20,#651d16);box-shadow:0 5px 22px #00000073,inset 0 0 0 2px #43120e;cursor:pointer;font-weight:700;letter-spacing:.12em;transition:transform .15s,filter .15s}.start-button:hover{filter:brightness(1.16);transform:translateY(-2px)}.start-button:active{transform:translateY(1px)}.start-button:disabled{cursor:wait;filter:grayscale(.4);opacity:.7;transform:none}.start-button span{color:#e6b969;font-family:sans-serif;font-size:11px}.save-note{margin:20px 0 0;color:#776c5d;font-size:11px}.cloud-login{display:flex;min-height:30px;align-items:center;justify-content:center;gap:12px;margin-top:17px;color:#9d8a70;font-size:11px}.cloud-login span{display:inline-flex;align-items:center;gap:7px}.cloud-login i{width:6px;height:6px;border-radius:50%;background:#6da064;box-shadow:0 0 7px #6da064a6}.cloud-login button{padding:6px 10px;border:1px solid #72502d;background:#502d1a59;cursor:pointer;color:#d4bd90;font-size:11px}.cloud-login button:hover{background:#6f261c}.splash footer{position:absolute;bottom:34px;color:#675a4d;font-size:11px;letter-spacing:.08em}.game-shell{display:flex;width:100%;height:100%;min-height:100dvh;flex-direction:column;background:#050403}.toolbar-trigger{position:fixed;z-index:39;top:0;right:0;left:0;height:10px}.toolbar{position:fixed;z-index:40;top:0;right:0;left:0;display:flex;height:50px;align-items:center;gap:4px;padding:5px 8px;border-bottom:1px solid #51311d;background:linear-gradient(#251710f5,#160e0af0);box-shadow:0 5px 18px #0006;opacity:0;pointer-events:none;transform:translateY(-100%);transition:transform .22s ease,opacity .22s ease}.toolbar-visible{opacity:1;pointer-events:auto;transform:translateY(0)}.toolbar>button{width:40px;height:40px;border:0;background:transparent;cursor:pointer;font-size:20px}.toolbar>button:hover{background:#ffffff14}.toolbar-title{flex:1;padding-left:8px;color:#d1b67c;font-weight:700;letter-spacing:.08em}.tool-menu{position:absolute;top:48px;left:8px;display:flex;width:min(300px,calc(100vw - 16px));flex-direction:column;padding:7px;border:1px solid #72502d;background:#20140e;box-shadow:0 10px 28px #000000a6}.tool-menu button,.import-button{padding:11px 13px;border:0;background:transparent;cursor:pointer;color:#e3d4b6;text-align:left;font-size:13px}.tool-menu button:hover,.import-button:hover{background:#6f261c}.import-button input{display:none}.tool-menu__title{display:flex;justify-content:space-between;padding:7px 13px 5px;color:#9d825f;font-size:11px;letter-spacing:.04em}.tool-menu__title span{color:#d1b67c}.tool-menu__hint,.tool-menu__warning{padding:3px 13px 8px;color:#84725b;font-size:10px;line-height:1.5}.tool-menu__warning{color:#e2a67d}.tool-menu__divider{height:1px;margin:5px 8px;background:#51311d}.tool-menu__empty{padding:8px 13px 11px;color:#776c5d;font-size:11px}.save-file-list{max-height:min(240px,34vh);overflow-y:auto}.save-file-list button{display:flex;width:100%;justify-content:space-between;padding-top:7px;padding-bottom:7px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}.play-area{position:relative;display:flex;width:100%;min-height:0;flex:1;align-items:center;justify-content:center;padding:0}.screen-frame{position:relative;display:flex;width:min(100%,calc(100vh * 4 / 3));width:min(100%,calc(100dvh * 4 / 3));max-width:none;aspect-ratio:4 / 3;align-items:center;justify-content:center;overflow:hidden;border:0;background:#000;box-shadow:none}.screen-frame canvas,.dosbox-container{width:100%!important;height:100%!important;cursor:none}.screen-frame canvas{image-rendering:auto!important}.loading,.error-message{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;gap:12px;background:#090604;color:#cbb789;font-family:"Noto Serif KR",serif;font-size:13px}.spinner{width:18px;height:18px;border:2px solid #4d3421;border-top-color:#c58b42;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{flex-direction:column;color:#e2b5a9;text-align:center}.error-message button{padding:7px 14px;border:1px solid #8b4938;background:#4e1d16;cursor:pointer}.controls{display:none;flex:0 0 auto;align-items:center;gap:32px;-webkit-user-select:none;user-select:none}.dpad{position:relative;width:144px;height:144px}.control-key{border:1px solid #72533a;border-radius:8px;background:linear-gradient(#35251a,#1d1510);box-shadow:0 4px #0a0705;color:#e2cfaa;font-size:13px;touch-action:none}.control-key:active{transform:translateY(3px);box-shadow:0 1px #0a0705;background:#6c2a1e}.dpad .control-key{position:absolute;width:48px;height:48px}.dpad-up{top:0;left:48px}.dpad-left{top:48px;left:0}.dpad-down{top:96px;left:48px}.dpad-right{top:48px;left:96px}.action-keys{display:grid;grid-template-columns:repeat(2,64px);gap:10px}.action-keys .control-key{height:48px}.wide-key{grid-column:1 / 3}.primary-key{color:#fff1cd;background:linear-gradient(#8e3425,#5d2018)}.toast{position:fixed;z-index:30;bottom:18px;left:50%;padding:9px 14px;transform:translate(-50%,15px);border:1px solid #72502d;background:#190f0af0;opacity:0;color:#e3d4b6;font-size:12px;pointer-events:none;transition:.2s}.toast-visible{transform:translate(-50%);opacity:1}@media (pointer: coarse),(max-width: 900px){.play-area{flex-direction:column;padding:0}.controls{position:absolute;z-index:12;right:12px;bottom:12px;left:12px;display:flex;width:auto;justify-content:space-between}}@media (pointer: coarse) and (orientation: landscape){.play-area{flex-direction:row;padding:0}.controls{right:12px;bottom:12px;left:auto;width:300px;gap:10px}.dpad{transform:scale(.86)}.action-keys{grid-template-columns:repeat(2,58px)}}@media (max-height: 580px) and (orientation: portrait){.title-card{padding-top:30px;padding-bottom:24px}.subtitle{margin:14px 0 20px}.seal{display:none}}
