html{min-height:100%}:root{--text:#17314e;--muted:#17314eb8;--label-bg:#ffffffeb;--label-text:#163355;--hud-bg:linear-gradient(180deg, #fffcf6f5, #ffefd5f5);--hud-border:#fffffff0;--shadow:0 20px 48px #1f37562e;--deep-shadow:0 18px 0 #17314e24, 0 28px 54px #1f375638;--accent-yellow:#ffd34d;--accent-orange:#ff9d3f;--accent-blue:#3e79d9;--accent-navy:#17314e;--accent-mint:#8fe07a;--sans:"Hiragino Maru Gothic ProN", "Hiragino Sans", "Yu Gothic", "Avenir Next", system-ui, sans-serif;--mono:"SFMono-Regular", ui-monospace, monospace;color:var(--text);font-family:var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(#dff1ff 0%,#fef8ea 100%)}*{box-sizing:border-box}body{background:radial-gradient(circle at 18% 18%,#ffdc7861,#0000 20%),radial-gradient(circle at 82% 14%,#89c2ff57,#0000 18%),linear-gradient(#dff1ff 0%,#fef8ea 100%);min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}#root{min-height:100dvh}.app-shell{background:radial-gradient(circle at 20% 20%,#ffffff6b,#0000 18%),radial-gradient(circle at 76% 12%,#ffffff3d,#0000 16%);min-height:100dvh}.stage{height:100dvh;min-height:100dvh;padding:18px;position:relative;overflow:hidden}.stage:before,.stage:after{z-index:0;content:"";pointer-events:none;border-radius:999px;position:absolute}.stage:before{filter:blur(1px);background:radial-gradient(circle,#ffe88aeb 0 36%,#ffc34d6b 36% 66%,#0000 67%);width:140px;height:140px;top:82px;right:74px}.stage:after{background:radial-gradient(circle,#7fd4ff47,#0000 68%);width:120px;height:120px;bottom:120px;left:-32px}.hud{z-index:5;border:3px solid var(--hud-border);background:var(--hud-bg);box-shadow:var(--deep-shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:28px 28px 34px 20px;flex-direction:column;align-items:flex-start;gap:.28rem;padding:.82rem 1rem 1rem;display:inline-flex;position:absolute}.hud-primary{max-width:min(20rem,100vw - 8rem);bottom:26px;left:26px}.hud h1,.hud span,.hud p{margin:0}.hud-object-name{color:var(--accent-navy);letter-spacing:.01em;font-size:clamp(1.45rem,2.6vw,2.1rem);font-weight:900;line-height:1}.hud-measure,.scroll-hint,.axis-range,.axis-tick-label,.axis-vertical-label{color:var(--accent-navy)}.hud-measure{font-family:var(--mono);background:#ffffffd1;border:2px solid #17314e1f;border-radius:999px;padding:.24rem .62rem;font-size:.78rem;font-weight:700}.explorer-frame{height:100%;min-height:100%;box-shadow:var(--deep-shadow);background:linear-gradient(#dff1ff 0%,#fef8ea 100%);border:4px solid #ffffffb8;border-radius:38px;position:relative;overflow:hidden}.explorer-canvas{cursor:grab;touch-action:none;height:100%;min-height:100%;transition:background .22s;position:relative;overflow:hidden}.explorer-canvas:active{cursor:grabbing}.explorer-canvas.is-micro{background:radial-gradient(circle at 50% 30%,#ffffff8f,#0000 22%),repeating-linear-gradient(90deg,#ffedc28f 0 24px,#f4e4c138 24px 56px),linear-gradient(#fbf3df 0%,#f3e8d1 58%,#e3d8bb 100%)}.explorer-canvas.is-terrestrial{background:radial-gradient(circle at 78% 14%,#ffe4826b,#0000 18%),linear-gradient(#70befff5 0%,#a9dfffeb 36%,#e3f6ebe0 72%,#7dad5fbd 72.5%,#608d47eb 100%)}.explorer-canvas.is-planetary{background:radial-gradient(circle at 20% 16%,#ffd6806b,#0000 16%),radial-gradient(circle at 74% 14%,#ff946447,#0000 14%),linear-gradient(#412f20d1 0%,#7954329e 34%,#b2885470 56%,#1d2238f5 100%)}.explorer-canvas.is-deep-space{background:radial-gradient(circle at 24% 18%,#829aff57,#0000 18%),radial-gradient(circle at 74% 18%,#ff84583d,#0000 14%),radial-gradient(circle at 50% 60%,#6c38b22e,#0000 22%),linear-gradient(#081121 0%,#10203a 54%,#111a34 100%)}.explorer-atmosphere{opacity:.9;pointer-events:none;background:radial-gradient(circle at 50% 14%,#fff3,#0000 24%),linear-gradient(90deg,#ffffff12,#0000 28% 72%,#ffffff0d);animation:16s linear infinite atmosphereDrift;position:absolute;inset:0}.explorer-top-strip{z-index:4;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(#fffffff2,#f0f6ffdb);border:3px solid #ffffffc2;border-radius:999px;align-items:center;gap:10px;max-width:calc(100vw - 36px);padding:10px 18px;display:inline-flex;position:absolute;top:12px;left:50%;overflow-x:auto;transform:translate(-50%);box-shadow:0 18px 40px #1f37562e}.explorer-top-strip::-webkit-scrollbar{display:none}.top-strip-item{cursor:pointer;opacity:.72;background:#ffffff4d;border:0;border-radius:16px;place-items:center;width:44px;height:44px;padding:0;transition:transform .16s,opacity .16s,box-shadow .16s,background .16s;display:grid;overflow:hidden}.top-strip-item.is-selected{opacity:1;background:linear-gradient(#ffe893f5,#ffb05deb);box-shadow:inset 0 0 0 2px #ffffffeb,0 0 0 3px #17314e29,0 10px 20px #ff844257}.top-strip-item:hover{opacity:.96;transform:translateY(-2px)scale(1.04)}.top-strip-image,.top-strip-fallback{width:100%;height:100%}.top-strip-image{object-fit:contain;padding:2px}.top-strip-fallback{color:#181a1fd1;background:#ffffff8a;place-items:center;font-size:.74rem;font-weight:800;display:grid}.top-strip-fallback.is-earth,.top-strip-fallback.is-moon,.top-strip-fallback.is-mercury,.top-strip-fallback.is-mars,.top-strip-fallback.is-jupiter,.top-strip-fallback.is-saturn{border-radius:999px}.top-strip-fallback.is-earth{background:radial-gradient(circle at 30% 30%,#66d3ff 0%,#4f7cff 34%,#0e324f 100%)}.top-strip-fallback.is-moon{background:radial-gradient(circle at 32% 32%,#efefed 0%,#b4b4b0 45%,#7a7d87 100%)}.top-strip-fallback.is-mercury{background:radial-gradient(circle at 32% 32%,#dad7d0 0%,#9a968e 45%,#5f605f 100%)}.top-strip-fallback.is-mars{background:radial-gradient(circle at 32% 32%,#f7b269 0%,#cb6134 42%,#6d2615 100%)}.top-strip-fallback.is-jupiter{background:linear-gradient(#e6d7ba 0 18%,#c99464 18% 30%,#ecd8b7 30% 46%,#b96e3f 46% 58%,#f1e1be 58% 72%,#c3814c 72% 100%)}.top-strip-fallback.is-saturn{background:radial-gradient(circle,#e7d6b5 0%,#be9765 56%,#8d6848 100%)}.axis-vertical{background:linear-gradient(#ffffffb8,#17314e70);border-radius:999px;width:4px;position:absolute;top:72px;bottom:92px;left:42px;box-shadow:0 0 0 1px #17314e24}.axis-vertical-label{z-index:3;color:var(--accent-navy);background:linear-gradient(#ffd66bfa,#ffae59f0);border:2px solid #ffffffd6;border-radius:999px;padding:.34rem .54rem;font-size:.74rem;font-weight:900;position:absolute;top:50%;left:16px;transform:translate(-50%,-50%)rotate(-90deg)}.stage-surface{position:absolute;inset:0}.stage-object{left:var(--object-center-x);bottom:calc(100% - var(--object-floor-y));width:var(--object-width);height:var(--object-height);z-index:var(--object-z-index);cursor:pointer;background:0 0;border:0;padding:0;transition:left .18s,width .18s,height .18s;position:absolute;transform:translate(-50%)}.stage-label-layer{z-index:7;pointer-events:none;position:absolute;inset:0}.stage-object-image,.stage-object-fallback{bottom:var(--object-offset-y);object-fit:contain;object-position:bottom center;filter:drop-shadow(0 18px 20px #0d0f1224)drop-shadow(0 36px 38px #0d0f1224);-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;position:absolute;left:0}.stage-object-label{left:var(--label-center-x);bottom:var(--label-bottom);z-index:2;background:var(--label-bg);color:var(--label-text);white-space:nowrap;border:2px solid #ffffffe6;border-radius:999px 999px 16px;padding:.34rem .6rem;font-size:clamp(.76rem,.92vw,1rem);font-weight:900;line-height:1;transition:transform .18s,opacity .18s;position:absolute;transform:translate(-50%);box-shadow:0 10px 24px #17314e29}.stage-object-fallback{display:block}.stage-object-fallback.is-dna{background-color:#0000;background-image:linear-gradient(130deg,#0000 24%,#5f4d43eb 25%,#0000 26%),linear-gradient(50deg,#0000 24%,#5f4d43eb 25%,#0000 26%);background-position:0 0,0 0;background-repeat:repeat-y;background-size:100% 14%;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box}.stage-object-fallback.is-average-human{clip-path:polygon(42% 0%,58% 0%,62% 8%,60% 22%,70% 56%,60% 100%,48% 100%,40% 66%,34% 100%,22% 100%,28% 56%,40% 22%,38% 8%);background:radial-gradient(circle at 50% 12%,#0e0f12fa 0 16%,#0000 17%),linear-gradient(#0000 0 22%,#0e0f12fa 22% 72%,#0000 72% 100%)}.stage-object-fallback.is-bee{clip-path:ellipse(48% 38% at 52% 52%);background:radial-gradient(circle at 22% 44%,#ffffffbf 0 18%,#0000 19%),radial-gradient(circle at 40% 26%,#ffffffad 0 18%,#0000 19%),linear-gradient(90deg,#2f251f 0 16%,#f2c94c 16% 32%,#2f251f 32% 48%,#f2c94c 48% 64%,#2f251f 64% 80%,#e59e22 80% 100%);border-radius:999px}.stage-object-fallback.is-pencil{background:linear-gradient(90deg,#ddbf59 0 78%,#f1d7b9 78% 90%,#3b352f 90% 100%);border-radius:999px}.stage-object-fallback.is-cat{clip-path:polygon(14% 68%,18% 42%,30% 24%,34% 8%,46% 22%,56% 12%,62% 24%,78% 42%,86% 64%,74% 78%,56% 82%,44% 86%,26% 86%,12% 80%);background:linear-gradient(#59544cf0,#28231ffa)}.stage-object-fallback.is-bicycle{background:radial-gradient(circle at 18% 74%,#0000 0 23%,#2e3338fa 24% 29%,#0000 30%),radial-gradient(circle at 82% 74%,#0000 0 23%,#2e3338fa 24% 29%,#0000 30%),linear-gradient(135deg,#0000 0 34%,#2e3338fa 35% 38%,#0000 39%),linear-gradient(45deg,#0000 0 43%,#2e3338fa 44% 47%,#0000 48%),linear-gradient(90deg,#0000 0 46%,#2e3338fa 47% 50%,#0000 51%)}.stage-object-fallback.is-ostrich{clip-path:polygon(50% 0%,56% 0%,58% 18%,60% 26%,78% 38%,88% 58%,74% 66%,64% 60%,60% 100%,54% 100%,48% 66%,36% 100%,28% 100%,36% 60%,34% 34%,44% 18%);background:radial-gradient(circle at 42% 24%,#171719fa 0 10%,#0000 11%),linear-gradient(#0000 0 18%,#171719fa 18% 100%)}.stage-object-fallback.is-giraffe{clip-path:polygon(54% 0%,60% 0%,62% 18%,74% 34%,86% 52%,74% 60%,62% 56%,60% 100%,52% 100%,46% 68%,38% 100%,30% 100%,36% 64%,38% 38%,48% 18%);background:radial-gradient(circle at 58% 8%,#bc8f4cfa 0 10%,#0000 11%),linear-gradient(#0000 0 12%,#bc8f4cfa 12% 100%)}.stage-object-fallback.is-airbus-a380{background-color:#0000;background-image:linear-gradient(90deg,#0000 0 6%,#ebf1f7fa 6% 86%,#0000 86%),linear-gradient(#0000 0 40%,#4b70b0eb 40% 60%,#0000 60%),linear-gradient(135deg,#0000 35%,#ebf1f7fa 36% 54%,#0000 55%),linear-gradient(45deg,#0000 35%,#ebf1f7fa 36% 54%,#0000 55%);background-position:50%;background-repeat:repeat,repeat,repeat,repeat;background-size:100% 100%;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border-radius:999px 999px 24px 24px}.stage-object-fallback.is-city-bus{background:linear-gradient(#355b9cfa 0 72%,#293240fa 72% 100%),linear-gradient(90deg,#ffffffd1 12%,#0000 12% 18%,#ffffffd1 18% 26%,#0000 26% 32%,#ffffffd1 32% 40%,#0000 40% 46%,#ffffffd1 46% 54%,#0000 54% 60%,#ffffffd1 60% 68%,#0000 68% 74%,#ffffffd1 74% 82%,#0000 82%);border-radius:18px 18px 10px 10px}.stage-object-fallback.is-fire-truck{background:linear-gradient(#bf2720fa 0 72%,#3a2b2bfa 72% 100%),linear-gradient(90deg,#ffffffd6 10%,#0000 10% 16%,#ffffffd6 16% 24%,#0000 24% 32%,#ffffffd6 32% 40%,#0000 40% 48%,#ffffffd6 48% 56%,#0000 56% 64%,#ffffffd6 64% 72%,#0000 72%);border-radius:18px 18px 10px 10px}.stage-object-fallback.is-blue-whale{clip-path:polygon(0% 54%,12% 44%,28% 34%,52% 30%,70% 34%,84% 40%,94% 34%,100% 42%,94% 50%,100% 60%,92% 66%,86% 60%,72% 66%,46% 72%,20% 68%,8% 64%);background:radial-gradient(circle at 84% 56%,#ffffff38 0 6%,#0000 7%),linear-gradient(#4f7396 0%,#2f526f 50%,#1a2736 100%)}.stage-object-fallback.is-statue-of-liberty{clip-path:polygon(44% 0%,56% 0%,60% 18%,70% 26%,66% 46%,76% 72%,62% 100%,38% 100%,28% 72%,36% 46%,34% 26%,40% 18%);background:radial-gradient(circle at 50% 10%,#6a8874f5 0 10%,#0000 11%),linear-gradient(#83a48ff0,#57715ffa)}.stage-object-fallback.is-iss{clip-path:polygon(0% 36%,26% 36%,26% 24%,38% 24%,38% 42%,62% 42%,62% 24%,74% 24%,74% 36%,100% 36%,100% 64%,74% 64%,74% 76%,62% 76%,62% 58%,38% 58%,38% 76%,26% 76%,26% 64%,0% 64%);background:linear-gradient(90deg,#406cb0f5 0 24%,#dee3eaf5 24% 38%,#406cb0f5 38% 62%,#dee3eaf5 62% 76%,#406cb0f5 76% 100%)}.stage-object-fallback.is-soccer-field{background:linear-gradient(#46834cf5,#305e38fa),linear-gradient(90deg,#0000 0 49%,#ffffffc7 49% 51%,#0000 51%),linear-gradient(#0000 0 4%,#ffffffb3 4% 6%,#0000 6% 94%,#ffffffb3 94% 96%,#0000 96%);border-radius:10px}.stage-object-fallback.is-eiffel-tower{clip-path:polygon(49% 0%,54% 0%,61% 20%,78% 100%,62% 100%,50% 58%,38% 100%,22% 100%,39% 20%);background:linear-gradient(#4936222e,#493622fa)}.stage-object-fallback.is-burj-khalifa{clip-path:polygon(46% 0%,54% 0%,56% 14%,60% 26%,66% 42%,62% 62%,70% 100%,30% 100%,38% 62%,34% 42%,40% 26%,44% 14%);background:linear-gradient(#d2e2f7e6,#8ca6cdf5 40%,#50698ffa 100%)}.stage-object-fallback.is-great-pyramid{clip-path:polygon(0% 100%,50% 10%,100% 100%);background:linear-gradient(#e6c484f5,#b1884efa)}.stage-object-fallback.is-one-world-trade-center{clip-path:polygon(44% 0%,56% 0%,60% 14%,62% 34%,64% 58%,68% 100%,32% 100%,36% 58%,38% 34%,40% 14%);background:linear-gradient(#d8e4f8eb,#84a0cbf5 42%,#48608dfa 100%)}.stage-object-fallback.is-mount-everest{clip-path:polygon(0% 100%,20% 58%,34% 64%,52% 18%,70% 52%,100% 100%);background:linear-gradient(#fffffff2 0 18%,#657a97eb 18% 42%,#425673fa 42% 100%)}.stage-object-fallback.is-earth,.stage-object-fallback.is-moon,.stage-object-fallback.is-mercury,.stage-object-fallback.is-mars,.stage-object-fallback.is-jupiter,.stage-object-fallback.is-saturn{border-radius:999px}.stage-object-fallback.is-earth{background:radial-gradient(circle at 30% 30%,#4de0ff 0%,#2a7bf5 32%,#0c315e 100%)}.stage-object-fallback.is-moon{background:radial-gradient(circle at 32% 32%,#f0f0ec 0%,#b7b8b5 44%,#757983 100%)}.stage-object-fallback.is-mercury{background:radial-gradient(circle at 32% 32%,#dbd7ce 0%,#9e9b93 44%,#666764 100%)}.stage-object-fallback.is-mars{background:radial-gradient(circle at 32% 32%,#f8b06c 0%,#d06a3b 42%,#722814 100%)}.stage-object-fallback.is-jupiter{background:linear-gradient(#e7d8bc 0 18%,#c48a56 18% 28%,#eadbb9 28% 44%,#bb6e40 44% 54%,#f3e3c3 54% 70%,#cb8854 70% 100%)}.stage-object-fallback.is-saturn{background:radial-gradient(circle,#e6d7b9 0%,#c89f6f 54%,#8d6846 100%)}.measure-guide{pointer-events:none;position:absolute}.measure-guide.is-selected{background:linear-gradient(90deg,#ffb05deb,#ffd66beb);box-shadow:0 0 0 2px #ffffff8f}.measure-guide.is-width{left:calc(var(--measure-center-x) - var(--measure-width) / 2);width:var(--measure-width);top:var(--measure-y);border-radius:999px;height:5px}.axis-bottom{height:92px;position:absolute;bottom:0;left:42px;right:0}.axis-line-horizontal{background:linear-gradient(90deg,#ffffffd1,#17314e66);border-radius:999px;height:4px;position:absolute;top:0;left:0;right:0;box-shadow:0 0 0 1px #17314e1f}.axis-tick{background:#17314e75;width:2px;height:20px;position:absolute;top:0}.axis-tick-label{color:#fffbf5f0;font-family:var(--mono);background:#17314ebd;border:2px solid #ffffffc2;border-radius:999px;padding:.18rem .38rem;font-size:.72rem;font-weight:700;position:absolute;top:20px;left:50%;transform:translate(-50%)}.axis-range{color:var(--accent-navy);font-family:var(--mono);background:linear-gradient(#ffd66bfa,#ffae59f5);border:2px solid #ffffffd6;border-radius:999px;padding:.32rem .68rem;font-size:.74rem;font-weight:900;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.scroll-hint{z-index:2;color:#fffbf5eb;letter-spacing:.02em;background:#17314eb3;border:2px solid #ffffffbd;border-radius:999px;padding:.3rem .62rem;font-size:.7rem;font-weight:800;position:absolute;bottom:18px;right:20px}@keyframes atmosphereDrift{0%{transform:translate(0,0)}50%{transform:translate(16px)}to{transform:translate(0,0)}}@media (width<=900px){.stage{padding:12px}.explorer-frame,.explorer-canvas{border-radius:28px;height:100%;min-height:100%}.explorer-top-strip{gap:6px;max-width:calc(100vw - 32px);padding:8px 10px;overflow-x:auto}.top-strip-item{flex:none;width:38px;height:38px}.hud-primary{border-radius:24px;max-width:none;padding:.68rem .82rem .78rem;bottom:14px;left:14px;right:14px}.hud-object-name{font-size:1.12rem}.hud-measure{font-size:.7rem}.axis-vertical,.axis-bottom{left:36px}.axis-range,.axis-tick-label,.scroll-hint{font-size:.64rem}.stage-object-label{padding:.28rem .5rem;font-size:.64rem}}
