:root{color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%}#app{position:relative;width:100%;height:100%;overflow:hidden}#scene{display:block;width:100%;height:100%}#hud{position:absolute;inset:0;pointer-events:none;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#hint{position:absolute;right:20px;bottom:20px;padding:10px 14px;border-radius:12px;background:#00000073;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:14px}#panel{position:absolute;right:16px;top:16px;width:min(420px,calc(100% - 32px));max-height:calc(100% - 32px);overflow:auto;padding:14px;border-radius:16px;background:#0000008c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);transform:translateY(-10px);opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}#panel.open{opacity:1;transform:translateY(0);pointer-events:auto}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}#panel-title{margin:0;font-size:18px}#close{pointer-events:auto;border:0;border-radius:10px;padding:8px 10px;background:#ffffff1a;color:#fff;cursor:pointer}#panel-content{line-height:1.45;color:#ffffffeb}#panel-content p{margin:8px 0}#panel-content ul{margin:8px 0 0 18px}#panel{width:400px}@media(max-width:768px){#panel{width:100%;height:60%;bottom:0;top:auto;right:0;border-radius:20px 20px 0 0}}.card{padding:20px}@media(max-width:768px){.card{padding:14px;font-size:14px}.card h3{font-size:18px}}