﻿*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Tahoma,'Segoe UI',sans-serif;overflow:hidden;height:100vh;width:100vw;user-select:none;background:#3a6ea5;color:#000;font-size:11px}

#desktop{position:fixed;top:0;left:0;right:0;bottom:44px;background:#3a6ea5;overflow:hidden;z-index:1}
#sky{position:absolute;inset:0;background:linear-gradient(180deg,#2a5a8a 0%,#5a9ad6 40%,#8ac0f0 70%,#b0d8ff 100%)}
#clouds{position:absolute;inset:0;background:radial-gradient(ellipse 160px 50px at 12% 15%,rgba(255,255,255,.6),transparent),radial-gradient(ellipse 200px 45px at 40% 10%,rgba(255,255,255,.5),transparent),radial-gradient(ellipse 140px 50px at 65% 18%,rgba(255,255,255,.4),transparent),radial-gradient(ellipse 180px 40px at 85% 12%,rgba(255,255,255,.5),transparent);animation:cloud 40s linear infinite;pointer-events:none}
@keyframes cloud{0%{transform:translateX(0)}100%{transform:translateX(80px)}}
#hills{position:absolute;bottom:0;left:0;right:0;height:50%;background:radial-gradient(ellipse 120% 100% at 5% 100%,#3a7a2a 0%,transparent 70%),radial-gradient(ellipse 130% 90% at 35% 100%,#4a8a3a 0%,transparent 65%),radial-gradient(ellipse 150% 100% at 65% 100%,#2a6a1a 0%,transparent 70%),radial-gradient(ellipse 110% 95% at 90% 100%,#5a9a4a 0%,transparent 68%),linear-gradient(180deg,transparent 35%,#1a5a0e 100%);pointer-events:none}

.desk-icons{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:6px;z-index:10}
.d-icon{display:flex;flex-direction:column;align-items:center;width:68px;padding:3px;cursor:pointer;border:2px solid transparent;text-align:center}
.d-icon:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25)}
.d-icon .di-canvas{width:40px;height:40px;margin-bottom:2px;image-rendering:pixelated}
.d-icon span{color:#fff;font-size:9px;text-shadow:1px 1px 2px #000;font-weight:bold;letter-spacing:0.5px;font-family:'Press Start 2P',Tahoma,sans-serif}

.trash-zone{position:absolute;bottom:20px;right:20px;display:flex;flex-direction:column;align-items:center;z-index:10;opacity:.7;transition:all .3s;padding:8px;border:2px dashed transparent;border-radius:4px}
.trash-zone:hover{opacity:1}
.trash-zone.drag-over{opacity:1;border-color:#ff4444;background:rgba(255,50,50,.12)}
.trash-icon{width:44px;height:44px;margin-bottom:2px;image-rendering:pixelated}
.trash-zone span{color:#fff;font-size:8px;font-family:'Press Start 2P',Tahoma,sans-serif;text-shadow:1px 1px 2px #000}

#startMenu{position:fixed;bottom:44px;left:0;width:240px;background:#d4d0c8;border:2px solid;border-color:#fff #808080 #808080 #fff;z-index:2000;display:none;box-shadow:3px 3px 10px rgba(0,0,0,.4)}
.sm-side{position:absolute;left:0;top:0;bottom:0;width:30px;background:linear-gradient(180deg,#000080,#1040a0 50%,#2060c0);display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px}
.sm-side span{color:#fff;font-size:11px;font-weight:bold;writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:2px;font-family:'Press Start 2P',Tahoma,sans-serif}
.sm-body{margin-left:30px;padding:3px}
.sm-item{display:flex;align-items:center;gap:8px;padding:5px 10px;cursor:pointer;font-size:11px;font-family:Tahoma,sans-serif}
.sm-item:hover{background:#000080;color:#fff}
.sm-item .sm-ico{width:20px;height:20px;image-rendering:pixelated;display:inline-block}
.sm-item .sm-ico-s{font-size:14px}
.sm-div{height:1px;background:#808080;margin:3px 8px}

#taskbar{position:fixed;bottom:0;left:0;right:0;height:44px;background:linear-gradient(180deg,#316ac5 0%,#2459b5 5%,#1a4da5 50%,#1a4da5 95%,#0d3d8e 100%);border-top:2px solid #6a9fd8;display:flex;align-items:center;z-index:1000;padding:0 3px;gap:4px}
#startBtn{display:flex;align-items:center;gap:4px;padding:2px 12px;height:34px;border:none;background:linear-gradient(180deg,#2a8a1a,#1a7a0a 50%,#0a6a00 100%);color:#fff;font-family:Tahoma,sans-serif;font-size:11px;font-weight:bold;cursor:pointer;border-radius:0 8px 8px 0;border:2px solid;border-color:#4aaa3a #1a5a0a #1a5a0a #4aaa3a;text-shadow:1px 1px 0 rgba(0,0,0,.5);letter-spacing:1px}
#startBtn:active{border-color:#1a5a0a #4aaa3a #4aaa3a #1a5a0a}
.st-star{font-size:14px;filter:drop-shadow(0 0 2px rgba(255,255,255,.5))}
.tb-sep{width:1px;height:30px;background:linear-gradient(180deg,transparent,#4a7ab5,transparent)}
.tb-ql{display:flex;gap:2px}
.ql-b{width:28px;height:28px;border:none;background:transparent;cursor:pointer;border-radius:2px;display:flex;align-items:center;justify-content:center;padding:2px}
.ql-b:hover{background:rgba(255,255,255,.2)}
.ql-ico{width:22px;height:22px;display:block;image-rendering:pixelated}
.tb-era{flex:1;text-align:center}
.tb-era span{color:#fff;font-size:10px;font-weight:bold;text-shadow:1px 1px 0 rgba(0,0,0,.4);font-family:'Press Start 2P',Tahoma,sans-serif;letter-spacing:0.5px}
.tb-tray{display:flex;align-items:center;padding:2px 5px;background:linear-gradient(180deg,#1a4a8a,#1a4a8a);border:1px solid;border-color:#0d3d7a #2a5a9a #2a5a9a #0d3d7a;height:32px}
.tr-item{padding:2px 6px;font-size:10px;color:#fff;white-space:nowrap;border-right:1px solid #3a6aaa;cursor:default}
.tr-item:last-child{border-right:none;font-weight:bold;font-family:Tahoma,sans-serif}
.tr-item:first-child{color:#ffd700}

.win{position:fixed;background:#ece9d8;border:2px solid;border-color:#fff #808080 #808080 #fff;min-width:360px;min-height:240px;z-index:100;display:flex;flex-direction:column;box-shadow:4px 4px 12px rgba(0,0,0,.35);font-family:Tahoma,sans-serif;font-size:11px;color:#000}
.win.min{display:none!important}
.win.dragging{opacity:.9}
.win-bar{display:flex;align-items:center;padding:3px 5px;background:linear-gradient(180deg,#0a2a7a,#1a4aaa 5%,#2a5aba 50%,#1a4aaa 95%,#0a2a7a);border-bottom:1px solid #1a3a6a;cursor:move;gap:4px;min-height:24px}
.wb-ico{width:16px;height:16px;image-rendering:pixelated;display:inline-block}
.wb-t{color:#fff;font-size:10px;font-weight:bold;text-shadow:1px 1px 0 rgba(0,0,0,.5);font-family:'Press Start 2P',Tahoma,sans-serif;letter-spacing:0.5px}
.wb-s{flex:1}
.win-bar button{width:18px;height:18px;border:1px solid;font-size:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:bold;padding:0;line-height:1;font-family:Tahoma,sans-serif}
.wb-close{background:linear-gradient(180deg,#d08080,#b04040 50%,#903030);border-color:#e0a0a0 #602020 #602020 #e0a0a0;color:#fff}
.wb-close:active{border-color:#602020 #e0a0a0 #e0a0a0 #602020}
.wb-min{background:linear-gradient(180deg,#e8e4d8,#c8c4b8 50%,#b8b4a8);border-color:#fff #808080 #808080 #fff;color:#000}
.wb-min:active{border-color:#808080 #fff #fff #808080}
.win-bd{padding:6px;overflow:auto;flex:1;background:#ece9d8}

.ep-panel{background:#d4d0c8;border:1px solid;border-color:#fff #808080 #808080 #fff;padding:4px 6px;margin-bottom:4px;display:flex;flex-wrap:wrap}
.ep-r{width:50%;padding:1px 0;font-size:10px;display:flex}
.ep-l{color:#555;flex:1}
.ep-v{font-weight:bold;text-align:right;min-width:40px}
.ep-sub{display:flex;gap:8px;margin-bottom:4px;font-size:10px;justify-content:center;background:#d4d0c8;border:1px solid;border-color:#fff #808080 #808080 #fff;padding:3px 6px}
#earthGrid{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;margin-bottom:4px}
.tile{aspect-ratio:1;cursor:pointer;position:relative;border:1px solid;border-color:#fff #808080 #808080 #fff;min-height:30px;image-rendering:pixelated}
.tile:active{border-color:#808080 #fff #fff #808080}
.tile.plains{background:#6aaa5a}
.tile.mountain{background:#7a7a7a}
.tile.water{background:#3a7aba}
.tile.forest{background:#2a7a2a}
.tile.desert{background:#b8a050}
.tile.temple{background:#dab060;border-color:#ffd700 #aa8030 #aa8030 #ffd700}
.tile .tp-pop{position:absolute;bottom:0;right:1px;font-size:7px;color:#fff;text-shadow:0 0 2px #000;font-weight:bold}
.tile .tp-ico{position:absolute;top:0;left:1px;font-size:9px}
.tile.sel{border-color:#ffff00!important;box-shadow:0 0 4px #ffff0088}
.ep-actions{display:flex;gap:4px;margin-bottom:4px}
.xp-b{padding:4px 12px;border:2px solid;border-color:#fff #808080 #808080 #fff;cursor:pointer;font-size:10px;font-family:Tahoma,sans-serif;background:#d4d0c8;white-space:nowrap}
.xp-b:active{border-color:#808080 #fff #fff #808080}
.xp-sm{font-size:9px;padding:3px 8px}
.ep-sb{background:#d4d0c8;border:1px solid;border-color:#fff #808080 #808080 #fff;padding:3px 6px;font-size:10px;color:#333;text-align:center;min-height:18px}

.jg-bar{display:flex;gap:8px;margin-bottom:4px;justify-content:center;background:#d4d0c8;border:1px solid;border-color:#fff #808080 #808080 #fff;padding:3px 6px;font-size:10px}
.jg-card{text-align:center;padding:10px;background:#fff;border:1px solid;border-color:#808080 #fff #fff #808080;margin-bottom:4px;min-height:60px}
.jg-card .sn{font-size:12px;font-weight:bold;color:#000080;margin-bottom:1px}
.jg-card .sd{font-size:10px;color:#444;margin-bottom:3px;font-style:italic}
.jg-card .ss{font-size:9px;color:#666}
.jg-card .soul-sub{font-size:9px;color:#999;margin-top:4px}
.jg-btns{display:flex;gap:4px;justify-content:center;margin-bottom:4px}
.b-heaven{background:linear-gradient(180deg,#ffe8a0,#ffd060)}
.b-purge{background:linear-gradient(180deg,#e0e0e0,#c0c0c0)}
.b-hell{background:linear-gradient(180deg,#ffb0b0,#ff7070)}
.jg-log{border:1px solid;border-color:#808080 #fff #fff #808080;background:#fff;padding:3px}
.jl-t{font-size:9px;font-weight:bold;color:#666;margin-bottom:1px}
#logEntries{max-height:60px;overflow-y:auto;font-size:9px;color:#444}
#logEntries div{padding:1px 0;border-bottom:1px solid #eee}

.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin-bottom:6px}
.sh-item{background:#fff;border:2px solid;border-color:#fff #808080 #808080 #fff;padding:6px 3px;text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:1px}
.sh-item:active{border-color:#808080 #fff #fff #808080}
.sh-canvas{width:28px;height:28px;image-rendering:pixelated;display:block}
.sh-n{font-size:9px;font-weight:bold}
.sh-c{font-size:8px;color:#666}
.cr-box{padding:4px;text-align:center;font-size:10px;min-height:18px;background:#d4d0c8;border:1px solid;border-color:#fff #808080 #808080 #fff;margin-bottom:6px}
.upgrade-section{margin-top:4px}
.up-title{font-size:9px;font-weight:bold;color:#444;text-align:center;margin-bottom:3px;font-family:'Press Start 2P',Tahoma,sans-serif}
.up-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px}
.up-item{background:#d4d0c8;border:1px solid;border-color:#fff #808080 #808080 #fff;padding:4px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:1px;font-size:9px}
.up-item:active{border-color:#808080 #fff #fff #808080}
.up-item .up-lvl{font-size:8px;color:#555}
.up-item .up-c{font-size:8px;color:#008800;font-weight:bold}

.wr-sec{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:10px}
.wr-b{flex:1;height:12px;background:#fff;border:1px solid;border-color:#808080 #fff #fff #808080;overflow:hidden}
#wrFill{height:100%;width:0%;background:linear-gradient(90deg,#ff6600,#ff0000);transition:width .3s}

#gameOverlay{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.75);display:flex;align-items:center;justify-content:center}
.go-box{background:linear-gradient(180deg,#1a1a2a,#0a0a1a);border:3px solid;border-color:#ff4444 #880000 #880000 #ff4444;padding:30px 40px;text-align:center;max-width:420px;width:90%}
.go-title{font-family:'Press Start 2P',Tahoma,sans-serif;font-size:18px;color:#ff4444;margin-bottom:6px;text-shadow:0 0 20px #ff000066}
.go-sub{color:#ff8888;font-size:10px;margin-bottom:12px;font-style:italic}
.go-stats{color:#ccc;font-size:10px;margin-bottom:16px;text-align:left;display:inline-block}
.go-stats div{padding:2px 0;border-bottom:1px solid #ffffff0a}
.go-stats span{color:#ffd700;font-weight:bold}
.go-btn{font-size:14px;padding:8px 24px;font-family:'Press Start 2P',Tahoma,sans-serif;background:linear-gradient(180deg,#ffd700,#ff8c00);border-color:#ffe060 #aa6000 #aa6000 #ffe060;color:#1a0000;cursor:pointer;margin-top:4px}
.go-btn:hover{background:linear-gradient(180deg,#ffe040,#ffa020)}

#achieveNotify{position:fixed;top:10px;right:10px;z-index:9998;background:linear-gradient(180deg,#2a1a00,#1a0a00);border:2px solid;border-color:#ffd700 #664400 #664400 #ffd700;padding:10px 16px;font-size:10px;color:#ffd700;font-family:'Press Start 2P',Tahoma,sans-serif;max-width:300px;box-shadow:0 0 20px rgba(255,200,0,.2)}
.ach-ico{font-size:16px}

::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:#d4d0c8}
::-webkit-scrollbar-thumb{background:#999;border:1px solid #777}
::-webkit-scrollbar-thumb:hover{background:#777}

@keyframes flash{0%,100%{opacity:1}50%{opacity:.2}}
.flash{animation:flash .4s ease-in-out 3}
