:root{--bg:#ffffff;--card:#ffffff;--muted:#6b7280;--text:#0a0a0a;--primary:#111111;--primary-600:#000000;--border:#e5e7eb;--green:#16a34a;--red:#dc2626;--yellow:#f59e0b}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.loading-line{height:6px;width:100%;border-radius:6px;background:linear-gradient(90deg,#ef4444,#f59e0b,#10b981,#3b82f6);background-size:400% 100%;animation:loadingbar 1.1s linear infinite}@keyframes loadingbar{0%{background-position:0 0}to{background-position:400% 0}}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:url(/logo.png) center/95vmin no-repeat;opacity:.06;pointer-events:none;z-index:0}.container{max-width:1000px;margin:0 auto;padding:16px;display:grid;gap:16px}.header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;background:#fffc;-webkit-backdrop-filter:saturate(150%) blur(6px);backdrop-filter:saturate(150%) blur(6px);border-bottom:1px solid var(--border);padding:12px 16px;border-radius:0 0 12px 12px}.header h1{margin:0;font-size:22px}.logo{height:28px;width:auto;display:block}.brand{min-width:0}.disclaimer{color:var(--red);font-weight:700;margin-top:4px}.nav a{color:var(--text);text-decoration:none;border:1px solid var(--border);padding:8px 12px;border-radius:10px;background:#fff;transition:background .15s ease,box-shadow .15s ease}.nav a:hover{background:#f3f4f6;box-shadow:0 1px 4px #00000014}.nav{display:flex;gap:8px;flex-wrap:wrap}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 10px #0000000d;transition:transform .1s ease,box-shadow .2s ease}.card:hover{transform:translateY(-1px);box-shadow:0 6px 18px #0000001a}.card-body{padding:16px}.actions{display:flex;gap:8px;flex-wrap:wrap}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:#fff;color:var(--text);padding:12px 16px;border-radius:12px;cursor:pointer;min-height:44px;transition:background .15s ease,transform .05s ease,box-shadow .15s ease;display:inline-flex;align-items:center;gap:6px;font-size:14px;line-height:1.1;text-decoration:none}.btn:hover{background:#f8fafc;box-shadow:0 1px 6px #0000001a}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--primary);border-color:var(--primary-600);color:#fff}.btn-primary:hover{background:var(--primary-600)}.btn-export{background:#eef2ff;border-color:#c7d2fe;color:#111827}.btn-export:hover{background:#e0e7ff}.btn.btn-primary,.btn-import{background:var(--primary);border-color:var(--primary-600);color:#fff}input,select,textarea{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text);outline:none;transition:border-color .15s ease,box-shadow .15s ease}input:focus,select:focus,textarea:focus{border-color:#cbd5e1;box-shadow:0 0 0 4px #0000000f}label{color:var(--text)}.form-label{min-width:120px;display:inline-block}.grid{display:grid;gap:12px}.grid-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.meta{font-size:12px;color:var(--muted)}.alert{color:var(--red)}.video{width:100%;max-width:720px;aspect-ratio:16/9;background:#000;border-radius:12px;border:1px solid var(--border);box-shadow:0 6px 16px #0002}.sample{width:100%;max-width:720px;border-radius:12px;border:1px solid var(--border);box-shadow:0 3px 12px #00000014;cursor:pointer}.result-grid{display:grid;grid-template-columns:1fr 240px;gap:16px;align-items:start}.result-image img{width:100%;height:auto;border-radius:12px;border:1px solid var(--border);box-shadow:0 3px 12px #00000014}.dot{width:12px;height:12px;border-radius:50%;display:inline-block;box-shadow:0 0 4px currentColor}.dot.green{color:var(--green);background:var(--green)}.dot.red{color:var(--red);background:var(--red)}.dot.yellow{color:var(--yellow);background:var(--yellow)}.list{display:grid;gap:12px}.list-item{display:grid;grid-template-columns:180px 1fr;gap:12px;align-items:center;border:1px solid var(--border);border-radius:12px;background:#fff;box-shadow:0 1px 6px #0000000d;transition:box-shadow .2s ease,transform .1s ease}.list-item:hover{box-shadow:0 6px 16px #0000001a;transform:translateY(-1px)}.list-thumb{width:180px;height:120px;object-fit:cover;border-radius:10px}.link{color:#111;text-decoration:underline .5px transparent;text-underline-offset:2px;transition:text-decoration-color .15s ease}.link:hover{text-decoration-color:#111}@media (max-width: 640px){.container,.card-body{padding:12px}.header{padding:10px 12px;flex-direction:column;align-items:flex-start;gap:4px}.logo{height:24px}.header h1{font-size:20px}.disclaimer{font-size:13px;line-height:1.2;margin-top:2px}.nav a{padding:10px 12px}.grid-row{flex-direction:column;align-items:stretch}input,select,textarea{font-size:16px}.actions .btn{flex:1 1 auto}.list-item{grid-template-columns:1fr}.list-thumb{width:100%;height:auto;aspect-ratio:3/2}.header h1{font-size:18px}.camera{gap:8px}.camera .video{aspect-ratio:4/3;max-height:75vh}.sample{max-height:45vh;object-fit:cover}.camera .actions{position:sticky;bottom:0;background:#fffc;-webkit-backdrop-filter:saturate(150%) blur(6px);backdrop-filter:saturate(150%) blur(6px);padding:8px;border:1px solid var(--border);border-radius:12px}.form-label{min-width:unset;display:block;margin-bottom:4px}.result-grid{grid-template-columns:1fr}}