*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#f3f6f9;color:#1d2733}
.card{max-width:420px;margin:0 auto;padding:20px 16px;background:#fff;min-height:100vh}
h1{font-size:22px;margin:4px 0 16px;color:#13627a}
h2{font-size:17px;margin:24px 0 10px}
h3{font-size:15px;margin:20px 0 8px}
a{color:#13627a}

/* ---------- Trang khach: anh quang cao toan man hinh + nut tron ---------- */
body.portal{background:#0d1b24;min-height:100vh;min-height:100dvh;overflow:hidden}
.portal .ad,.portal .ad img{position:fixed;inset:0;width:100%;height:100%}
.portal .ad img{object-fit:cover;display:block}
.owner-name{position:fixed;top:30%;left:0;right:0;text-align:center;color:#fff;font-size:28px;padding:0 16px}
.go-wrap{position:fixed;left:0;right:0;bottom:calc(32px + env(safe-area-inset-bottom));display:flex;justify-content:center}
.go{position:relative;width:120px;height:120px;margin:0;padding:0;border-radius:50%;border:0;cursor:pointer;
  background:rgba(13,27,36,.72);color:#fff;font-size:18px;font-weight:700;letter-spacing:.3px;
  box-shadow:0 6px 24px rgba(0,0,0,.35);-webkit-tap-highlight-color:transparent;backdrop-filter:blur(4px)}
.go svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.go circle{fill:none;stroke-width:8}
.go .track{stroke:rgba(255,255,255,.28)}
.go .bar{stroke:#2fd2a5;stroke-linecap:round}
.go span{position:relative;font-variant-numeric:tabular-nums}
.go:not(.running){animation:pulse 1.8s ease-in-out infinite}
.go.running{cursor:default}
@keyframes pulse{50%{transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.go:not(.running){animation:none}}

/* ---------- Admin ---------- */
label{display:block;font-size:14px;margin:12px 0 6px}
input:not([type]),input[type=text],input[type=number],input[type=file]{width:100%;padding:10px;font-size:15px;border:1px solid #c9d3dd;border-radius:8px;background:#fff;margin-top:4px}
button{width:100%;margin-top:16px;padding:12px;font-size:16px;font-weight:600;color:#fff;background:#13627a;border:0;border-radius:10px;cursor:pointer}
.error{color:#b42318;background:#fdecea;padding:10px;border-radius:8px}
.muted{color:#5b6b79;font-size:14px}
.admin{max-width:1100px;margin:0 auto;padding:20px 16px}
.scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden;font-size:14px}
th,td{padding:8px 10px;border-bottom:1px solid #e5eaf0;text-align:left;vertical-align:top}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:4px 16px;background:#fff;padding:12px;border-radius:10px}
.grid button{grid-column:1/-1}
button.small{width:auto;margin:0;padding:6px 10px;font-size:13px}
button.off{background:#9aa5b1}
button.danger{background:#b42318}
.ad-item{display:flex;flex-wrap:wrap;gap:16px;background:#fff;border-radius:10px;padding:12px;margin-bottom:12px}
.ad-item.inactive{opacity:.55}
.thumbs{display:flex;gap:8px;flex-wrap:wrap}
.thumb{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:#5b6b79;text-decoration:none}
.thumb img{height:110px;max-width:200px;object-fit:contain;background:#eef2f5;border-radius:6px}
.thumb.empty{justify-content:center;height:110px;width:90px;background:#f5f7f9;border:1px dashed #c9d3dd;border-radius:6px;text-align:center;padding:4px}
.ad-meta{display:flex;flex-direction:column;gap:8px;align-items:flex-start}