*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Hiragino Kaku Gothic ProN','Noto Sans JP',sans-serif;background:#0d1220;color:#e8ecf5;min-height:100vh;padding-bottom:40px}
header{text-align:center;padding:24px 16px 8px}
h1{font-size:1.7rem;letter-spacing:.05em}
.sub{color:#8fa0c0;font-size:.85rem;margin-top:4px}
#tabs{display:flex;gap:8px;justify-content:center;padding:14px}
.tab{background:#1a2338;color:#8fa0c0;border:1px solid #2a3654;border-radius:20px;padding:8px 18px;font-size:.9rem;cursor:pointer}
.tab.active{background:#2e6df6;color:#fff;border-color:#2e6df6}
main{max-width:640px;margin:0 auto;padding:0 14px}
.tabpane{display:none}.tabpane.active{display:block}
.card{background:#151d31;border:1px solid #253252;border-radius:14px;padding:18px;margin-bottom:14px}
.card h2{font-size:1.05rem;margin-bottom:10px}
.card p{font-size:.9rem;color:#b8c4dd;line-height:1.7;margin-bottom:10px}
.card ul{padding-left:20px;font-size:.9rem;line-height:1.9;color:#c9d4ea}
.note{font-size:.78rem;color:#7788aa;margin-top:10px}
input[type=file]{width:100%;padding:10px;background:#0f1526;border:1px dashed #3a4a75;border-radius:10px;color:#8fa0c0;margin-bottom:12px}
button{font-family:inherit;cursor:pointer}
.primary{background:linear-gradient(135deg,#2e6df6,#39f0b2);color:#08101f;font-weight:700;border:none;border-radius:12px;padding:13px 26px;font-size:1rem;width:100%}
.primary.cancel{background:linear-gradient(135deg,#f45b69,#ff9a6a);color:#2b0508}
button:disabled{opacity:.5}
.btnrow{display:flex;gap:8px}
.btnrow button{flex:1}
#camSwitchBtn,#liveStopBtn{background:#1a2338;color:#c9d4ea;border:1px solid #2a3654;border-radius:12px;padding:13px}
.hidden{display:none!important}
#videoWrap video{width:100%;border-radius:10px;margin-bottom:12px;background:#000}
#progressWrap{margin-top:12px;background:#0f1526;border-radius:8px;height:34px;position:relative;overflow:hidden;border:1px solid #2a3654}
#progressBar{height:100%;width:0;background:linear-gradient(90deg,#2e6df6,#39f0b2);transition:width .2s}
#progressText{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.6)}
#liveWrap{position:relative;margin-top:12px}
#liveWrap video,#liveOverlay{width:100%;border-radius:10px;display:block}
#liveOverlay{position:absolute;top:0;left:0;height:100%}
#liveStatus{position:absolute;bottom:8px;left:8px;right:8px;text-align:center;background:rgba(8,14,28,.75);border-radius:8px;padding:6px;font-size:.85rem}
#modelStatus{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);background:#1a2338;border:1px solid #2a3654;border-radius:20px;padding:7px 16px;font-size:.8rem;transition:opacity .8s;z-index:10}
#modelStatus.fade{opacity:0;pointer-events:none}
.overall{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.grade{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:800;flex-shrink:0}
.gS{background:#ffd54a;color:#4a3800}.gA{background:#39f0b2;color:#063}.gB{background:#2e6df6;color:#fff}.gC{background:#8fa0c0;color:#1a2338}.gD{background:#f45b69;color:#fff}
.oscore{font-size:1.8rem;font-weight:800}.oscore span{font-size:.9rem;font-weight:400;color:#8fa0c0}
.omemo{font-size:.8rem;color:#8fa0c0}
.metric{margin-bottom:12px}
.mhead{display:flex;justify-content:space-between;font-size:.9rem;margin-bottom:4px}
.msc{font-weight:700}
.bar{background:#0f1526;height:9px;border-radius:5px;overflow:hidden}
.fill{height:100%;border-radius:5px}
.fill.good{background:#39f0b2}.fill.mid{background:#ffd54a}.fill.bad{background:#f45b69}
.mdetail{font-size:.75rem;color:#7788aa;margin-top:3px}
.advice li{margin-bottom:10px;line-height:1.8}
.snaps{display:flex;gap:10px;flex-wrap:wrap}
.snaps figure{flex:1;min-width:45%}
.snaps img{width:100%;border-radius:8px}
.snaps figcaption{font-size:.78rem;color:#8fa0c0;text-align:center;margin-top:4px}
.err{color:#ffb3ba}
details summary{cursor:pointer;font-size:.95rem;font-weight:700;margin-bottom:10px}
canvas.dbg{width:100%;background:#0f1526;border-radius:8px;border:1px solid #2a3654}