:root{--bg:#101510;--panel:#1a2119;--line:#34412e;--green:#c0ed87;--muted:#93a08b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#edf1e7;font:14px "Segoe UI","Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:#283124;color:#e5ecd9;padding:11px 17px;border-radius:6px}button:hover{border-color:var(--green)}button:disabled{opacity:.5;cursor:default}.primary{background:var(--green);color:#1e2c14;font-weight:600}aside{width:244px;position:fixed;inset:0 auto 0 0;padding:32px 22px;background:#171d16;border-right:1px solid var(--line);display:flex;flex-direction:column}.brand{color:var(--green);font-weight:700;letter-spacing:2px;font-size:17px}small{display:block;font-size:10px;color:var(--muted);letter-spacing:1px;margin-top:9px}.player{display:flex;gap:18px;padding:27px 8px;margin:30px 0;border-block:1px solid var(--line);color:var(--green);font-size:22px}.player span{font-size:14px;color:#e8eede}nav{display:grid;gap:9px;margin-top:20px}nav a{padding:15px 12px;border-radius:6px;color:#a5b19d}nav a.active{background:#2c3923;color:var(--green);border-left:3px solid var(--green)}.muted,p{color:var(--muted);line-height:1.8}.muted{font-size:11px;margin:27px 12px}.sidefoot{margin-top:auto;font-size:11px;color:var(--green)}.sidefoot button{font-size:10px;padding:8px;margin:18px 3px 8px 0}main{margin-left:244px;padding:0 44px}header{height:85px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:2px;color:var(--muted)}#app{min-height:calc(100vh - 150px);max-width:1300px;margin:auto}.heading{display:flex;justify-content:space-between;align-items:center;margin:34px 0 24px;gap:15px}h1{font-size:30px;font-weight:500;margin:12px 0}h2{font-weight:500;font-size:18px}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--green)}.heading p{margin:0;font-size:12px}.hero{position:relative;border:1px solid #536744;border-radius:10px;overflow:hidden;padding:30px 35px;background:radial-gradient(ellipse at 80% 80%,#3b502b,transparent 65%),#222d1c;min-height:245px}.hero h2{font-size:29px;line-height:1.6;margin:16px 0}.hero p{font-size:12px;max-width:65%}.planet{position:absolute;right:65px;top:21px;width:200px;height:200px;border:1px solid #a8cb7866;border-radius:50%;transform:rotate(-22deg);background:repeating-linear-gradient(0deg,transparent 0 23px,#b8da8a44 24px 25px);box-shadow:inset -30px -15px 40px #14200f,0 0 55px #b0dc6d11}.planet:before,.planet:after{content:"";position:absolute;inset:0 45px;border:1px solid #b5d28a88;border-radius:50%}.planet:after{inset:0 76px}.orbit{position:absolute;right:20px;top:74px;width:285px;height:85px;border:1px solid #c0df9288;border-radius:50%;transform:rotate(-30deg)}.coords{position:absolute;bottom:22px;right:24px;font-size:9px;letter-spacing:2px;color:#a6be8a}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:22px 0 32px}.stat,.box{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:22px}.stat label{font-size:11px;color:var(--muted)}.stat strong{display:block;font-size:29px;font-weight:400;margin-top:16px}.stat small{display:inline;margin-left:8px}.sectionhead{display:flex;justify-content:space-between;align-items:center;margin:26px 0 16px}.sectionhead h2{margin:0;font-size:16px}.sectionhead a{color:var(--green);font-size:11px}.plan{display:flex;align-items:center;gap:17px;padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:8px;margin-bottom:10px;transition:.2s}.plan:hover{border-color:#829f64;transform:translateY(-2px)}.icon{font-size:25px;color:var(--green);background:#2b3822;border-radius:7px;padding:13px}.planbody{flex:1}.plan h3{font-size:15px;font-weight:500;margin:0 0 10px}.meta{font-size:10px;color:var(--muted);line-height:1.9}.badge{border:1px solid #536a3e;color:#bed598;border-radius:4px;padding:3px 7px;margin-right:8px;font-size:9px}.ring{flex-shrink:0;width:48px;height:48px;border-radius:50%;padding:3px;background:conic-gradient(var(--green) calc(var(--p)*1%),#35432c 0)}.ring span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--panel);font-size:11px}.empty{padding:35px;text-align:center;border:1px dashed #4c5d40;border-radius:8px;color:var(--muted)}.empty button{margin-top:15px}.bottomgrid,.detailgrid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;margin:24px 0}.box h2{margin:0 0 20px;font-size:15px}.quote{font-size:21px;color:#d2dfbf;line-height:1.8}.heat{display:flex;gap:6px;flex-wrap:wrap}.heat span{width:22px;height:22px;border-radius:3px;background:#303d27}.heat .done{background:var(--green)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);font-size:9px;letter-spacing:1px;color:#7c8b70;padding:24px 0}.back{display:inline-block;margin-top:26px;color:var(--muted);font-size:12px}.step{display:flex;align-items:center;gap:13px;border-bottom:1px solid var(--line);padding:17px 0}.step input{width:19px;height:19px;margin:0;accent-color:var(--green)}.step label{flex:1;color:#e4ecda}.step.done label{text-decoration:line-through;color:var(--muted)}.bar{height:6px;background:#35432b;border-radius:5px;margin:18px 0}.bar div{height:100%;background:var(--green);border-radius:5px}.wide{width:100%;margin:15px 0}.historyrow{display:flex;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid var(--line);font-size:12px}.danger{color:#e4aa91}.cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}dialog{background:var(--panel);color:#edf1e7;border:1px solid #647e4b;border-radius:12px;width:550px;max-width:95vw;max-height:90vh;padding:28px}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}label{font-size:12px;color:var(--muted);display:block}input,select{display:block;width:100%;margin:8px 0 17px;padding:11px;background:#11180f;color:#eaf0e3;border:1px solid #485a3c;border-radius:5px}input:focus,select:focus{outline:1px solid var(--green)}#toast{display:none;position:fixed;bottom:25px;left:45%;background:var(--green);color:#17270e;border-radius:6px;padding:14px 23px;z-index:10}@media(max-width:900px){aside{width:200px;padding:26px 14px}main{margin-left:200px;padding:0 22px}.stats{grid-template-columns:1fr 1fr}.bottomgrid,.detailgrid{grid-template-columns:1fr}.planet{right:0;opacity:.5}.orbit{right:-35px;opacity:.5}}@media(max-width:600px){aside{position:relative;width:100%;padding:18px}.brand{font-size:14px}.player,aside>small,.muted,.sidefoot{display:none}nav{display:flex;gap:4px;margin-top:15px}nav a{font-size:10px;padding:9px 7px}main{margin:0;padding:0 16px}header{height:54px;font-size:9px;letter-spacing:0}h1{font-size:24px}.heading{margin-top:26px}.heading p{font-size:10px}.hero{padding:24px;min-height:220px}.hero h2{font-size:24px}.hero p{max-width:90%}.planet{right:-90px}.orbit{right:-110px}.stats{gap:10px}.stat{padding:16px}.plan{padding:13px;gap:11px}.icon{padding:9px;font-size:20px}footer span{display:none}.cols{gap:8px}#toast{left:10%;right:10%;text-align:center}}

/* Earth Online — cozy pixel edition */
:root{--bg:#fbf7e9;--panel:#fffdf6;--line:#8a996c;--green:#73a956;--muted:#687451}
body{color:#3f4c35;background-color:var(--bg);background-image:radial-gradient(#bac99b55 1px,transparent 1px);background-size:12px 12px;font-family:"Microsoft YaHei","Segoe UI",sans-serif}
aside{background:#eaf0d8;border-right:3px solid #8a996c;box-shadow:5px 0 0 #d6dfbf}
.brand{color:#4e7139;line-height:1.7;letter-spacing:1px;text-shadow:2px 2px #fff}.brand:before{content:"✦";color:#d59c45;margin-right:8px}
.player{border:2px solid #8a996c;background:#fff8da;box-shadow:4px 4px #ccd6b1;padding:20px 14px;color:#5f954c}.player span{color:#47583a}
nav a{border:2px solid transparent;border-radius:0;color:#60714b;transition:background .15s}
nav a:hover{background:#f7faeb;border-color:#b2bf95}
nav a.active{background:#cfe5ac;color:#3c612e;border:2px solid #75965d;box-shadow:3px 3px #aec78c}
.sidefoot{color:#54763d}
button{border:2px solid #829064;border-radius:0;background:#fff9e8;color:#4c5a3d;box-shadow:3px 3px #c4cba7;transition:transform .12s,box-shadow .12s}
button:hover{border-color:#526e40;background:#f1f6de;transform:translate(-1px,-1px);box-shadow:4px 4px #becaa1}
button:active{transform:translate(3px,3px);box-shadow:none}
button:disabled{transform:none;box-shadow:2px 2px #d5d9c5}
.primary{background:#bbd991;color:#385329;border-color:#68884f;box-shadow:4px 4px #abc287}
.primary:hover{background:#cee7a8}
header{color:#7a8666;border-bottom:2px dashed #c1cba8}
h1,h2,h3{color:#405831}h1{font-weight:700;letter-spacing:1px;text-shadow:2px 2px #fff}
.eyebrow{color:#6a8c4d;font-weight:700;letter-spacing:2px}
.hero{background:#dff0d7;border:3px solid #879b6b;border-radius:0;box-shadow:5px 5px #d1dcb9;padding:28px 34px;min-height:265px;isolation:isolate}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#82b25b 0 9px,#aacd7c 9px 22px,transparent 22px),url("pixel-world.svg") right center / 400px 250px no-repeat;z-index:-1;image-rendering:pixelated}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:22px;height:7px;background:repeating-linear-gradient(90deg,#aacd7c 0 12px,transparent 12px 24px);z-index:-1}
.hero h2{color:#3e6334;font-weight:700;text-shadow:2px 2px #f7ffee;font-size:29px}
.hero p{color:#5c7550;max-width:57%}.hero .eyebrow{color:#5b8050}.planet,.orbit{display:none}
.coords{color:#486a35;bottom:36px;font-size:8px;letter-spacing:1px;right:16px}
.stat,.box,.plan{border:2px solid #a0ad82;border-radius:0;background:#fffdf5;box-shadow:4px 4px #e0e5cc}
.stat{position:relative;overflow:hidden}.stat:after{content:"✦";position:absolute;right:16px;bottom:19px;font-size:30px;color:#a9c58a}
.stat:nth-child(2){background:#fff3d8;border-color:#c6ad79}.stat:nth-child(2):after{color:#e5c77b}
.stat:nth-child(3){background:#fce8e3;border-color:#c9a09a}.stat:nth-child(3):after{content:"♥";color:#dfa99b}
.stat:nth-child(4){background:#e9edf9;border-color:#a4abc4}.stat:nth-child(4):after{color:#afb9d9}
.stat strong{font-family:Consolas,monospace;font-weight:700;color:#4f6840}
.sectionhead a{color:#678a4d}.plan:hover{border-color:#739957;box-shadow:5px 5px #cad9b3}
.icon{border:2px solid #94b175;border-radius:0;color:#5b8741;background:#e8f1d5;box-shadow:2px 2px #ceddb6}
.plan h3{color:#4d623b;font-weight:600}.badge{border:1px solid #a7ba82;border-radius:0;color:#5c7741;background:#edf5dd}
.ring{background:conic-gradient(#83b65b calc(var(--p)*1%),#e2e8d1 0);box-shadow:0 0 0 2px #afbd94}.ring span{color:#527237}
.empty{border:2px dashed #b0be92;border-radius:0;background:#f3f7e8;color:#71805b;padding:34px}
.empty:before{content:"✿";display:block;font-size:35px;color:#d6a4a0;margin-bottom:8px}
.box:nth-child(2){background:#fff6e4}.quote{color:#887046;font-size:20px}
.heat span{border:1px solid #c1cda4;border-radius:0;background:#eaf0d9;box-shadow:1px 1px #d4ddbf}.heat .done{background:#91bd68;border-color:#6c9650}
footer{color:#85926e;border-top:2px dashed #c1cba8}
.step{border-bottom:2px dotted #d5dec0}.step label{color:#50643e}.step input{accent-color:#7da85c}.step.done label{color:#96a185}
.bar{background:#e0e9ce;border:1px solid #adbd91;border-radius:0;height:10px}.bar div{background:repeating-linear-gradient(90deg,#86b15e 0 12px,#a6ca7b 12px 14px);border-radius:0}
.historyrow{border-bottom:2px dotted #d5dec0;color:#64784e}.danger{color:#ae6a5b;background:#ffede5;border-color:#c9a08c}
dialog{color:#485c38;border:3px solid #879b6b;border-radius:0;background:#fffcef;box-shadow:7px 7px #4f663e44}
dialog::backdrop{background:#63744c77;backdrop-filter:blur(3px)}
input,select{background:#fffef8;color:#465939;border:2px solid #b1bd97;border-radius:0}
input:focus,select:focus{outline:2px solid #94b875;outline-offset:2px}
#toast{background:#d6eab7;border:2px solid #77975b;border-radius:0;box-shadow:4px 4px #8d9d6c66;color:#3e5a2f}
a:focus-visible,button:focus-visible{outline:3px dashed #c29b4f;outline-offset:4px}
@media(max-width:900px){.hero:before{background-size:auto,300px 210px}.hero p{max-width:65%}.coords{font-size:7px}}
@media(max-width:600px){aside{border-right:0;border-bottom:3px solid #9cac7b;box-shadow:0 4px #d6dfbf}nav a{font-size:10px;padding:8px 5px}.hero{padding:22px;min-height:290px}.hero:before{background-size:auto,260px 170px;background-position:center,right bottom 20px;opacity:.72}.hero h2{font-size:24px}.hero p{max-width:82%;font-size:11px}.coords{display:none}.stat:after{font-size:24px;right:10px}.stat strong{font-size:26px}.heading .primary{padding:10px;font-size:12px}.empty{padding:26px 12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}