:root{--bg: #000000;--fg: #e6e6e6;--muted: #a1a1a1;--accent: #4f46e5;--accent-hover: #4338ca;--btn-bg: rgba(255, 255, 255, .06);--btn-bg-hover: rgba(255, 255, 255, .12);--btn-border: rgba(255, 255, 255, .18)}*{box-sizing:border-box}html,body,#app{height:100%}html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"}#app{position:relative;overflow:hidden}#webgl-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;outline:none}.top-nav{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;z-index:10;pointer-events:none}.spacer{display:none}.nav-items{display:flex;gap:8px;pointer-events:auto}.nav-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:var(--btn-bg);color:var(--fg);padding:12px 16px;border-radius:8px;font-weight:600;letter-spacing:.2px;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .16s ease,transform 80ms ease,color .16s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:80px;min-height:60px;gap:4px}.nav-btn:hover{background:var(--btn-bg-hover)}.nav-btn:active{transform:translateY(1px)}.nav-btn.active{background:#ffffff1f;color:var(--accent)}.nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.nav-icon svg{width:100%;height:100%;stroke:currentColor}.nav-text{font-size:12px;font-weight:600;text-align:center;line-height:1.2;white-space:nowrap}@media (max-width: 1200px){.nav-btn{padding:10px 14px;min-width:70px;min-height:55px}.nav-icon{width:18px;height:18px}.nav-text{font-size:11px}}@media (max-width: 900px){.nav-btn{padding:8px 12px;min-width:65px;min-height:50px}.nav-icon{width:16px;height:16px}.nav-text{font-size:10px}}@media (max-width: 768px){.nav-items{gap:6px}.nav-btn{padding:6px 10px;min-width:60px;min-height:45px}.nav-icon{width:16px;height:16px}.nav-text{font-size:10px}}@media (max-width: 600px){.nav-items{gap:4px}.nav-btn{padding:6px 8px;min-width:55px;min-height:42px}.nav-icon{width:14px;height:14px}.nav-text{font-size:9px}}@media (max-width: 480px){.nav-items{gap:3px}.nav-btn{padding:5px 6px;min-width:50px;min-height:40px}.nav-icon{width:14px;height:14px}.nav-text{font-size:8px}}@media (max-width: 400px){.nav-items{gap:2px}.nav-btn{padding:4px 5px;min-width:45px;min-height:38px}.nav-icon{width:12px;height:12px}.nav-text{font-size:7px}}@media (max-width: 320px){.nav-items{gap:1px}.nav-btn{padding:3px 4px;min-width:40px;min-height:35px}.nav-icon{width:12px;height:12px}.nav-text{font-size:6px}}.mode-banner{position:absolute;left:12px;bottom:12px;padding:6px 10px;border-radius:8px;background:#ffffff0f;border:1px solid var(--btn-border);color:var(--muted);font-weight:600;letter-spacing:.2px;z-index:10;pointer-events:none;min-width:160px;text-align:center}.cursor-annotator{cursor:cell}.cursor-drawing-over-geometry{cursor:crosshair}.cursor-drawing-over-geometry:after{content:"";position:absolute;width:20px;height:20px;border:2px solid rgba(0,150,255,.8);border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);z-index:1000}.brush-instructions{position:absolute;bottom:12px;right:12px;background:#000c;color:var(--fg);padding:12px;border-radius:8px;border:1px solid var(--btn-border);font-size:12px;line-height:1.4;z-index:10;pointer-events:none;max-width:300px;opacity:1;transition:opacity .5s ease-out}.brush-instructions.fade-out{opacity:0}.brush-instructions h4{margin:0 0 8px;color:#f17d2f;font-size:16px}.brush-instructions ul{margin:0;padding-left:16px}.brush-instructions li{margin:4px 0}@media (max-width: 768px){.brush-instructions{font-size:10px;padding:8px;max-width:250px;bottom:8px;right:8px}.brush-instructions h4{font-size:12px;margin:0 0 6px}.brush-instructions ul{padding-left:12px}.brush-instructions li{margin:2px 0}}@media (max-width: 480px){.brush-instructions{font-size:9px;padding:6px;max-width:200px;bottom:6px;right:6px}.brush-instructions h4{font-size:11px;margin:0 0 4px}.brush-instructions ul{padding-left:10px}.brush-instructions li{margin:1px 0}}@media (max-width: 320px){.brush-instructions{font-size:8px;padding:4px;max-width:150px;bottom:4px;right:4px}.brush-instructions h4{font-size:10px;margin:0 0 3px}.brush-instructions ul{padding-left:8px}.brush-instructions li{margin:1px 0}}.comment-dialog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.comment-dialog{background:#1a1a1a;border:1px solid #333;border-radius:12px;width:90%;max-width:800px;max-height:90vh;overflow:hidden;box-shadow:0 20px 40px #00000080;display:flex;flex-direction:column}@media (max-width: 768px){.comment-dialog{width:95%;max-width:none;margin:10px;max-height:95vh}.comment-dialog>div:nth-child(2){overflow-y:auto}.comment-dialog>div:nth-child(2)>div:first-child{flex-direction:column;gap:16px}.comment-dialog>div:nth-child(2)>div:first-child>div{gap:12px;min-height:200px}.comment-dialog>div:nth-child(2)>div:first-child>div>div{flex-direction:column;align-items:flex-start;gap:6px}.comment-dialog>div:nth-child(2)>div:first-child>div>div>label{min-width:auto;margin-bottom:4px}.comment-dialog .comment-dialog-picture{min-height:150px;flex:1}.comment-dialog textarea{height:100px;max-height:150px}}@media (max-height: 600px){.comment-dialog{max-height:98vh}.comment-dialog>div:nth-child(2){overflow-y:auto;-webkit-overflow-scrolling:touch}.comment-dialog textarea{height:80px;max-height:120px}}@media (max-width: 480px){.comment-dialog{width:98%;margin:5px;border-radius:8px}.comment-dialog>div:first-child{padding:12px 16px}.comment-dialog>div:nth-child(2){overflow-y:auto;-webkit-overflow-scrolling:touch}.comment-dialog>div:nth-child(2)>div:first-child{padding:16px;gap:12px}.comment-dialog>div:nth-child(2)>div:first-child>div>div{flex-direction:column;align-items:flex-start;gap:6px}.comment-dialog>div:nth-child(2)>div:first-child>div>div>label{min-width:auto;margin-bottom:4px}.comment-dialog .comment-dialog-picture{min-height:120px;flex:1}.comment-dialog .comment-dialog-picture-icon{font-size:32px}.comment-dialog textarea{height:80px;max-height:100px;font-size:12px}.comment-dialog>div:last-child{padding:12px 16px}.comment-dialog button{padding:10px 20px;font-size:13px}}@media (max-width: 320px){.comment-dialog{width:100%;margin:0;border-radius:0;max-height:100vh}.comment-dialog>div:first-child{padding:10px 12px}.comment-dialog>div:nth-child(2){overflow-y:auto;-webkit-overflow-scrolling:touch}.comment-dialog>div:nth-child(2)>div:first-child{padding:12px;gap:10px}.comment-dialog>div:nth-child(2)>div:first-child>div>div{flex-direction:column;align-items:flex-start;gap:4px}.comment-dialog>div:nth-child(2)>div:first-child>div>div>label{min-width:auto;margin-bottom:2px;font-size:12px}.comment-dialog .comment-dialog-picture{min-height:100px;flex:1}.comment-dialog .comment-dialog-picture-icon{font-size:24px}.comment-dialog textarea{height:60px;max-height:80px;font-size:11px}.comment-dialog>div:last-child{padding:10px 12px}.comment-dialog button{padding:8px 16px;font-size:12px}}.annotation-list-toggle{position:fixed;top:50%;left:20px;transform:translateY(-50%);width:50px;height:50px;background:#1a1a1ae6;border:1px solid #333;border-radius:50%;color:#fff;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:1001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000004d}.annotation-list-toggle:hover{background:#333;transform:translateY(-50%) scale(1.1)}.annotation-list-container{position:fixed;top:0;left:0;width:350px;height:100vh;background:#1a1a1af2;border-right:1px solid #333;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;transform:translate(-100%);transition:transform .3s ease-in-out;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}.annotation-list-container::-webkit-scrollbar{width:6px}.annotation-list-container::-webkit-scrollbar-track{background:#1a1a1a}.annotation-list-container::-webkit-scrollbar-thumb{background:#444;border-radius:3px}.annotation-list-container::-webkit-scrollbar-thumb:hover{background:#666}.annotation-card{background:#2a2a2a;border:1px solid #444;border-radius:8px;padding:16px;transition:all .2s;cursor:pointer}.annotation-card:hover{border-color:#666;background:#333}.annotation-card-buttons{display:flex;gap:8px}.annotation-btn{border:none;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;cursor:pointer;transition:background .2s}.view-btn{background:#4f46e5}.edit-btn{background:#f59e0b}.delete-btn{background:#dc2626}.annotation-field{margin-bottom:8px}.annotation-label{color:#888;font-size:14px}.annotation-value{color:#fff;font-size:14px;margin-left:8px}.annotation-status{color:#fff;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500;margin-left:8px}.annotation-comments{line-height:1.4}.annotation-footer{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid #444}.annotation-timestamp{color:#888;font-size:12px}.annotation-image-container{margin-left:8px;margin-top:8px}.annotation-image{max-width:100%;max-height:200px;border-radius:6px;border:1px solid #444;object-fit:contain;background:#1a1a1a}.annotation-status-edit,.annotation-comments-edit{background:#2a2a2a;border:1px solid #555;border-radius:4px;color:#fff;font-family:inherit;box-sizing:border-box}.annotation-status-edit{padding:2px 6px;font-size:12px;font-weight:500;margin-left:8px}.annotation-comments-edit{padding:4px;font-size:14px;margin-left:8px;width:200px;height:60px;resize:vertical}@media (max-width: 1200px){.annotation-list-container{width:340px!important}}@media (max-width: 1024px){.annotation-list-container{width:320px!important}.annotation-card{padding:12px}.annotation-label,.annotation-value{font-size:14px}.annotation-btn{padding:4px 8px;font-size:12px}}@media (max-width: 900px){.annotation-list-container{width:300px!important}}@media (max-width: 768px){.annotation-list-container{width:300px!important}.annotation-list-toggle{left:15px;width:45px;height:45px;font-size:18px}.annotation-card{padding:10px;margin-bottom:10px}.annotation-field{margin-bottom:6px}.annotation-label,.annotation-value{font-size:13px}.annotation-btn{padding:3px 6px;font-size:11px;min-width:45px}.annotation-comments-edit{width:180px!important;height:50px!important;font-size:12px!important}.annotation-status-edit{font-size:12px!important;padding:2px 5px!important}.annotation-image{max-height:120px!important}.annotation-image{max-height:150px!important}.annotation-card select{font-size:11px!important;padding:2px 4px!important}}@media (max-width: 480px){.annotation-list-container{width:300px!important}.annotation-card{padding:10px;margin-bottom:8px}.annotation-field{margin-bottom:6px}.annotation-label,.annotation-value{font-size:13px}.annotation-btn{padding:2px 4px;font-size:10px;min-width:40px}.annotation-list-toggle{left:10px;width:40px;height:40px;font-size:16px}.annotation-comments-edit{width:180px!important;height:55px!important;font-size:13px!important}.annotation-status-edit{font-size:12px!important;padding:2px 5px!important}.annotation-image{max-height:120px!important}}@media (max-width: 414px){.annotation-list-container{width:300px!important}.annotation-card{padding:8px;margin-bottom:6px}.annotation-field{margin-bottom:4px}.annotation-label,.annotation-value{font-size:12px}.annotation-btn{padding:2px 4px;font-size:10px;min-width:35px}.annotation-list-toggle{left:8px;width:35px;height:35px;font-size:14px}.annotation-comments-edit{width:160px!important;height:45px!important;font-size:11px!important}.annotation-status-edit{font-size:10px!important;padding:1px 3px!important}}@media (max-width: 360px){.annotation-list-container{width:300px!important}.annotation-card{padding:6px;margin-bottom:4px}.annotation-card>div{margin-bottom:3px}.annotation-label,.annotation-value{font-size:11px}.annotation-btn{padding:2px 3px;font-size:9px;min-width:30px}.annotation-list-toggle{left:6px;width:32px;height:32px;font-size:12px}.annotation-card textarea{width:140px!important;height:40px!important;font-size:10px!important}.annotation-card select{font-size:9px!important;padding:1px 2px!important}}
