* { box-sizing: border-box; }
:root { --green:#6f3fc7; --green-dark:#5528a8; --purple:#6f3fc7; --purple-dark:#5528a8; --bg:#f5f6f4; --card:#fff; --text:#171717; --muted:#666; --border:#ddd; --danger:#b42318; }
body { margin:0; font-family: Arial, Helvetica, sans-serif; color:var(--text); background:var(--bg); }
a { color:inherit; }
.page-bg { min-height:100vh; background:url('assets/p3-bg.jpg') center/cover no-repeat; display:flex; align-items:center; justify-content:center; padding:40px 16px; position:relative; }
.page-bg.admin-login { background-image:url('../assets/p3-bg.jpg'); }
.page-bg::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,.5); }
.wrap { width:100%; max-width:720px; position:relative; z-index:1; }
.kiosk-card { margin-top:44px; }
.kiosk-actions { position:fixed; top:18px; right:18px; z-index:5; display:flex; align-items:center; gap:10px; }
.fullscreen-btn { width:42px; height:42px; border:1px solid rgba(255,255,255,.45); border-radius:999px; background:rgba(111,63,199,.86); color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 10px 28px rgba(0,0,0,.18); backdrop-filter:blur(8px); }
.fullscreen-btn:hover { background:var(--purple-dark); }
.fullscreen-btn svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.admin-link { color:rgba(255,255,255,.76); font-size:13px; text-decoration:none; padding:8px 10px; border-radius:999px; background:rgba(0,0,0,.18); backdrop-filter:blur(8px); }
.admin-link:hover { color:#fff; background:rgba(0,0,0,.28); }
.topbar { display:flex; justify-content:space-between; align-items:center; color:white; margin-bottom:20px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; }
.brand img { height:32px; width:auto; }
.card { background:var(--card); border:1px solid var(--border); border-radius:8px; box-shadow:0 18px 45px rgba(0,0,0,.22); }
.card-pad { padding:28px; }
h1 { margin:0 0 8px; text-align:center; font-size:32px; }
p.sub { margin:0 0 24px; text-align:center; color:var(--muted); }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { margin-bottom:16px; }
label { display:block; font-size:14px; font-weight:700; margin-bottom:6px; }
input, select, textarea { width:100%; border:1px solid var(--border); border-radius:6px; padding:11px 12px; font:inherit; background:white; }
textarea { min-height:88px; resize:vertical; }
.btn { border:0; border-radius:6px; padding:12px 16px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.btn-primary { background:var(--purple); color:white; width:100%; }
.btn-primary:hover { background:var(--purple-dark); }
.btn-light { background:#eef0ed; }
.error { color:var(--danger); font-size:13px; margin-top:5px; }
.notice { text-align:center; padding:34px 20px; }
.notice strong { display:block; font-size:24px; margin-bottom:8px; }
.admin-header { background:#fff; border-bottom:1px solid #e2e8f0; position:sticky; top:0; z-index:10; }
.admin-header-inner { max-width:1248px; margin:0 auto; min-height:56px; padding:0 0; display:flex; align-items:center; justify-content:space-between; gap:14px; }
.admin-header .brand { color:#020617; text-decoration:none; font-weight:700; font-size:16px; }
.admin-header .brand img { height:24px; width:auto; }
.admin-header .actions { gap:18px; }
.admin-header .muted { color:#475569; text-decoration:none; font-size:14px; }
.admin-header .muted:hover { color:#0f172a; }
.admin-page { background:#f8fafc; min-height:100vh; }
.admin-main { max-width:1248px; margin:0 auto; padding:32px 0 48px; }
.actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.filters { display:grid; grid-template-columns:minmax(260px, 2.6fr) minmax(160px, 1fr) minmax(150px, .9fr) minmax(160px, 1fr) auto auto; gap:12px; align-items:end; margin-bottom:24px; }
.filter-card { background:white; border:1px solid #dbe3ef; border-radius:12px; box-shadow:0 2px 5px rgba(15, 23, 42, .10); padding:22px 16px 16px; }
.filter-field label { display:block; color:#475569; font-size:12px; font-weight:500; margin-bottom:4px; }
.search-wrap { position:relative; }
.search-wrap input { padding-left:12px; }
.admin-main input, .admin-main select { height:36px; border:1px solid #dbe3ef; border-radius:7px; padding:7px 12px; font-size:14px; background:#fff; color:#0f172a; box-shadow:0 1px 3px rgba(15,23,42,.08); }
.admin-main input::placeholder { color:#64748b; }
.admin-main select { appearance:auto; }
.btn { border:0; border-radius:6px; padding:10px 14px; min-height:36px; font-weight:700; cursor:pointer; display:inline-flex; gap:8px; align-items:center; justify-content:center; text-decoration:none; white-space:nowrap; }
.btn-primary { background:var(--purple); color:white; width:100%; }
.btn-primary:hover { background:var(--purple-dark); }
.btn-light { background:#fff; color:#0f172a; border:1px solid #dbe3ef; box-shadow:0 1px 3px rgba(15,23,42,.10); }
.btn-ghost { background:transparent; color:#0f172a; padding-left:10px; padding-right:10px; }
.btn-filter { background:#0f172a; color:#fff; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px; }
.stat { background:white; border:1px solid #dbe3ef; border-radius:12px; padding:20px 18px; min-height:91px; display:flex; align-items:center; justify-content:space-between; box-shadow:0 2px 5px rgba(15, 23, 42, .10); }
.stat span { display:block; color:#52658a; font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:0; }
.stat strong { display:block; color:#020617; font-size:30px; line-height:1; margin-top:8px; }
.stat-icon { flex:0 0 auto; width:40px; height:40px; border-radius:999px; background:#e5e7eb; color:#0f172a; display:flex; align-items:center; justify-content:center; }
.stat-icon svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.table-card { background:white; border:1px solid #dbe3ef; border-radius:12px; overflow:hidden; margin-bottom:18px; box-shadow:0 2px 5px rgba(15, 23, 42, .10); }
.table-title { padding:14px 16px; border-bottom:1px solid #e2e8f0; display:flex; justify-content:space-between; align-items:center; font-weight:700; }
.table-title .badge { background:#f1f5f9; border:0; color:#0f172a; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; padding:11px 8px; border-bottom:1px solid #e2e8f0; vertical-align:middle; font-size:14px; }
th { color:#52658a; font-weight:700; background:#fff; }
td strong { font-weight:700; }
tr:last-child td { border-bottom:0; }
.badge { border:1px solid #dbe3ef; border-radius:999px; padding:4px 12px; font-size:12px; white-space:nowrap; background:#fff; color:#020617; }
.muted { color:#52658a; }
.empty-state { text-align:center; color:#64748b; background:white; border:1px solid #dbe3ef; border-radius:12px; padding:34px; }
@media (max-width: 1280px) { .admin-header-inner, .admin-main { margin-left:80px; margin-right:80px; } }
@media (max-width: 980px) { .filters { grid-template-columns:1fr 1fr; } .stats { grid-template-columns:1fr 1fr; } .admin-header-inner, .admin-main { margin-left:16px; margin-right:16px; } }
@media (max-width: 640px) { .grid, .filters, .stats { grid-template-columns:1fr; } h1 { font-size:26px; } .admin-header-inner { align-items:flex-start; flex-direction:column; padding:12px 0; } }

@media (display-mode: fullscreen) { .kiosk-actions { opacity:.25; transition:opacity .2s ease; } .kiosk-actions:hover { opacity:1; } }
