html,body{margin:0;height:100%;overflow:hidden;background:#cdd6e0;font-family:system-ui,Segoe UI,Arial,sans-serif}#app{position:fixed;top:0;right:0;bottom:0;left:0}canvas{display:block}button,select{font:inherit}#panel{position:fixed;top:12px;right:12px;width:290px;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);overflow:auto;box-sizing:border-box;padding:12px 14px;background:#ffffffed;color:#1d232b;border-radius:10px;box-shadow:0 2px 10px #0003;font-size:14px;direction:rtl}#panel h1{margin:0;font-size:17px}#panel .sub{margin:2px 0 10px;color:#5a6470;font-size:13px}#panel button{padding:7px 10px;border:1px solid #b9c1ca;border-radius:6px;background:#fff;cursor:pointer}#panel button:hover{background:#eef2f6}#panel .primary{width:100%;background:#2b6cb0;color:#fff;border-color:#2b6cb0;font-weight:600;margin-bottom:8px;padding:10px}#panel .primary:hover{background:#245a94}.row{display:flex;gap:6px;margin-bottom:8px}.row button{flex:1}.grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}.grid button[aria-pressed=true]{background:#dbe9f8;border-color:#2b6cb0;font-weight:600}.jump{display:block;font-size:13px;color:#5a6470;margin:6px 0}.jump select{display:block;width:100%;margin-top:4px;padding:6px;border-radius:6px}.legend{list-style:none;padding:0;margin:10px 0 8px}.legend li{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:13px}.sw{width:16px;height:16px;border-radius:3px;border:1px solid #555;flex:none}.note{margin:0;font-size:12px;color:#5a6470;line-height:1.4}#hide{float:left;padding:3px 8px!important;font-size:12px}#panel.collapsed>:not(#hide){display:none}#panel.collapsed{width:auto}#hint{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#14191e59;direction:rtl}#hint[hidden]{display:none}#hint .card{background:#fff;color:#1d232b;padding:22px 26px;border-radius:12px;max-width:420px;text-align:center;box-shadow:0 6px 24px #0000004d}#hint h2{margin:0 0 8px}#hint p{margin:0 0 14px;color:#3a4450;line-height:1.5}#hint button{padding:9px 16px;margin:0 4px;border-radius:8px;border:1px solid #b9c1ca;background:#fff;cursor:pointer}#hint .primary{background:#2b6cb0;color:#fff;border-color:#2b6cb0;font-weight:600}#joy{position:fixed;left:24px;bottom:28px;width:130px;height:130px;border-radius:50%;background:#ffffff47;border:2px solid rgba(255,255,255,.7);touch-action:none;display:flex;align-items:center;justify-content:center;z-index:5}#joy[hidden]{display:none}#joyknob{width:56px;height:56px;border-radius:50%;background:#ffffffd9;box-shadow:0 2px 8px #0000004d}#exitfab{position:fixed;top:12px;right:12px;z-index:6;padding:10px 14px;border-radius:22px;border:0;background:#14191ebf;color:#fff;font-size:14px;direction:rtl}#jumpfab{position:fixed;top:12px;left:12px;z-index:6;padding:9px 10px;border-radius:22px;border:0;background:#14191ebf;color:#fff;font-size:14px;direction:rtl;max-width:45vw}#exitfab[hidden],#jumpfab[hidden]{display:none}canvas{touch-action:none}@media (max-width: 700px),(pointer: coarse){#panel{top:auto;bottom:0;right:0;left:0;width:100%;max-width:100%;max-height:58vh;border-radius:14px 14px 0 0;padding:10px 14px 16px}#panel.collapsed{left:auto;right:10px;bottom:10px;width:auto;border-radius:10px;padding:6px 8px}#panel button{padding:10px 12px}#hide{float:left}.jump select{padding:10px}#hint .card{margin:0 16px}}.editbtn{width:100%;margin-bottom:6px}.editbtn[aria-pressed=true]{background:#dbe9f8!important;border-color:#2b6cb0!important;font-weight:600}.tip{margin:0 0 8px;font-size:12px;color:#5a6470}#editbar{position:fixed;top:12px;left:12px;width:300px;max-width:calc(100vw - 24px);box-sizing:border-box;padding:10px 12px;background:#fffffff2;color:#1d232b;border-radius:10px;box-shadow:0 2px 10px #0003;direction:rtl;font-size:14px;z-index:7}#editbar[hidden]{display:none}#editbar .eb-title{margin-bottom:8px;line-height:1.4}#editbar #eb-sel{display:block;color:#2b6cb0;font-size:13px}#editbar .eb-row{display:flex;gap:6px;margin-bottom:6px}#editbar .eb-row>*{flex:1;padding:7px 6px;border:1px solid #b9c1ca;border-radius:6px;background:#fff;cursor:pointer}#editbar button:disabled{opacity:.45;cursor:default}#editbar .eb-primary{background:#2b6cb0;color:#fff;border-color:#2b6cb0;font-weight:600}#editbar .eb-note{margin:4px 0 0;font-size:11.5px;color:#5a6470;line-height:1.4}@media (max-width: 700px),(pointer: coarse){#editbar{top:auto;bottom:64px;left:8px;right:8px;width:auto;max-width:none}#editbar .eb-note{display:none}#editbar .eb-row>*{padding:10px 6px}}.helpbtn{float:left;margin-right:6px;padding:3px 8px!important;font-size:12px}#help{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#14191e80;direction:rtl;padding:12px;box-sizing:border-box}#help[hidden]{display:none}#help .card{background:#fff;color:#1d232b;border-radius:14px;max-width:520px;width:100%;max-height:100%;overflow:auto;padding:20px 22px;box-sizing:border-box;box-shadow:0 8px 30px #00000059}#help h2{margin:0 0 4px;font-size:20px}#help .lead{margin:0 0 12px;color:#5a6470}#help .sec{background:#f4f7fa;border-radius:10px;padding:10px 12px;margin-bottom:10px}#help h3{margin:0 0 6px;font-size:15px}#help ul{margin:0;padding-right:18px;line-height:1.6;font-size:14px}#help .small{font-size:12px;color:#5a6470;margin:4px 0 12px}#help .primary{width:100%;padding:12px;border:0;border-radius:10px;background:#2b6cb0;color:#fff;font-size:16px;font-weight:600;cursor:pointer}#tourbar{position:fixed;bottom:18px;left:50%;transform:translate(-50%);z-index:6;display:flex;align-items:center;gap:10px;direction:rtl}#tourbar[hidden]{display:none}#tourbar button{width:52px;height:52px;border-radius:50%;border:0;background:#14191ebf;color:#fff;font-size:26px;cursor:pointer;flex:none}#tourbar button:active{background:#2b6cb0e6}#t-tip{background:#14191ebf;color:#fff;padding:9px 14px;border-radius:20px;font-size:14px;max-width:46vw;text-align:center;transition:opacity .8s}#t-tip.fade{opacity:0;pointer-events:none}@media (max-width: 700px),(pointer: coarse){#tourbar{left:auto;right:12px;bottom:28px;transform:none;flex-direction:column-reverse}#t-tip{position:fixed;top:64px;left:12px;right:12px;max-width:none;font-size:13px}}