*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#111;color:#eee;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}#app{width:100%;height:100%;position:relative}#portalCanvas{display:block;width:100%;height:100%}#startScreen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#111;z-index:100;transition:opacity .5s}#startScreen.hidden{opacity:0;pointer-events:none}.start-content{text-align:center}.start-content h1{font-size:3rem;font-weight:300;letter-spacing:.1em;margin-bottom:.5rem}.subtitle{font-size:1rem;color:#888;margin-bottom:2rem}.primary-btn{display:inline-block;padding:.8rem 2.5rem;border:1px solid #555;background:transparent;color:#eee;font-size:1rem;cursor:pointer;border-radius:4px;transition:background .2s,border-color .2s}.primary-btn:hover{background:#222;border-color:#888}.debug-toggle{position:fixed;top:10px;right:10px;z-index:80;width:36px;height:36px;border:1px solid #555;background:#0009;color:#ccc;font-size:1.2rem;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center}.debug-toggle:hover{background:#1e1e1ecc}#debugOverlay{position:fixed;top:54px;right:10px;width:260px;background:#0a0a0ae0;border:1px solid #444;border-radius:6px;z-index:90;font-size:.78rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);overflow:hidden}#debugOverlay.hidden{display:none}.debug-header{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;background:#0000004d;border-bottom:1px solid #333}.debug-title{font-weight:600;font-size:.8rem;color:#aaa}#closeDebug{background:none;border:none;color:#777;cursor:pointer;font-size:1rem}.debug-body{padding:8px 10px;max-height:70vh;overflow-y:auto}.debug-row{display:flex;align-items:center;margin-bottom:3px;gap:4px}.dl{flex-shrink:0;width:80px;color:#999}.dv{color:#ddd;font-family:monospace;font-size:.75rem}.debug-body hr{border:none;border-top:1px solid #333;margin:6px 0}.debug-body input[type=range]{flex:1;height:14px}.btn-row{display:flex;gap:4px;margin-bottom:4px}.btn-row button{flex:1;padding:4px 8px;border:1px solid #555;background:#1e1e1eb3;color:#ccc;cursor:pointer;border-radius:3px;font-size:.75rem}.btn-row button:hover{background:#323232cc}.btn-row button.active{border-color:#7af;color:#7af}.btn-sm{font-size:.72rem}#topdownCanvas{display:block;width:100%;height:62px;margin-top:4px;background:#0a0a0a;border:1px solid #333;border-radius:2px}#manualHint{position:fixed;bottom:30px;left:50%;transform:translate(-50%);color:#888;font-size:.85rem;z-index:50;pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.8)}.hidden{display:none!important}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000b3;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:#1a1a1a;border:1px solid #444;border-radius:8px;width:400px;max-width:92vw;max-height:85vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #333}.modal-title{font-size:1rem;font-weight:500}.modal-close{background:none;border:none;color:#888;cursor:pointer;font-size:1.2rem}.modal-body{padding:14px 16px}.modal .primary-btn{width:100%;margin-top:8px}.cfg-section{margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid #2a2a2a}.cfg-section:last-of-type{border-bottom:none;margin-bottom:0}.cfg-section-title{font-size:.8rem;color:#888;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.cfg-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;gap:8px}.cfg-row label{font-size:.8rem;color:#bbb;flex-shrink:0}.cfg-row input[type=number]{width:90px;padding:3px 6px;font-size:.8rem;background:#111;border:1px solid #444;color:#eee;border-radius:3px}.cfg-row input[type=checkbox]{width:18px;height:18px;accent-color:#7af}.cfg-section select{width:100%;padding:6px 8px;font-size:.85rem;background:#111;border:1px solid #444;color:#eee;border-radius:3px;cursor:pointer}.cfg-label{font-size:.85rem;display:block;margin-bottom:4px;color:#aaa}.cfg-info{font-size:.78rem;color:#777;margin-top:6px;text-align:center}.cfg-info span{color:#aaa;font-family:monospace}.secondary-btn{display:block;margin:12px auto 0;padding:.6rem 1.8rem;border:1px solid #444;background:transparent;color:#999;font-size:.85rem;cursor:pointer;border-radius:4px;transition:background .2s,color .2s}.secondary-btn:hover{background:#1a1a1a;color:#ccc}#cameraOverlay{position:fixed;bottom:20px;right:20px;width:180px;height:135px;border:1px solid #555;border-radius:4px;overflow:hidden;z-index:60;box-shadow:0 2px 12px #000000b3}#cameraOverlay.hidden{display:none}#cameraOverlay.calibration-full{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;border:none;border-radius:0;z-index:70}#cameraOverlay.calibration-full .cam-feed{object-fit:fill;transform:scaleX(-1)}#cameraOverlay.mirror-cal .cam-feed{opacity:0}#cameraOverlay.calibration-full .cam-state{font-size:1.1rem;padding:10px 14px;bottom:14px;left:50%;transform:translate(-50%);width:auto;border-radius:6px}.cam-feed{display:block;width:100%;height:100%;object-fit:cover}.cam-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.cam-state{position:absolute;bottom:0;left:0;right:0;background:#000000b3;color:#ddd;font-size:.68rem;padding:3px 6px;text-align:center;white-space:nowrap;overflow:hidden}.tracking-status{position:fixed;top:10px;left:10px;z-index:85;max-width:min(620px,calc(100vw - 66px));padding:8px 10px;border-radius:4px;background:#000000d9;color:#eee;font-size:.8rem;line-height:1.4;pointer-events:none}
