:root{--paper:#fbf7f0;--grid:#e8e2d8;--ink:#2b2d42;--muted:#8d99ae;--accent:#ff5d73;--pip:#ffb347}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{color:var(--ink);background-color:var(--paper);background-image:radial-gradient(var(--grid) 1px, transparent 1px);background-size:24px 24px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{width:100%;height:100%;position:relative;overflow:hidden}.bb-title{z-index:10;color:var(--muted);letter-spacing:.02em;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:13px;font-weight:600;position:absolute;bottom:12px;left:16px}.bb-toolbar{z-index:20;-webkit-backdrop-filter:blur(8px);border:1px solid var(--grid);background:#ffffffe0;border-radius:999px;align-items:center;gap:4px;max-width:calc(100vw - 32px);padding:6px 10px;display:flex;position:absolute;top:16px;left:50%;overflow-x:auto;transform:translate(-50%);box-shadow:0 4px 16px #2b2d421f}.bb-sep{background:var(--grid);flex:none;align-self:stretch;width:1px;margin:4px 2px}.bb-btn{appearance:none;color:var(--ink);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:999px;justify-content:center;align-items:center;min-width:36px;height:36px;padding:0 10px;font-size:12px;font-weight:600;transition:background-color .12s,color .12s;display:inline-flex}.bb-btn:hover{background:#2b2d420f}.bb-btn.active{background:var(--accent);color:#fff}.bb-btn.bb-waiting{opacity:.55;font-style:italic}.bb-icon-btn{padding:0 8px}.bb-slider{color:var(--muted);white-space:nowrap;align-items:center;gap:6px;padding:0 8px;font-size:11px;display:inline-flex}.bb-slider input[type=range]{width:72px}.bb-hint{z-index:15;color:var(--muted);border:1px solid var(--grid);pointer-events:none;opacity:1;background:#ffffffd9;border-radius:10px;padding:6px 12px;font-size:13px;transition:opacity .3s,visibility .3s;position:absolute;top:64px;left:50%;transform:translate(-50%)}.bb-hint-hidden{opacity:0;visibility:hidden}.bb-help{z-index:30;border:1px solid var(--grid);background:#fff;border-radius:12px;width:min(360px,100vw - 32px);padding:16px;font-size:13px;line-height:1.5;position:absolute;top:64px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #2b2d422e}.bb-help-title{margin:0 0 8px;font-size:15px}.bb-help ul{margin:8px 0;padding-left:18px}.bb-help .bb-btn{background:var(--ink);color:#fff;margin-top:8px}