*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#111b1d;color:#e4dabd;font-family:Noto Sans CJK KR,Noto Sans KR,serif}#stage{width:1200px;height:720px;position:absolute;left:50%;top:50%;transform-origin:center center;background:#172624;box-shadow:0 0 80px #000}#canvas,canvas,#ui{position:absolute;inset:0}#ui{pointer-events:none}#ui>*{pointer-events:auto}button{font:inherit;cursor:pointer;color:#e3d5ad;background:linear-gradient(#35423f,#1a2829);border:1px solid #b39b60;box-shadow:inset 0 0 0 2px #152126,inset 0 0 0 3px #53605a,0 2px 2px #0009;border-radius:2px;min-height:34px;padding:6px 11px;text-shadow:1px 1px #101919;transition:filter .12s}button:hover{filter:brightness(1.32);color:#fff0bf}button:disabled{cursor:default;opacity:.4;filter:grayscale(.6)}button.selected,.gold{background:linear-gradient(#766039,#433d29);border-color:#e2c77d;color:#fff1c1}.frame{border:5px ridge #747768;background:linear-gradient(120deg,#1e3030eb,#122123f5);box-shadow:inset 0 0 0 2px #b19b63,0 3px 10px #0008}.subframe{border:3px ridge #6d725f;background:#172727e8;box-shadow:inset 0 0 0 1px #9d8956}.right{position:absolute;right:0;top:0;width:252px;height:642px;padding:12px}.right h2{text-align:center;font-size:19px;margin:5px;color:#e9c97d}.minimap-hole{height:205px;pointer-events:none}.date{font-size:13px;text-align:center;padding:7px 0;border-bottom:1px solid #756940;color:#dcc992}.portrait{width:90px;height:96px;margin:10px auto 3px;display:block;object-fit:cover;image-rendering:pixelated;border:3px ridge #b49b65;background:#153344}.heroname{text-align:center;font-size:18px;color:#eee0b4}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;font-size:12px;text-align:center;margin:9px 0}.stats strong{display:block;color:#e2c376;font-size:19px}.small{font-size:12px;color:#b7bea4}.army{display:flex;gap:4px;margin:6px 0}.stack{flex:1;min-width:0;height:58px;position:relative;text-align:right;color:#fff2bd;background:linear-gradient(#344843,#192c2b);border:2px ridge #a28f5e;cursor:pointer}.stack img{position:absolute;left:50%;bottom:1px;width:48px;height:64px;transform:translate(-50%);image-rendering:pixelated;object-fit:none;object-position:left top}.stack b{position:absolute;right:1px;bottom:0;background:#17221bc9;padding:0 2px;font-size:13px}.right .row{display:flex;gap:5px;margin:6px 0}.row button{flex:1;padding:5px}.resources{position:absolute;left:0;right:0;bottom:0;height:78px;display:flex;padding:8px;gap:6px;align-items:center}.resource{height:54px;flex:1;display:flex;align-items:center;justify-content:center;gap:8px;border:2px ridge #7f7a5b;background:#122326;font-size:16px}.resource i{width:20px;height:25px;display:block;clip-path:polygon(50% 0,90% 20%,90% 80%,50% 100%,10% 80%,10% 20%);box-shadow:inset -4px -4px #0005;background:var(--gem)}.resource:first-child i{clip-path:polygon(30% 5%,75% 5%,100% 30%,100% 75%,70% 100%,30% 100%,0 75%,0 30%);height:25px;width:25px}.resource span{font-size:10px;color:#afa98c;display:block}.hint{position:absolute;left:12px;bottom:88px;max-width:910px;padding:8px 13px;color:#e4dfb8;font-size:13px;background:#172622d9;border:1px solid #93865a;pointer-events:none!important}.titlecard{position:absolute;left:260px;top:68px;width:680px;text-align:center;padding:30px 60px;background:#14242ce8}.eyebrow{letter-spacing:6px;color:#b8c2ad;font-size:12px}.titlecard h1{font-size:62px;color:#f3d68c;letter-spacing:9px;margin:16px 0 5px;text-shadow:3px 4px #151e22}.titlecard h3{font-weight:400;font-size:17px;letter-spacing:4px;color:#bec3b2;margin:0 0 25px}.factions{display:flex;gap:12px;margin:20px 0}.factions button{width:50%;height:76px;font-size:18px}.factions small{display:block;font-size:11px;margin-top:5px;color:#c5c4a4}.titlecard .major{display:block;width:100%;font-size:20px;height:48px;margin:10px 0}.titlecard .row{display:flex;gap:8px;margin-top:15px}.titlecard .row button{width:50%}.modalback{position:absolute;inset:0;background:#061113a6;display:flex;align-items:center;justify-content:center}.modal{width:660px;max-height:660px;overflow:auto;padding:24px}.modal h2{color:#ebcf89;font-size:25px;margin-top:0}.modal p{line-height:1.8;color:#d2d5bd}.modal .row{display:flex;gap:10px;margin-top:15px}.modal .row button{flex:1}.modal .close{float:right;min-width:35px}.spellgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.spellgrid button{text-align:left;min-height:70px}.spellgrid small{display:block;margin-top:5px;color:#b7baa5;font-size:11px}.townhead{position:absolute;left:0;top:0;width:1200px;height:50px;display:flex;justify-content:space-between;align-items:center;padding:6px 15px}.townhead h2{font-size:22px;margin:0;color:#f1d28e}.townpanell{position:absolute;left:0;top:405px;width:485px;height:237px;padding:12px}.townpanelr{position:absolute;left:485px;right:0;top:405px;height:237px;padding:12px}.tabs{display:flex;gap:6px;margin-bottom:9px}.tabs button{font-size:13px}.buildgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;max-height:158px;overflow-y:auto}.buildgrid button{text-align:left;font-size:12px;min-height:49px;padding:6px}.buildgrid small{display:block;color:#aaa991;font-size:10px;margin-top:3px}.recruitgrid{display:flex;gap:5px;margin:8px 0}.recruitgrid button{padding:4px;width:88px;min-height:107px;text-align:center;position:relative;font-size:10px}.recruitgrid .unitcrop{width:48px;height:59px;overflow:hidden;margin:0 auto;background-size:480px 64px;image-rendering:pixelated}.recruitgrid strong{color:#f1d48e;display:block;font-size:13px}.garrisonrow{display:flex;gap:12px;align-items:center}.garrisonrow>div{flex:1}.garrisonrow .army{margin:0}.garrisonrow .stack{height:45px}.garrisonrow .stack img{height:54px}.battlebottom{position:absolute;bottom:0;left:0;right:0;height:147px;display:flex;padding:10px;gap:12px}.battlecontrols{width:465px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;align-content:center}.battlecontrols button{height:63px;flex:1;font-size:15px;min-width:78px}.battlecontrols button b{display:block;font-size:25px;color:#dcc580}.battlelog{flex:1;padding:10px 15px;font-size:13px;line-height:1.7;overflow:hidden;display:flex;flex-direction:column;justify-content:end;color:#c2cbb1}.battlelog div:last-child{color:#f1d88e}.battlehead{position:absolute;top:0;left:0;right:0;height:44px;padding:9px 20px;display:flex;justify-content:space-between;background:#132521dd;border-bottom:2px ridge #b09a60;color:#edd28f}.toast{position:absolute;top:56px;left:300px;right:300px;padding:12px;text-align:center;z-index:100;background:#1b2b27f5;border:2px ridge #b6a366;color:#ffdf9c;pointer-events:none!important}.slotrow{display:flex;gap:10px;margin:10px 0;padding:10px;align-items:center}.slotrow span{flex:1}kbd{background:#364039;padding:1px 5px;border:1px solid #7c7e64;font-size:11px}.info-line{color:#b4bfa4;font-size:11px}.ending h1{font-size:48px;color:#f4d994}.tabcontent h3{margin:0 0 10px;font-size:16px;color:#dfc280}#ui>.right{pointer-events:none;background:linear-gradient(to bottom,transparent 0 218px,#162728f5 220px 100%)}#ui>.right button,#ui>.right .stack{pointer-events:auto}.right .portrait{width:96px!important;height:76px!important;object-fit:none;object-position:left top;transform:none!important}.right .army,.right .stats,.right .row{margin:5px 0}.right .portrait{width:82px!important;height:82px!important;object-fit:fill;image-rendering:pixelated}.right .minimap-hole{height:195px}.right .portrait{position:absolute;left:17px;top:252px;width:70px!important;height:76px!important;margin:0}.right .heroname{height:81px;padding-left:76px;padding-top:29px;text-align:left;font-size:17px}.right .heroname .small{display:block}.right .stats{margin:3px 0}.right .army,.right .row{margin:4px 0}.right .stats strong{font-size:18px}.townpanelr .recruitgrid button{min-height:94px}.townpanelr .unitcrop{height:50px}.townpanelr .stack{height:44px}.resource img{width:39px;height:39px;image-rendering:pixelated}.frame:not(.right){background-image:linear-gradient(#12242755,#0d1d1f88),url(/assets/stone.png)}.titlecard.frame{background-color:#13252deb}.modal.frame{background-color:#162829}.right{border-width:6px}.battlecontrols button{background-image:linear-gradient(#4c4f3a44,#15252788),url(/assets/stone.png);border-width:2px}.resource{border-color:#a08c5e}.buildgrid button{line-height:1.3}.modal .row button{line-height:1.6}