:root {
    --bd:#d7d7d7;
    --muted:#666;
    --ok:#0a6b44;
    --err:#9e1c1c;
    --bg-soft:#f7f7f7;
}
body {
    font-family: system-ui, sans-serif;
    margin: 2rem auto;
    max-width: 980px;
    padding: 0 1rem;
    line-height: 1.4;
}
.topbar {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
    margin-bottom:1rem;
}
.card {
    border:1px solid var(--bd);
    border-radius:12px;
    padding:1rem;
    margin:1rem 0;
    background:white;
}
.row { margin-bottom:1rem; }
label {
    display:block;
    font-weight:600;
    margin-bottom:.35rem;
}
input[type=text], input[type=password], textarea {
    width:100%;
    box-sizing:border-box;
    padding:.65rem;
    border:1px solid var(--bd);
    border-radius:8px;
}
button {
    padding:.65rem 1rem;
    border:1px solid var(--bd);
    border-radius:8px;
    background:#f2f2f2;
    cursor:pointer;
}
.muted { color:var(--muted); }
.success { color:var(--ok); font-weight:600; }
.error { color:var(--err); font-weight:600; }
.share-url {
    display:inline-block;
    background:var(--bg-soft);
    padding:.35rem .55rem;
    border-radius:8px;
    word-break:break-all;
}
.poster {
    max-width:360px;
    width:100%;
    height:auto;
    border-radius:8px;
    border:1px solid var(--bd);
}
.mini {
    font-size:.95rem;
}
.recent-list .card { margin:.75rem 0; }
.htmx-indicator { display:none; }
.htmx-request .htmx-indicator { display:inline; }
.slug-box {
    padding:.5rem .65rem;
    background:var(--bg-soft);
    border-radius:8px;
    border:1px solid var(--bd);
    margin-top:.5rem;
}
video {
    display:block;
    width:100%;
    height:auto;
    max-width:100%;
    background:black;
}
iframe.embed-frame {
    border:0;
    max-width:100%;
    display:block;
    background:black;
}