:root{color-scheme:dark;--bg:#070d1a;--paper:#101a2c;--paper2:#15233a;--line:#2b3950;--text:#eef7ff;--muted:#a0b0c6;--teal:#54dcca;--gold:#e6bc7a;--danger:#f28a8a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(ellipse at 80% 0%,#13294b 0%,transparent 42%),radial-gradient(ellipse at 0 55%,#101936 0%,transparent 48%),var(--bg);line-height:1.55}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}.container{width:min(1160px,calc(100% - 44px));margin:0 auto}.pad-top{padding-top:44px;padding-bottom:75px}.stack>*+*{margin-top:17px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.45rem,5vw,4.6rem);line-height:1.1;letter-spacing:-.055em;margin-bottom:17px}h2{font-size:1.5rem;letter-spacing:-.028em;margin-bottom:14px}h3{font-size:1.12rem;margin:0}.lead{color:#b4c4d9;max-width:680px;font-size:1.11rem}.muted{color:var(--muted)}.small,small{font-size:.81rem}.footnote{font-size:.73rem;line-height:1.45}.eyebrow{color:var(--teal);font-size:.68rem;letter-spacing:.21em;font-weight:800;text-transform:uppercase;margin-bottom:12px}.topbar{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 max(22px,calc((100vw - 1160px)/2));border-bottom:1px solid #ffffff17;background:#090f20bd;backdrop-filter:blur(18px);position:relative;z-index:2}.brand{font-size:1.32rem;font-weight:850;letter-spacing:-.04em;display:flex;align-items:center;gap:3px}.brand span:not(.brandmark){color:var(--teal)}.brandmark{display:inline-flex;border:2px solid #5dd7d0;border-radius:50%;align-items:center;justify-content:center;color:#e3c388;width:31px;height:31px;margin-right:6px}.brand small{font-size:.57rem;letter-spacing:.11em;border:1px solid #6a6b85;border-radius:7px;padding:2px 5px;margin-left:7px;color:#a5afd0}.topbar nav{display:flex;align-items:center;gap:23px;font-size:.83rem}.topbar nav a:hover,.link{color:var(--teal)}.nav-btn,.btn{background:linear-gradient(120deg,#6ee7d5,#46beb6);color:#052129;border:0;border-radius:10px;padding:12px 18px;font-weight:780;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 7px 24px #35cbb51a}.nav-btn{padding:8px 13px}.btn:hover{filter:brightness(1.1)}.panel{background:linear-gradient(135deg,#15233aee,#10192ded);border:1px solid #35455b;border-radius:18px;padding:25px;box-shadow:0 20px 50px #0003}.panel.narrow{max-width:670px;margin:10vh auto}.alert{padding:12px 15px;border-radius:10px;font-size:.87rem;background:#173d3b;border:1px solid #296b64}.alert.danger{background:#40252d;border-color:#a34d53}.alert.success{background:#183c34;border-color:#36806e}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:block;font-weight:650;color:#d6e3f3;font-size:.88rem}input,select{width:100%;display:block;margin-top:7px;padding:12px;background:#0a1628;border:1px solid #3b4c66;color:var(--text);border-radius:10px;outline:none}input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.home-hero{padding:64px 0 25px;position:relative;min-height:520px}.home-hero h1{max-width:690px;font-size:clamp(3.7rem,7.3vw,7.2rem);position:relative;z-index:1}.home-hero em{font-style:normal;color:var(--teal)}.home-hero .lead{max-width:530px;position:relative;z-index:1}.feature-chips{display:flex;gap:11px;flex-wrap:wrap;max-width:630px;position:relative;z-index:1}.feature-chips span{font-size:.72rem;color:#d9e4f0;border:1px solid #3a5362;background:#14223991;padding:6px 11px;border-radius:99px}.planet-showcase{position:absolute;right:0;top:60px;width:435px;height:405px;pointer-events:none;opacity:.95}.planet-disk{position:absolute;inset:30px;background:radial-gradient(circle at 29% 24%,#79d2d2 0 3%,#368eb4 27%,#12547c 55%,#10203f 75%);border-radius:50%;box-shadow:inset -30px -17px 56px #020b24,0 0 95px #317caa60;overflow:hidden}.planet-disk:after{content:"";position:absolute;inset:5%;border-radius:50%;background:radial-gradient(ellipse at 28% 33%,#69c2a3 0 13%,transparent 17%),radial-gradient(ellipse at 51% 63%,#389b87 0 15%,transparent 20%),radial-gradient(ellipse at 64% 30%,#47a988 0 11%,transparent 20%);filter:blur(5px);opacity:.9}.orbit-ring{position:absolute;inset:34px 3px;border:2px solid #75d3d682;border-radius:50%;transform:rotate(-24deg) scale(1.12,.49)}.planet-glow{position:absolute;inset:12px;border-radius:50%;box-shadow:0 0 100px #32bdbd45}.tiny-star{position:absolute;color:#fae5b4}.st1{top:8%;left:16%}.st2{right:4%;top:63%}.st3{bottom:8%;left:9%}.home-bottom{display:grid;grid-template-columns:minmax(280px,440px) 1fr;gap:75px;align-items:center;padding:36px 0 95px}.home-about p{max-width:560px;color:#b4c4d9}.footer{border-top:1px solid #26354c;color:#758aa6;text-align:center;padding:21px 12px;font-size:.74rem}.heading-row{display:flex;align-items:center;justify-content:space-between;gap:15px}.heading-row h1{margin-bottom:7px}.pill{padding:5px 10px;background:#1a253a;border:1px solid #40516b;color:#d1ddef;border-radius:99px;white-space:nowrap;font-size:.64rem;font-weight:750}.pill.teal{border-color:#397e75;color:#87ebde;background:#143d3e}.world-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.world-card{overflow:hidden;border:1px solid #35445a;background:#121e32;border-radius:18px;transition:.2s}.world-card:hover{transform:translateY(-3px);border-color:#65cfc2;box-shadow:0 16px 40px #0005}.world-card-art{height:172px;position:relative;background:radial-gradient(ellipse at 49% 88%,#136579,#152546 48%,#0b1121 73%);display:flex;justify-content:center;align-items:center}.mini-planet{width:140px;height:140px;border-radius:50%;background:radial-gradient(circle at 33% 31%,#6ccece,#0b617c 48%,#0b1838 82%);box-shadow:inset -22px -18px 25px #040b20,0 0 35px #31bbb651}.mini-planet:before{content:"";display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(ellipse at 40% 29%,#7dc9a9 0 13%,transparent 16%),radial-gradient(ellipse at 62% 60%,#298e7e 0 18%,transparent 24%)}.world-year{position:absolute;right:13px;bottom:12px;font-size:.67rem;color:#cee9eb;letter-spacing:.12em}.world-card-content{padding:19px}.world-card-content p{font-size:.8rem;margin:9px 0 18px}.stat-row{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #34465e;padding:10px 0;font-size:.82rem}.stat-row strong{color:#b4e5dc}.game-shell{display:grid;grid-template-columns:minmax(0,1fr) 350px;min-height:calc(100vh - 130px);height:calc(100vh - 74px);max-height:1050px}.game-view{position:relative;min-width:0;background:radial-gradient(ellipse at center,#142a47,#040915 68%);overflow:hidden}#planetCanvas{width:100%;height:100%;display:block;cursor:grab;touch-action:none}#planetCanvas:active{cursor:grabbing}.game-sidebar{background:#0f1a2b;border-left:1px solid #34435a;overflow-y:auto;padding:21px 20px 55px}.back{display:inline-block;font-size:.78rem;color:#a9bfd0;margin:0 0 23px}.back:hover{color:#65e4d2}.game-sidebar h2{margin:0 0 3px;font-size:1.56rem}.game-top-left,.game-top-right,.game-bottom{position:absolute;z-index:1;display:flex;align-items:center;gap:9px}.game-top-left{top:20px;left:18px}.game-top-right{top:20px;right:18px;font-size:.69rem;color:#9dbac7;background:#08172ba8;border-radius:8px;padding:7px 10px}.game-bottom{bottom:15px;left:17px;right:17px;justify-content:space-between;font-size:.73rem;color:#a6c6d3}.game-bottom button{background:#0b1c30a8}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:19px 0 5px}.metrics>div{background:#17253a;border:1px solid #2b4057;border-radius:10px;padding:11px 8px;display:flex;flex-direction:column;gap:3px}.metrics strong{font-size:1.24rem;letter-spacing:-.05em;color:#efffff}.metrics span{font-size:.62rem;color:#a5b9cc}.section-header{margin-top:23px;margin-bottom:11px}.power-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.power-grid button,.ghost{background:#1b2c43;color:#d5ebef;border:1px solid #36536c;border-radius:9px;padding:10px 8px;font-size:.75rem;font-weight:720}.power-grid button:hover,.ghost:hover{background:#28455f;border-color:#65e0d1}.power-grid .danger-action{border-color:#74545a;color:#ffb7b7}.small.ghost{font-size:.68rem;padding:7px 10px}.danger-text{color:#f6a3a3}.game-sidebar select{margin:6px 0 8px;font-size:.81rem}.panel-mini{background:#142337;border:1px solid #304457;border-radius:11px;padding:11px;font-size:.75rem;line-height:1.55;color:#bed1e1}.panel-mini strong{color:#eaf9ff}.event-list{display:flex;flex-direction:column;gap:8px}.event{border-left:2px solid #4a817e;padding:1px 0 5px 10px;background:#11203655}.event .event-meta{color:#61d0c1;letter-spacing:.08em;font-size:.59rem;font-weight:800;text-transform:uppercase}.event p{margin:3px 0 0;font-size:.72rem;color:#c4d4df}.feedback{font-size:.74rem;border-radius:8px;color:#91dccd;min-height:0}.feedback:not(:empty){padding:9px 11px;margin-top:12px;background:#1a403b}.feedback.error{color:#fec8c8;background:#3a2529}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.81rem}th,td{text-align:left;padding:10px 12px;border-bottom:1px solid #34465b;white-space:nowrap}th{color:#8ed7c9;font-size:.69rem;letter-spacing:.04em}.admin-metrics{grid-template-columns:repeat(4,1fr);max-width:900px}.code,code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;background:#0c1729;color:#d7ddfa;border-radius:4px;padding:2px 5px}@media(max-width:1000px){.planet-showcase{opacity:.25;right:-40px}.game-shell{grid-template-columns:minmax(0,1fr) 315px}.world-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.topbar{padding:0 15px;height:65px}.topbar nav{gap:10px}.topbar nav .username,.topbar nav>a:first-child{display:none}.container{width:min(100% - 28px,1160px)}.home-hero{padding-top:45px;min-height:465px}.home-bottom{grid-template-columns:1fr;gap:24px}.planet-showcase{width:260px;height:260px;top:150px;right:-85px;opacity:.23}.home-hero h1{font-size:3.6rem}.form-grid{grid-template-columns:1fr}.world-grid{grid-template-columns:1fr}.game-shell{display:flex;flex-direction:column;height:auto;max-height:none;min-height:0}.game-view{height:min(65vh,540px);min-height:350px}.game-sidebar{overflow:visible;padding-bottom:25px}.game-top-right{font-size:.57rem;max-width:180px;right:9px}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-metrics{grid-template-columns:repeat(2,1fr)}.heading-row{align-items:flex-start;flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto;transition:none!important}}
/* v0.2: life observation, contextual camera, and admin maintenance */
.game-view-tools{position:absolute;z-index:3;bottom:56px;left:18px;display:flex;flex-wrap:wrap;gap:8px}
.view-control{background:#0b1b31e8;color:#c6ddeb;border:1px solid #36546a;border-radius:9px;padding:10px 13px;font-size:.76rem;font-weight:750;cursor:pointer}
.view-control.active{background:#16473f;border-color:#55d9c7;color:#a9fff0}
.life-float{position:absolute;z-index:2;bottom:108px;left:18px;border:1px solid #539b8a;background:#07192ee9;color:#e4fbf6;border-radius:10px;padding:9px 14px;pointer-events:none;display:flex;gap:12px;font-size:.76rem}
.life-float[hidden]{display:none}.life-float span{color:#9fdfd3}
.activity-counts{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}.activity-counts span{background:#102a39;border:1px solid #33546a;border-radius:7px;color:#d2ebe4;padding:5px 8px;font-size:.68rem}.activity-counts b{color:#81e0ce}
#lifeSearch{font-size:.78rem;padding:10px;margin-bottom:9px}.life-list{max-height:230px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;margin-bottom:11px}
.life-item{display:flex;gap:9px;align-items:center;text-align:left;background:#142338;border:1px solid #2b4055;border-radius:9px;color:#dcebf5;width:100%;cursor:pointer;padding:8px}.life-item:hover,.life-item:focus-visible{border-color:#53c6b7}.life-item.selected{border-color:#50d8c4;background:#183f42}
.life-avatar{width:32px;height:32px;border:1px solid #437d78;background:#123436;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#7decd7;flex-shrink:0}
.life-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}.life-copy b{font-size:.78rem}.life-copy small{font-size:.66rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#a3bdce}.life-age{font-size:.68rem;color:#a4d1ce}
.observer-title{font-size:.98rem;font-weight:800;color:#ecfaf6}.observer-title small{font-weight:500;color:#8ba9bc}.action-status{color:#82f0d7;margin:8px 0}.observer-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}.observer-stats span{display:flex;justify-content:space-between;gap:6px;font-size:.7rem}.observer-stats b{color:#e3f5ee}.observe-btn{width:100%;margin-top:9px}.observe-btn:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:760px){.game-view-tools{bottom:55px;left:10px}.view-control{padding:9px 10px}.life-float{left:10px;bottom:98px}.game-bottom{font-size:.61rem}}
.ops-tabs{display:flex;gap:7px;overflow-x:auto;border-bottom:1px solid #354960;padding:0 0 12px}.ops-tabs a{flex-shrink:0;padding:10px 12px;font-size:.75rem;border-radius:10px;color:#b1c8d7;background:#15243a;border:1px solid #2d425a}.ops-tabs a.active{color:#bff9ed;border-color:#4eaa9d;background:#1b4446}.ops-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ops-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.ops-metrics>div{padding:18px;border:1px solid #354b60;border-radius:13px;background:#132238;display:flex;flex-direction:column;gap:8px}.ops-metrics small{color:#a7bfd1}.ops-metrics strong{font-size:1.3rem;color:#dbfaf3}.admin-ops .stack{display:flex;flex-direction:column;gap:14px}.admin-ops .panel h2{margin:0}.admin-ops .btn,.admin-ops .ghost{cursor:pointer}.admin-ops input[type=file]{padding:9px}.ops-restore{margin-top:8px;max-width:315px;white-space:normal}.ops-restore summary{cursor:pointer;color:#e1b18d}.ops-restore form{margin-top:12px}.ops-restore input{font-size:.75rem}.admin-ops .table-wrap{max-width:100%;}.admin-ops td{max-width:360px;white-space:normal;overflow-wrap:anywhere}
@media(max-width:860px){.ops-columns{grid-template-columns:1fr}.ops-metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:450px){.ops-metrics{grid-template-columns:1fr 1fr}}

.ops-file-list{margin:10px 0;max-height:160px;overflow:auto;display:flex;gap:5px;flex-direction:column}.ops-file-list code{font-size:.72rem}.ops-retention{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.ops-retention label{max-width:220px}.ops-retention button{align-self:end}@media(max-width:760px){.topbar nav a[href*="maintenance.php"]{display:none}}

/* v0.3 — explicit click targets, selection markers and camera follow */
.creature-targets{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.creature-target{position:absolute;pointer-events:auto;transform:translate(-50%,-100%);border:1px solid #83ddd1;background:#051b2bde;backdrop-filter:blur(5px);color:#eafff9;padding:4px 8px 4px 6px;display:flex;align-items:center;gap:5px;border-radius:99px;font-size:.69rem;max-width:154px;box-shadow:0 3px 10px #000a;white-space:nowrap;line-height:1.2;cursor:pointer}
.creature-target .target-dot{width:8px;height:8px;border-radius:50%;background:#66e7cd;box-shadow:0 0 7px #41dfc7;flex-shrink:0}
.creature-target:hover,.creature-target:focus-visible{border-color:#fff3c2;background:#1b4148;z-index:4;outline-offset:3px}
.creature-target.selected{border-color:#f3cc7f;background:#49371fe6;color:#fff2d7;z-index:3;font-weight:800}
.creature-target.selected .target-dot{background:#f3cc7f;box-shadow:0 0 12px #f3cc7f}
.creature-target .target-name{overflow:hidden;text-overflow:ellipsis}
.life-float{max-width:min(480px,calc(100% - 30px));flex-wrap:wrap;align-items:center}
.life-float .life-context{width:100%;color:#b5cfe0;font-size:.69rem}
.observer-family{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 5px}.observer-family span{padding:4px 7px;border:1px solid #3d5c69;border-radius:6px;font-size:.66rem;color:#c4e5e5}
.observer-note{border-top:1px solid #2c4b5c;margin:9px 0 0;padding-top:8px;color:#c2d5e4;line-height:1.4}
@media(max-width:760px){.creature-target{padding:5px 7px;font-size:.65rem;max-width:105px}.game-top-right{display:none}.life-float{bottom:106px;max-width:calc(100% - 20px)}.view-control{font-size:.7rem}}

/* Observer is prioritized above God controls for one-click observation. */
.game-sidebar #creatureDetail{margin:10px 0}.game-sidebar .life-list{max-height:165px}.game-sidebar .observe-btn{margin-bottom:4px}

/* v0.4 — life routines, clickable daily timeline, household overview */
.day-observer{margin:12px 0 16px;padding:12px;border:1px solid #37576a;background:linear-gradient(145deg,#142b3e,#111d30);border-radius:14px}
.day-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.day-heading strong{font-size:.88rem;color:#a8f8e6}
.day-observer p{margin:5px 0 12px}.day-current{display:flex;justify-content:space-between;align-items:center;gap:9px;border-radius:10px;padding:9px;background:#0a1c30;margin-bottom:9px;font-size:.75rem}.day-current b{color:#edf8f2;text-align:right;font-size:.7rem}
.day-routine{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.day-slot{min-width:0;padding:7px 5px;border:1px solid #375063;background:#152b3e;border-radius:9px;text-align:left;color:#bcd7de;cursor:pointer}.day-slot:hover,.day-slot:focus-visible{border-color:#8ae1d4}.day-slot.active{border-color:#64d9c6;background:#1b4447;box-shadow:inset 0 0 0 1px #3f9d90}.day-slot strong,.day-slot span{display:block}.day-slot strong{font-size:.7rem}.day-slot span{font-size:.61rem;color:#91b2bd}.day-slot.active strong{color:#bcfff1}
.observer-routine-details{display:grid;gap:6px}.observer-routine-details .life-location{color:#b5dacc}
@media(max-width:760px){.day-routine{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* v0.5 — activity history and home inspection */
.game-view-tools{max-width:calc(100% - 36px)}
#enterHome:disabled{opacity:.42;cursor:not-allowed}
#enterHome:not(:disabled):hover{border-color:#e4c387;color:#ffe4aa}
.day-slot span{line-height:1.45}
.day-current{align-items:flex-start}
@media(max-width:760px){.game-view-tools{max-width:calc(100% - 20px)}.game-view-tools .view-control{padding:7px 8px}}

.day-decision-reason{color:#afcfda;background:#112337;border:1px solid #304c60;border-radius:8px;padding:8px 10px;margin:-2px 0 10px;font-size:.71rem;line-height:1.45}

/* v0.6: inspectable households, aspirations and routes; touch-friendly controls. */
.life-goal{padding:11px;margin:10px 0;background:#102d34;border:1px solid #315f62;border-radius:11px}
.life-goal-head{display:flex;justify-content:space-between;color:#b1f4e1;font-size:.75rem}
.life-goal p{color:#e9f8f5;font-size:.78rem;margin:7px 0}
.life-goal-track{width:100%;height:7px;background:#1c3c47;border-radius:12px;overflow:hidden}
.life-goal-track span{display:block;height:100%;background:linear-gradient(90deg,#2faac9,#78eed3);border-radius:12px}
.household-members{margin:8px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px}
.household-member{background:#10283c;border:1px solid #3a5872;border-radius:9px;text-align:left;padding:8px;min-height:52px;color:#e2f8f2;display:flex;flex-direction:column;gap:4px;cursor:pointer}
.household-member small{color:#a4c7d4;font-size:.65rem}
.household-member.current{border-color:#58cdbb;background:#123b47}
.household-member:hover,.household-member:focus-visible,.kin-link:focus-visible{outline:2px solid #6febd8;outline-offset:2px}
.kin-link{background:none;color:#76e8d4;border:0;cursor:pointer;text-decoration:underline}

/* v0.8 extended activity diary and growing social connections */
.day-routine{grid-template-columns:repeat(3,minmax(0,1fr));max-height:308px;overflow-y:auto;scrollbar-color:#386e71 transparent}.day-slot{min-height:53px}.bond-links{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:7px}.bond-links .kin-link{background:#193e45;border:1px solid #3c7c7a;border-radius:7px;padding:6px 8px;text-decoration:none;font-size:.72rem}.bond-links .kin-link:hover{background:#24575c}

/* v0.9 destination itinerary inspector */
.route-inspector{margin:.65rem 0;padding:.75rem;border:1px solid rgba(73,215,199,.24);border-radius:12px;background:rgba(23,69,76,.19)}
.route-inspector p{overflow-wrap:anywhere;line-height:1.5;margin:.4rem 0 .65rem}
.route-inspector button:disabled{opacity:.45;cursor:not-allowed}

/* v1.0.0: visual quality preference next to camera controls */
.graphics-control{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#c0cce0;white-space:nowrap}
.graphics-control select{padding:6px 11px;border:1px solid #456175;background:#0b1b31;color:#e4f9f7;border-radius:9px;min-width:105px}
.graphics-control select:focus-visible{outline:2px solid #62e5d5;outline-offset:2px}
.game-bottom{flex-wrap:wrap;gap:8px}
@media(max-width:660px){.graphics-control select{min-width:80px}.graphics-control{font-size:11px}}

/* v1.2 — premium illustrated 2D world and legible zoom controls */
.game-view{background:#143d52}
#planetCanvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}
#planetCanvas:active{cursor:grabbing}
.game-top-left .pill.teal{background:#103b35ee;color:#a9f3db;border-color:#4ca68b}
.game-view-tools{background:#092b35bb;backdrop-filter:blur(12px);border:1px solid #77a69c55;padding:6px;border-radius:15px;box-shadow:0 10px 35px #09213080}
.view-control{border-radius:10px}
.creature-target{box-shadow:0 3px 13px #102b3eaa;background:#092c35e8}
.game-bottom{background:linear-gradient(0deg,#092637de,#0926371c);padding:16px 18px}
.game-top-right{background:#092737bd;padding:7px 12px;border-radius:30px;border:1px solid #ffffff1c}
.game-view:after{content:'ILLUSTRATED WORLD  ·  SIMULATED LIFE';position:absolute;top:64px;left:19px;color:#edf8e8b3;font-size:9px;letter-spacing:.18em;font-weight:800;pointer-events:none;text-shadow:0 2px 8px #173e3b;}
@media(max-width:760px){.game-view:after{display:none}.game-view-tools{bottom:70px;gap:3px}.game-view-tools .view-control{font-size:.66rem;padding:7px 8px}.game-top-right{display:none}}

/* Selected creatures are immediately visible in the top of the sidebar. */
.game-sidebar #creatureDetail{max-height:min(48vh,460px);overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#3e847b #132a37;border:1px solid #3e746e;background:#122e39;border-radius:13px;padding:12px;margin:4px 0 12px;}
.game-sidebar #creatureDetail:has(.observer-title){border-color:#74cdb4;box-shadow:0 5px 24px #07271b38;}
.game-sidebar .day-observer{margin-top:15px}
/* Visual brand consistency: a miniature illustrated village replaces the former 3D planet hero. */
.home-hero .planet-showcase{top:90px;right:4px;width:425px;height:320px;border-radius:22px;border:5px solid #83af92;background:#527d64 url('world2d-hero.svg') center/cover no-repeat;transform:rotate(4deg);box-shadow:0 22px 55px #020d178f,0 0 0 8px #7da98520;opacity:1;overflow:hidden}
.home-hero .planet-showcase>*{display:none}
.home-hero .planet-showcase:after{content:'MYWORLD · A LIVING 2D WORLD';position:absolute;left:13px;bottom:13px;background:#10343ddc;border:1px solid #a9e1b080;border-radius:7px;padding:7px 12px;color:#eaf9e7;font:700 12px/1.4 system-ui;letter-spacing:.1em}
.world-card-art{background:linear-gradient(140deg,#173f47,#234e46)}
.world-card-art .mini-planet{border-radius:12px;width:205px;height:132px;background:#719a62 url('world2d-hero.svg') center/cover no-repeat;box-shadow:0 8px 22px #07162466;transform:rotate(-2deg)}
.world-card-art .mini-planet:before{display:none}
@media(max-width:1000px){.home-hero .planet-showcase{right:0;opacity:.25}}
@media(max-width:650px){.home-hero .planet-showcase{width:270px;height:205px;top:170px;right:-75px;opacity:.20}}

/* MyWorld 1.4: grounded settlement progress cards, keyboard-accessible camera jump */
.village-pulse{display:grid;gap:10px;margin:12px 0 16px}
.village-card{border:1px solid #47617b;background:#11233b;border-radius:13px;padding:13px;display:grid;gap:9px}
.village-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.village-card-head strong{color:#d9f4df;font-size:.95rem}
.village-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.village-grid span{font-size:.77rem;color:#afc2d0;display:flex;justify-content:space-between;gap:8px}
.village-grid b{color:#e9f4f5;font-variant-numeric:tabular-nums}
.village-build{height:7px;border-radius:9px;background:#21374b;overflow:hidden}
.village-build span{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#5ec7a7,#c5d790)}
.village-card small{font-size:.72rem;line-height:1.45}

/* v1.5 — readable universe time and server-backed speed controller */
.game-top-left{z-index:4;flex-wrap:wrap;max-width:calc(100% - 30px)}
.sim-clock-face{background:#0a2635ed!important;border-color:#78e2cc!important;color:#f2fff7!important;font-size:.76rem!important;font-variant-numeric:tabular-nums;padding:7px 12px!important;box-shadow:0 8px 25px #09282b90}
.time-control-panel{position:absolute;z-index:4;left:18px;top:70px;max-width:min(440px,calc(100% - 36px));padding:11px 13px 10px;border-radius:16px;background:#081c2ce8;box-shadow:0 12px 32px #03131988;border:1px solid #447c83;backdrop-filter:blur(12px);color:#e8f6f3}
.time-panel-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:8px;font-size:.69rem}
.time-panel-title{letter-spacing:.14em;color:#7ee1d5;font-weight:800}
.clock-cycle{font-size:.7rem;color:#c6dfd9}
.time-control-actions{display:flex;flex-wrap:wrap;gap:5px}
.time-control-actions .time-speed{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:43px;margin:0;background:#172d43;border:1px solid #456178;border-radius:8px;color:#ddf5f1;padding:8px 10px;font-size:.75rem;font-weight:760}
.time-control-actions .time-speed:first-child{min-width:72px}
.time-control-actions .time-speed:hover{border-color:#7de9d5;background:#234359}
.time-control-actions .time-speed.active{background:#69e0ce;color:#06282f;border-color:#8ff3e2;box-shadow:0 0 0 2px #5bd4bd22}
.clock-caption{font-size:.67rem;color:#a8c9d4;margin-top:7px;font-variant-numeric:tabular-nums}
.clock-sidebar-info{font-size:.76rem;color:#9fe5d8;padding:10px 12px;background:#163344;border-radius:9px;border:1px solid #345d69;margin-bottom:8px}
@media(max-width:760px){.game-top-left{top:8px;left:9px}.sim-clock-face{font-size:.63rem!important}.time-control-panel{top:45px;left:9px;max-width:calc(100% - 18px);padding:8px 9px}.time-control-actions{gap:3px}.time-control-actions .time-speed{font-size:.69rem;min-width:39px;padding:7px 8px}.time-control-actions .time-speed:first-child{min-width:64px}.clock-cycle,.time-panel-title{font-size:.59rem}.clock-caption{font-size:.59rem}.game-view-tools{bottom:85px}.game-bottom{padding:11px 10px}}

/* MyWorld 1.6 wildlife: responsive summon controls and animal observation. */
.animal-section{margin:16px 0;padding:13px;background:#0e2937;border:1px solid #34596a;border-radius:14px}
.animal-section select{width:100%;background:#112e40;color:#e8f9ef;border:1px solid #49798a;border-radius:8px;padding:9px;margin:6px 0 10px}
.animal-summon-row{display:flex;align-items:flex-end;gap:10px;margin-bottom:8px}.animal-summon-row label{width:115px;flex-shrink:0}.animal-summon-row button{flex:1;min-height:41px;background:#4cc9a6;color:#06272b;border-radius:9px;font-weight:800;border:0;cursor:pointer}
.animal-summon-row button:disabled{opacity:.55;cursor:not-allowed}.animal-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-height:245px;overflow:auto;margin-top:8px}
.animal-item{display:flex;align-items:center;gap:8px;background:#163547;color:#d9f5ed;border:1px solid #345e6b;padding:8px;text-align:left;border-radius:9px;cursor:pointer;min-width:0}
.animal-item.selected,.animal-item:hover{border-color:#8be2c8;background:#20515a}.animal-item>span:first-child{font-size:23px}.animal-item strong,.animal-item small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.animal-item strong{font-size:.73rem}.animal-item small{font-size:.64rem;color:#a8d2ca}
@media(max-width:480px){.animal-list{grid-template-columns:1fr}}

/* v1.7: sourced livestock production, accessible resource counters */
.animal-resources{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:10px 0}
.animal-resources span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:9px 4px;background:#163b42;border:1px solid #3e7770;border-radius:9px;color:#d8f3e8;font-size:.73rem}
.animal-resources b{font-size:1rem;color:#b8f4d9;font-variant-numeric:tabular-nums}

/* v1.8: readable, compact animal-village economy history */
.economy-panel{margin-top:12px;padding:12px;border:1px solid rgba(113,215,190,.24);border-radius:12px;background:rgba(10,35,43,.45)}
.economy-panel>strong{display:block;margin-bottom:5px;color:#b5f3dc}
.economy-recent{margin-top:10px;display:grid;gap:6px;max-height:230px;overflow-y:auto}
.economy-entry{padding:8px 9px;border-radius:8px;background:rgba(255,255,255,.035);font-size:.79rem;line-height:1.4}
.economy-entry p{margin:3px 0 0;color:#b3cbce}

/* MyWorld 2.1: self-hosted illustrated portraits drawn from the new 96px sprite atlas. */
.animal-item .animal-portrait{display:block;width:48px;height:48px;min-width:48px;flex:none;background-image:url("sprites/animals-v21.png?v=2.1.0");background-repeat:no-repeat;background-size:768px 672px;background-color:#244a50;border:1px solid #3a6267;border-radius:9px}

/* MyWorld 2.5 — anchored homes and divine placement */
.animal-placement-steps{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0;padding:10px;background:#102b37;border:1px solid #36616b;border-radius:10px}
.animal-placement-steps .ghost{font-weight:750;flex:1 1 160px}
.animal-placement-steps p{flex:1 1 100%;margin:0;color:#bde3da}
.house-summary{margin-top:10px;border-color:#5c9884}
.house-summary .kin-link{display:block;margin:5px 0;max-width:100%;text-align:left}
#summonAnimal:disabled{opacity:.50;cursor:not-allowed}

/* MyWorld v3.1 — retraceable floating windows and sections */
.fold-section{min-width:0}.fold-section>.eyebrow.section-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.fold-toggle,.float-toggle{font:700 .7rem system-ui;color:#c9f5e7;background:#143749;border:1px solid #538b8c;border-radius:9px;padding:5px 10px;margin-left:auto;min-height:30px;min-width:30px;cursor:pointer}.fold-toggle:hover,.float-toggle:hover{background:#235365}.fold-toggle:focus-visible,.float-toggle:focus-visible{outline:2px solid #72efcb;outline-offset:2px}.fold-closed{margin-bottom:10px}.fold-body[hidden],.float-fold-body[hidden]{display:none!important}.fold-closed>.eyebrow.section-header{margin-bottom:4px}.game-sidebar .game-fold-group{margin:5px 0}.float-fold-body{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0}.time-control-panel .float-fold-body{display:block}.time-control-panel .float-fold-body>.time-control-actions{display:flex}.time-control-panel.is-retracted{padding:7px 9px}.time-control-panel.is-retracted .time-panel-head{margin:0}.game-view-tools .float-fold-body{display:contents}.game-view-tools.is-retracted .float-fold-body{display:none}.game-view-tools .float-toggle,.game-bottom .float-toggle{margin:0;white-space:nowrap}.game-bottom .float-fold-body{display:flex;flex:1;min-width:0;justify-content:space-between;gap:10px;flex-wrap:wrap}.game-bottom.is-retracted{right:auto;max-width:calc(100% - 24px)}.game-bottom.is-retracted .float-fold-body{display:none}.game-bottom:not(.is-retracted) .float-toggle{padding:5px 8px}.game-top-right .float-fold-body{display:contents}.game-top-right.is-retracted .float-fold-body{display:none}.game-top-right .float-toggle{margin:0}.life-float .float-toggle{display:inline-block;float:right;margin-left:8px}.life-float.is-retracted>:not(strong):not(.float-toggle){display:none!important}.life-float.is-retracted{padding:7px 10px;max-width:250px}.scene-replay-toggle{position:absolute;z-index:7;right:20px;top:115px;max-width:160px;border-radius:9px;background:#082a37ed;color:#dff9e9;border:1px solid #77b89a;padding:8px 11px;font-size:.75rem;font-weight:800;box-shadow:0 8px 22px #0017}.scene-replay-toggle[hidden]{display:none}.float-fold-body>.view-control{flex-shrink:0}@media(max-width:760px){.game-top-right.is-retracted{display:flex;right:8px;top:8px}.game-view-tools{max-width:calc(100% - 20px)}.game-view-tools .float-fold-body{display:flex;flex-wrap:wrap;gap:3px}.time-control-panel.is-retracted{width:auto}.game-bottom{gap:7px}.scene-replay-toggle{right:9px;top:156px}.life-float.is-retracted{max-width:205px}}

@media(max-width:760px){.game-top-right.retractable-float{display:flex;top:8px;right:8px;max-width:125px}.game-top-right.retractable-float:not(.is-retracted){max-width:180px}}
.life-float .float-toggle{pointer-events:auto;position:relative;z-index:6}
.game-bottom.retractable-float{z-index:6}
/* Float separation: every retract control remains clickable, even on narrow screens. */
.game-view-tools.retractable-float{bottom:98px}
.game-bottom.retractable-float{z-index:4}
.game-bottom.retractable-float>.float-toggle{order:2;margin-left:auto}
.game-bottom.retractable-float>.float-fold-body{order:1}
.life-float.retractable-float{bottom:164px;z-index:5}
@media(max-width:760px){.game-view-tools.retractable-float{bottom:134px}.life-float.retractable-float{bottom:218px}.game-bottom.retractable-float{bottom:12px}}
.game-bottom.retractable-float{pointer-events:none}
.game-bottom.retractable-float .float-toggle,.game-bottom.retractable-float button,.game-bottom.retractable-float select,.game-bottom.retractable-float label{pointer-events:auto}
@media(max-width:760px){.game-top-right.retractable-float{top:175px;right:8px}.scene-replay-toggle{top:218px}}

.game-top-left.retractable-float{gap:6px}.game-top-left .float-fold-body{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.game-top-left .float-toggle{margin:0}.game-top-left.is-retracted .float-fold-body{display:none}@media(max-width:760px){.game-top-left .float-fold-body{max-width:calc(100% - 20px)}.game-top-left.retractable-float{z-index:5}}
