#optitrace-app{
 max-width:480px;margin:0 auto;
 background:#0e1111;color:#e8f0ee;
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
 padding:16px;border-radius:14px
}
.ot-header{ text-align:center;font-size:18px;letter-spacing:.08em;margin-bottom:6px;color:#cfeee5 }
.ot-subhead{ text-align:center;font-size:11px;opacity:.75;margin-bottom:10px }
.ot-canvaswrap{ position:relative }
#ot-trace{ width:100%;height:260px;background:#000;border-radius:12px;display:block }
.ot-badge{
 position:absolute;top:10px;left:10px;
 font-size:11px;opacity:.85;
 background:rgba(0,0,0,.25);
 border:1px solid rgba(126,240,200,.35);
 padding:4px 8px;border-radius:999px
}
.ot-legend{ font-size:11px;opacity:.65;text-align:center;margin-top:6px }
.ot-use{ font-size:11px;opacity:.75;text-align:center;margin-top:4px }
.ot-bars{ margin-top:14px }
.ot-bar{ margin-bottom:12px }
.ot-bar span{ font-size:12px;opacity:.8 }
.ot-bar-bg{ width:100%;height:10px;background:#1b2422;border-radius:6px;margin-top:4px;overflow:hidden }
.ot-bar-fill{ height:100%;width:0;background:linear-gradient(90deg,#7ef0c8,#66ffff);transition:width .25s ease }
.ot-footer{ margin-top:14px }
.ot-boundary{ font-size:11px;opacity:.6;text-align:center;margin-bottom:10px }
.ot-actions{ display:flex;gap:10px }
#ot-pro,#ot-capture{
 flex:1;padding:12px;border-radius:10px;
 background:#121818;color:#e8f0ee;
 border:1px solid #1f2a27;font-size:13px
}
#ot-capture:disabled{ opacity:.4 }
#ot-pro.active{ border-color:#7ef0c8;color:#7ef0c8 }

.ot-pay{
 position:fixed;inset:0;display:none;align-items:center;justify-content:center;
 background:rgba(0,0,0,.55);z-index:99999;padding:16px
}
.ot-pay[aria-hidden="false"]{ display:flex }
.ot-pay-card{
 width:min(420px,100%);
 background:#0e1111;border:1px solid rgba(126,240,200,.25);
 border-radius:14px;padding:14px;color:#e8f0ee
}
.ot-pay-title{ font-size:14px;letter-spacing:.02em;margin-bottom:6px;color:#cfeee5;text-align:center }
.ot-pay-sub{ font-size:12px;opacity:.75;text-align:center;margin-bottom:12px }
.ot-pay-actions{ display:flex;gap:10px }
#ot-unlock,#ot-notnow{
 flex:1;padding:12px;border-radius:10px;
 background:#121818;color:#e8f0ee;border:1px solid #1f2a27;font-size:13px
}
#ot-unlock{ border-color:rgba(126,240,200,.45);color:#7ef0c8 }