
:root{--dark:#203b40;--ink:#26404a;--muted:#789096;--border:#e1e7e4;--paper:#fff;--green:#338c6d;--light:#f0f5ee;--gold:#e8aa56;--shadow:0 9px 35px #364e4211}*{box-sizing:border-box}body{margin:0;background:#eef3ee;color:var(--ink);font-family:'Be Vietnam Pro',system-ui,sans-serif;font-size:13px}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #f1c375;outline-offset:2px}.shell{max-width:1760px;margin:auto;padding:16px 20px 30px}.topbar{display:flex;align-items:center;gap:20px;justify-content:space-between;padding:8px 2px 18px}.brand{display:flex;align-items:center;gap:11px}.brand-mark{width:49px;height:49px;display:grid;place-items:center;border-radius:15px;background:#356d5c;color:#fff;font-size:30px;box-shadow:inset 0 -6px #275c4d}.brand-over{letter-spacing:2.2px;color:#8b9c93;font-size:9px;font-weight:800}.brand-over span{color:#c5a773}.brand h1{font-family:Quicksand,sans-serif;font-weight:800;margin:2px 0 0;font-size:25px;letter-spacing:-1px}.brand h1 small{font-family:inherit;font-size:10px;color:#66a180;vertical-align:middle;letter-spacing:0}.world-status{border:1px solid #d7e4d7;border-radius:30px;padding:10px 17px;font-weight:800;color:#5f8575;background:#fff;display:flex;gap:9px;align-items:center;font-size:10px;letter-spacing:.6px}.world-status span:last-child{font-weight:600;color:#90a39a;margin-left:5px}.live-light,.pulse{width:7px;height:7px;border-radius:50%;display:inline-block;background:#51bc7d;box-shadow:0 0 0 4px #d8f1df}.topbuttons{display:flex;align-items:center;gap:8px}.ghost,.ghost-icon{background:white;border:1px solid var(--border);border-radius:12px;padding:11px 14px;color:#53786d;font-weight:800}.ghost-icon{padding:10px 14px;font-size:16px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 322px;gap:18px;align-items:start}.leftcolumn,.sidebar{min-width:0}.map-header{border-radius:20px 20px 0 0;border:1px solid var(--border);border-bottom:0;padding:18px 20px 13px;background:#fff;display:flex;justify-content:space-between;gap:12px;align-items:center}.eyebrow{letter-spacing:2px;color:#99aca0;font-weight:800;font-size:9px}.map-header h2{font-family:Quicksand,sans-serif;margin:4px 0 2px;font-size:22px}.map-header p{margin:0;font-size:10px;color:#8e9f9b}.map-tools{display:flex;align-items:center;gap:7px}.map-tools>span{color:#7b9888;font-weight:800;font-size:10px;margin-right:8px;white-space:nowrap}.tool{border:1px solid #e1e9df;background:#f8fbf7;color:#568171;width:31px;height:31px;border-radius:9px;font-size:18px;font-weight:800}.tool.focus{color:#297a60;font-size:23px}.map-screen{position:relative;overflow:hidden;background:#8ec49b;border:1px solid #dce7dc;min-height:500px;height:min(59vh,685px);touch-action:none}#world{width:100%;height:100%;display:block;cursor:grab}#world:active{cursor:grabbing}.map-gradient{pointer-events:none;position:absolute;inset:0;background:linear-gradient(180deg,#fff9 0,transparent 75px,transparent 80%,#355b2d17);opacity:.42}.map-chip{position:absolute;top:15px;pointer-events:none;background:#fffffff0;color:#4b685f;font-size:10px;font-weight:800;border-radius:30px;padding:9px 12px;display:flex;align-items:center;gap:8px;box-shadow:0 5px 15px #2a4f3617}.map-chip.left{left:16px}.map-chip.right{right:16px}.map-hint{position:absolute;left:16px;bottom:14px;background:#284e4baf;color:white;font-size:10px;border-radius:9px;padding:8px 12px;pointer-events:none}.bottom-bar{padding:14px 16px;border:1px solid var(--border);border-radius:0 0 16px 16px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.flow-badge{display:flex;gap:7px;align-items:center;color:#8e9a93;font-size:11px}.flow-badge strong{color:#3f7765}.flow-badge span{color:#9daea5}.simulation-controls{display:flex;gap:7px;flex-wrap:wrap}.simulation-controls button{border-radius:10px;padding:10px 11px;font-size:10px;font-weight:800}.subtle{border:1px solid #dee7dc;background:#f8faf6;color:#638271}.primary{border:1px solid #2d8163;background:#327e63;color:#fff;box-shadow:0 4px 10px #2c735028}.town-strip{display:flex;gap:8px;padding:12px 2px;overflow:auto;scrollbar-width:thin}.town-chip{border:1px solid #dfe6db;background:#fff;padding:10px 12px;border-radius:11px;display:flex;gap:8px;align-items:center;white-space:nowrap;font-size:10px;color:#55746b;font-weight:800}.town-chip:hover{border-color:#85b89a;background:#f5fcf7}.town-chip span{font-size:17px}.log-panel{border:1px solid var(--border);background:#fff;border-radius:16px;padding:17px 18px;box-shadow:var(--shadow);margin-top:1px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}.section-heading h3{font:800 15px Quicksand,sans-serif;margin:0}.section-heading span{color:#90a19a;font-size:10px}.log-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.log-item{border-radius:10px;background:#f8faf7;padding:11px 12px;border:1px solid #eff1ea;display:flex;gap:10px;align-items:start}.log-item .emoji{font-size:18px}.log-item strong{font-size:10px;display:block;margin-bottom:4px;color:#557b6b}.log-item p{color:#718780;font-size:10px;margin:0;line-height:1.7}.sidebar{border:1px solid #e0e6dc;border-radius:20px;overflow:hidden;background:white;box-shadow:var(--shadow);position:sticky;top:12px}.portrait-area{background:linear-gradient(155deg,#e9f7eb,#d9eada);position:relative;text-align:center;overflow:hidden}.portrait-light{position:absolute;width:240px;height:180px;background:#ffffff60;border-radius:50%;left:50%;top:18px;transform:translateX(-50%)}#portrait{width:100%;height:180px;position:relative;object-fit:contain;display:block}.portrait-nametag{padding:0 14px 15px;position:relative}.portrait-nametag strong{display:block;font:800 20px Quicksand,sans-serif;margin:5px 0 1px}.portrait-nametag span{color:#77978b;font-size:10px}.character-facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#e9efe9;border-top:1px solid #e0e8de;border-bottom:1px solid #e0e8de}.character-facts>div{background:#fff;padding:12px 14px;min-height:64px}.character-facts>div:last-child{grid-column:span 2}.character-facts span{display:block;color:#95a399;font-size:9px;margin-bottom:5px}.character-facts strong{display:block;font-weight:800;font-size:12px;overflow-wrap:anywhere}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin:16px 13px 0;background:#f3f6f1;border-radius:10px;padding:3px}.tab{font-size:10px;font-weight:800;color:#96a59d;border:0;background:transparent;padding:10px 2px;border-radius:8px}.tab.active{background:#fff;color:#44846d;box-shadow:0 2px 7px #304e2b0f}.tabbody{padding:16px 16px 12px;max-height:320px;overflow-y:auto}.hidden{display:none!important}.meter-row{display:flex;justify-content:space-between;gap:7px;align-items:center;font-size:10px;margin-bottom:6px}.meter-row b{font-weight:700;color:#688277}.meter-row span{font-weight:800;color:#436c61}.meter{height:6px;border-radius:20px;background:#eff2ed;overflow:hidden;margin-bottom:12px}.meter>div{height:100%;border-radius:20px;background:linear-gradient(90deg,#79c4a4,#378e75)}.meter.amber>div{background:linear-gradient(90deg,#f5cb83,#d79651)}.meter.pink>div{background:linear-gradient(90deg,#f2b2a9,#cf7c7f)}.stats-heading{font-size:9px;color:#adbaa9;letter-spacing:1.5px;font-weight:800;margin:1px 0 13px}.inventory-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.inventory-card{border-radius:10px;padding:12px 9px;background:#f7faf5;text-align:center;color:#657a68;font-size:9px;min-height:78px}.inventory-card strong{display:block;margin-top:4px;color:#3e6152}.inventory-card .item-icon{font-size:25px}.inventory-empty{font-size:11px;color:#8da198;line-height:1.9}.inventory-shop{font-size:10px;padding:10px;border-radius:9px;border:1px solid #c9dfcb;background:#eff8ed;color:#467d5f;margin-top:12px;width:100%;font-weight:800}.mem-item{border-left:2px solid #b8d9bf;padding:2px 0 10px 11px;margin-bottom:8px;color:#607b6c;font-size:10px;line-height:1.8}.mem-item b{color:#347a5f;display:block}.sidebar-tip{padding:12px 15px 17px;border-top:1px solid #f0f3ed;color:#7b9687;font-size:10px;line-height:1.8;display:flex;gap:9px}.sidebar-tip:first-letter{color:#d49d4b}.overlay{position:fixed;inset:0;background:#1f3e40ae;backdrop-filter:blur(5px);z-index:30;display:flex;justify-content:center;align-items:center;padding:20px}.event-modal{position:relative;background:#fff;border-radius:22px;max-width:550px;width:100%;overflow:hidden;box-shadow:0 32px 90px #12312e54;max-height:96vh;overflow-y:auto}.close-modal{position:absolute;right:13px;top:13px;z-index:5;background:#ffffffdf;border:0;width:30px;height:30px;border-radius:50%;color:#6a7c70;font-size:19px}.modal-illus{height:165px;background:linear-gradient(#a9d7df,#e6f0cb);position:relative;overflow:hidden}.scene-sun{position:absolute;top:21px;right:85px;width:44px;height:44px;border-radius:50%;background:#f8d793;box-shadow:0 0 0 10px #fff5ad4d}.scene-cloud{position:absolute;width:115px;height:26px;border-radius:40px;background:#ffffffaa;top:45px}.scene-cloud:before{content:'';position:absolute;top:-17px;left:27px;width:52px;height:45px;background:#ffffffaa;border-radius:50%}.scene-cloud.a{left:35px}.scene-cloud.b{right:8px;top:75px;transform:scale(.6)}.scene-floor{position:absolute;bottom:0;width:100%;height:58px;background:#8fba82;border-top:9px solid #c2d7a5}.scene-floor:after{content:'';position:absolute;inset:18px 0 0;background:repeating-linear-gradient(110deg,transparent 0 36px,#72a97442 37px 39px)}.scene-family{position:absolute;bottom:43px;left:50%;transform:translateX(-50%);display:flex;align-items:end;gap:20px}.figure{display:block;font-size:50px;color:#5c8790;text-shadow:0 10px #f9f5dd,0 16px #294c44}.figure.two{font-size:36px;color:#c08383}.figure.three{color:#d69c67}.modal-body{padding:25px 29px 29px}.gold{color:#d5a05b}.modal-body h2{font:800 25px/1.28 Quicksand,sans-serif;margin:8px 0 11px;color:#234a45}.event-description{color:#697d74;line-height:1.95;font-size:12px;margin:0 0 18px}.event-options{display:grid;gap:9px}.choice{width:100%;text-align:left;background:#f8fbf7;border:1px solid #dfe9df;border-radius:12px;padding:13px 15px;display:flex;justify-content:space-between;gap:9px;align-items:center;color:#355d4d}.choice:hover{border-color:#8ebfa3;background:#edf8ef}.choice b{font-size:11px}.choice small{display:block;color:#8fa698;margin-top:4px;font-size:10px;line-height:1.6}.choice .arrow{font-size:19px;color:#73a188}.modal-foot{color:#9ba99b;font-size:10px;line-height:1.7;margin:14px 0 0}.toast{position:fixed;z-index:45;bottom:20px;left:50%;transform:translateX(-50%) translateY(30px);background:#214c40;color:white;padding:13px 20px;border-radius:12px;box-shadow:0 8px 30px #133e3290;opacity:0;pointer-events:none;transition:.25s;font-size:12px;text-align:center;max-width:90vw}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}@media(max-width:1110px){.workspace{grid-template-columns:minmax(0,1fr) 290px}.map-screen{height:54vh;min-height:430px}.world-status{display:none}.map-tools>span{display:none}}@media(max-width:820px){.shell{padding:9px}.topbar{padding:6px 2px 12px}.brand h1{font-size:21px}.brand-over{font-size:8px;letter-spacing:1px}.brand-mark{width:42px;height:42px}.workspace{display:flex;flex-direction:column}.leftcolumn,.sidebar{width:100%}.sidebar{position:relative;top:0}.map-screen{height:480px;min-height:0}.map-header{padding:13px 12px}.map-header h2{font-size:19px}.map-header p{font-size:9px}.map-tools{gap:3px}.map-chip.right{display:none}.log-list{grid-template-columns:1fr}.portrait-area{display:grid;grid-template-columns:45% 1fr;align-items:center}.portrait-light{left:22%}.portrait-nametag{text-align:left}.portrait-nametag strong{font-size:19px}.tabs{margin-top:12px}}@media(max-width:520px){.ghost-icon{display:none}.ghost{padding:9px;font-size:10px}.map-screen{height:375px}.map-chip{padding:7px;font-size:9px}.map-hint{display:none}.bottom-bar{padding:10px}.simulation-controls{display:grid;grid-template-columns:repeat(3,1fr);width:100%}.simulation-controls .primary{grid-column:span 3}.simulation-controls button{padding:10px 4px}.map-header p{max-width:240px;line-height:1.6}.map-tools .tool{width:26px;height:28px}.modal-body{padding:21px}.modal-body h2{font-size:22px}.modal-illus{height:130px}}
