/* KB_STORIES: full-screen YouTube story studio */
.ys{--bg:#0f1014;--card:#191b22;--line:#2a2d38;--txt:#f4f4f5;--muted:#a1a1aa;--acc:#ef4444;--acc2:#fb7185;--ok:#34d399;color:var(--txt);background:var(--bg);height:100dvh;display:flex;flex-direction:column;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif}
.ys-bar{display:flex;align-items:center;gap:8px;padding:8px 10px;flex:none;border-bottom:1px solid var(--line)}
.ys-title{flex:1;margin:0;font-size:1.15rem;font-weight:800;letter-spacing:-.02em;text-align:center}
.ys-ib{width:44px;height:44px;border:0;background:transparent;color:inherit;border-radius:12px;display:grid;place-items:center;text-decoration:none;cursor:pointer;font-size:1.15rem;flex:none}
.ys-ib:focus-visible{outline:2px solid var(--acc)}
.ys-cats{display:flex;gap:8px;overflow-x:auto;padding:10px 12px 8px;flex:none;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ys-cats::-webkit-scrollbar{display:none}
.ys-cat{flex:none;border:1px solid var(--line);background:var(--card);color:var(--txt);border-radius:999px;padding:8px 14px;font-weight:700;font-size:.88rem;cursor:pointer;white-space:nowrap}
.ys-cat[aria-selected=true]{background:var(--acc);border-color:var(--acc);color:#fff}
.ys-body{flex:1;overflow:auto;padding:4px 14px 28px;-webkit-overflow-scrolling:touch}
.ys-lead{color:var(--muted);font-size:.92rem;line-height:1.45;margin:4px 0 14px}
.ys-grid{display:grid;gap:10px}
@media(min-width:720px){.ys-grid{grid-template-columns:1fr 1fr}}
.ys-card{text-align:left;border:1px solid var(--line);background:var(--card);border-radius:16px;padding:14px 14px 12px;cursor:pointer;color:inherit;width:100%}
.ys-card h3{margin:0 0 6px;font-size:1.02rem;line-height:1.3}
.ys-card p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ys-card .ys-meta{display:flex;gap:8px;margin:10px 0 0;font-size:.75rem;font-weight:700;color:#fda4af}
.ys-sheet{position:fixed;inset:0;background:#0008;z-index:8;display:flex;align-items:flex-end;justify-content:center}
.ys-sh{background:#14151b;width:min(720px,100%);max-height:96dvh;border-radius:18px 18px 0 0;overflow:auto;padding:10px 16px 28px;box-shadow:0 -8px 40px #0008}
.ys-grab{width:40px;height:4px;border-radius:4px;background:#ffffff30;margin:4px auto 10px}
.ys-sh h2{margin:0 0 8px;font-size:1.25rem;line-height:1.3}
.ys-acts{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}
.ys-btn{border:0;border-radius:999px;padding:10px 16px;font-weight:800;font-size:.9rem;cursor:pointer;background:var(--acc);color:#fff}
.ys-btn.ghost{background:#ffffff14;color:var(--txt)}
.ys-block{margin:0 0 14px}
.ys-lab{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--acc2);margin:0 0 4px}
.ys-block p,.ys-tip{margin:0;font-size:.98rem;line-height:1.55;white-space:pre-wrap}
.ys-tips{background:#1a1214;border:1px solid #3f1d22;border-radius:14px;padding:12px 14px;margin:0 0 16px}
.ys-tips h3{margin:0 0 8px;font-size:.95rem}
.ys-tips li{margin:0 0 6px;color:#e4e4e7;font-size:.9rem;line-height:1.4}
.ys-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#fff;color:#111;padding:10px 16px;border-radius:999px;font-weight:700;opacity:0;pointer-events:none;transition:.2s;z-index:9}
.ys-toast.on{opacity:1;transform:translateX(-50%)}
