@font-face{font-family:ui;src:local('Avenir Next')}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:ui,-apple-system,BlinkMacSystemFont,'Helvetica Neue','Noto Sans',sans-serif;color:#e5eadf;background:#101d20;font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #66777866;background:#15272be6;border-radius:7px;padding:11px 15px;backdrop-filter:blur(12px)}button:hover{background:#2a3c3e;border-color:#a3ba9b}button:focus-visible,a:focus-visible{outline:2px solid #d5e5a6;outline-offset:4px}button:disabled{opacity:.5;cursor:default}button[hidden],[hidden]{display:none!important}#app,#viewport{position:absolute;inset:0}#viewport{touch-action:none}canvas{display:block;width:100%;height:100%}header{position:absolute;top:0;left:0;right:0;padding:28px 32px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.brand{color:#e9f0e4;text-decoration:none;font-size:12px;letter-spacing:.2em;font-weight:600;pointer-events:auto}.brand span{font-size:11px;letter-spacing:.08em;color:#98ada8;margin-left:18px}.quiet{border:0;background:transparent;font-size:24px;padding:0 5px;pointer-events:auto}.intro{position:absolute;top:112px;left:32px;max-width:340px;pointer-events:none;text-shadow:0 2px 12px #101d20}.eyebrow{font-size:10px;letter-spacing:.21em;color:#a6b9a1;font-weight:600}h1{font-size:30px;font-weight:450;letter-spacing:.05em;margin:12px 0 12px}p{color:#adbfbb;line-height:1.9;font-size:13px;margin:0}#treeList{position:absolute;left:32px;bottom:88px;display:flex;gap:8px}.tree-card{display:flex;align-items:center;gap:9px;padding:8px 13px 8px 8px;min-width:106px;text-align:left;background:#14262bdb;border-color:#64797645}.tree-card[aria-pressed=true]{border-color:#c7d9ac;background:#283932ed}.tree-card img{width:43px;height:53px;object-fit:contain;filter:brightness(1.15)}.tree-card .number{font-size:10px;letter-spacing:.12em;color:#adc59e;display:block}.tree-card .name{font-size:12px;margin-top:4px;display:block}.tools{position:absolute;right:32px;bottom:88px;display:flex;gap:8px}.statusline{position:absolute;left:32px;bottom:171px;font-size:11px;color:#9bb0aa;display:flex;align-items:center;gap:8px;pointer-events:none}.statusline button{pointer-events:auto;padding:4px 9px;font-size:11px}.pulse{width:5px;height:5px;background:#b2cd93;border-radius:50%}.pulse.busy{animation:blink 1.1s infinite}footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-top:1px solid #77918422;background:linear-gradient(transparent,#0e1a1dd9);color:#8ba49e;font-size:11px;pointer-events:none}#scale{display:inline-block;border-bottom:1px solid #98b2a6;border-left:1px solid #98b2a6;border-right:1px solid #98b2a6;padding-bottom:5px;text-align:center;white-space:nowrap}dialog{color:#e7eee4;background:#182a2d;border:1px solid #637773;border-radius:12px;max-width:440px;padding:34px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#050c10aa;backdrop-filter:blur(7px)}dialog h2{font-size:21px;font-weight:500;line-height:1.6;margin:20px 0}dialog p{margin:16px 0}dialog small{color:#879e98;font-size:11px}.close{position:absolute;right:12px;top:6px;border:0;background:transparent;font-size:24px}#error,.noscript{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#182a2df5;padding:32px;border-radius:12px;max-width:90vw;width:450px;border:1px solid #8fa49b}#error h2{font-size:19px}#error button{margin-top:20px}.mobile{display:none}@keyframes blink{50%{opacity:.25}}@media(prefers-reduced-motion:reduce){.pulse.busy{animation:none}}@media(max-width:900px){.tools{bottom:163px;right:20px}.statusline{bottom:211px;left:20px}.intro{left:20px;top:90px}.intro h1{font-size:25px}.intro p{max-width:250px;font-size:12px}header{padding:22px 20px}#treeList{left:20px;right:20px;bottom:77px;overflow-x:auto;padding:4px 0 5px}.tree-card{min-width:101px;flex-shrink:0}footer{padding:20px;font-size:10px}.hint{display:none}.hint.mobile{display:block}.brand span{margin-left:10px}.tools button{padding:9px 12px}.tools #share span{display:none}}@media(max-height:600px){.intro{top:72px}.intro p{display:none}.statusline{bottom:147px}.tools{bottom:85px}#treeList{bottom:75px;max-width:55%}.tree-card{min-width:82px}.tree-card img{width:25px;height:40px}}
/* Keep short labels legible over a close-up without covering the tree. */
header{background:linear-gradient(#101d20c9,transparent)}.intro{background:linear-gradient(90deg,#101d20bf,transparent);padding:12px 28px 16px 0;border-radius:6px}.statusline{background:#101d20c9;padding:7px 10px;border-radius:20px}

/* Quiet background-download notice, below the top-right controls. */
.statusline{left:auto;right:32px;top:69px;bottom:auto;max-width:calc(100% - 40px);padding:6px 9px;border-radius:5px;background:#101d20b3;font-size:11px;opacity:1}
.statusline.complete{animation:hide-complete .5s ease 3s forwards}
@keyframes hide-complete{to{opacity:0;visibility:hidden}}
@media(max-width:900px){.statusline{left:auto;right:20px;top:61px;bottom:auto;font-size:10px}}
@media(prefers-reduced-motion:reduce){.statusline.complete{animation-duration:.01s}}