@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable-dynamic-subset.css");

:root {
  --font-sans:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif;
  --primary:#2563eb; --primary-dark:#1d4ed8; --primary-soft:#eff6ff;
  --ink:#172033; --muted:#64748b; --line:#dbe3ee; --line-strong:#bdc9d8;
  --surface:#eef2f7; --surface-soft:#f7f9fc; --white:#fff;
  --header-bg:linear-gradient(180deg,#fbfdff 0%,#f3f7fc 100%);
  --nav-bg:#eaf0f7;
  --footer-bg:linear-gradient(180deg,#f3f6fb 0%,#e8eef6 100%);
  --success:#2f6b55; --success-bg:#edf6f1;
  --warning:#826123; --warning-bg:#faf5e8; --danger:#dc2626; --danger-bg:#fef2f2;
  --radius:12px; --shadow:0 1px 2px rgb(30 64 175/.04),0 10px 30px rgb(30 64 175/.055);
  --chrome-shadow:0 1px 0 rgb(255 255 255/.7) inset,0 8px 24px rgb(15 23 42/.05);
}
* { box-sizing:border-box; }
html { overflow-x:hidden; }
body {
  min-width:320px; margin:0; overflow-x:hidden; color:var(--ink);
  background:
    radial-gradient(1200px 420px at 12% -8%, rgb(37 99 235/.07), transparent 55%),
    radial-gradient(900px 360px at 92% 0%, rgb(14 165 233/.05), transparent 50%),
    var(--surface);
  font:15px/1.65 var(--font-sans);
  word-break:keep-all; -webkit-font-smoothing:antialiased;
}
a { color:var(--primary); text-underline-offset:3px; }
a:hover { color:var(--primary-dark); }
:focus-visible { outline:3px solid #60a5fa; outline-offset:3px; }
.shell { width:min(1180px,100%); margin-inline:auto; padding-inline:clamp(18px,3vw,32px); }
.skip-link { position:fixed; top:8px; left:8px; z-index:20; transform:translateY(-180%); padding:10px 14px; background:var(--ink); color:#fff; border-radius:7px; }
.skip-link:focus { transform:translateY(0); }
.demo-banner { padding:7px 16px; border-bottom:1px solid #dbeafe; background:#eff6ff; color:#475569; text-align:center; font-size:12px; font-weight:600; letter-spacing:.005em; }
.demo-banner strong { color:var(--primary); }

.site-header {
  position:sticky; top:0; z-index:5;
  background:var(--header-bg);
  border-bottom:1px solid #c9d6e6;
  box-shadow:var(--chrome-shadow);
  backdrop-filter:saturate(1.1) blur(10px);
}
.header-row { min-height:68px; display:flex; gap:16px; align-items:center; justify-content:space-between; }
.header-search { position:relative; flex:1 1 220px; max-width:440px; min-width:0; }
.header-search input {
  width:100%; min-height:44px; border:1px solid #c5d2e3; border-radius:10px;
  padding:8px 11px 8px 36px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2366727e' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") no-repeat 11px center;
  color:var(--ink); font:inherit; box-shadow:0 1px 2px rgb(15 23 42/.03);
}
.header-search input:focus { border-color:#60a5fa; box-shadow:0 0 0 3px rgb(37 99 235/.12); outline:none; }
.header-search-suggest { position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:8; max-height:280px; overflow:auto; border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:var(--shadow); padding:6px; }
.header-search-option { display:flex; gap:8px; align-items:flex-start; width:100%; border:0; border-radius:7px; padding:8px 10px; background:transparent; color:var(--ink); cursor:pointer; font:inherit; text-align:left; }
.header-search-option:hover,.header-search-option:focus { background:var(--primary-soft); outline:none; }
.header-search-option > span:last-child { flex:1; min-width:0; line-height:1.4; }
.search-match-kinds { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:4px; }
.search-match-kind { display:inline-flex; align-items:center; min-height:20px; padding:1px 7px; border:1px solid #bfdbfe; border-radius:999px; background:var(--primary-soft); color:var(--primary-dark); font-size:11px; font-weight:700; letter-spacing:.01em; }
mark { background:#fde68a; color:inherit; padding:0 .12em; border-radius:3px; }
.brand { display:inline-flex; gap:10px; align-items:center; color:var(--ink); text-decoration:none; font-size:17px; font-weight:720; letter-spacing:-.02em; white-space:nowrap; }
.brand:hover { color:var(--ink); }
.brand-mark {
  display:grid; width:36px; height:36px; place-items:center;
  border:1px solid #b7cff8; border-radius:10px;
  background:linear-gradient(160deg,#eff6ff 0%,#dbeafe 100%);
  color:var(--primary); font-size:19px;
  box-shadow:0 1px 0 rgb(255 255 255/.8) inset,0 4px 10px rgb(37 99 235/.1);
}
.account,.action-group,.actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.account { justify-content:flex-end; }
.account-email { color:var(--muted); font-size:13px; overflow-wrap:anywhere; }
.tenant-badge,.badge { display:inline-flex; align-items:center; width:max-content; min-height:25px; padding:3px 9px; border:1px solid var(--line); border-radius:999px; font-size:12px; font-weight:650; line-height:1.2; }
.tenant-identity { gap:6px; }
.tenant-logo { width:20px; height:20px; border-radius:50%; background:#fff; object-fit:contain; }
.tenant-badge,.badge-neutral { background:#f1f3f5; color:#4c5965; }
.badge-admin { background:var(--primary-soft); border-color:#bfdbfe; color:var(--primary-dark); }
.badge-active { background:var(--success-bg); border-color:#cce2d6; color:var(--success); }
.badge-warning { background:var(--warning-bg); border-color:#eadcb5; color:var(--warning); }
.badge-danger { background:var(--danger-bg); border-color:#fecaca; color:#b91c1c; }

.primary-nav-bar {
  border-top:1px solid rgb(203 213 225/.55);
  background:linear-gradient(180deg, #eef3f9 0%, #e6edf6 100%);
}
.primary-nav {
  display:flex; gap:6px; overflow-x:auto; scrollbar-width:thin;
  padding:8px 0 10px; margin-top:0;
}
.primary-nav a {
  display:inline-flex; gap:7px; align-items:center;
  min-height:38px; padding:6px 12px; border-radius:9px;
  color:#526277; text-decoration:none; white-space:nowrap; font-weight:600;
  border:1px solid transparent; transition:background .25s cubic-bezier(.16,1,.3,1),color .25s cubic-bezier(.16,1,.3,1),border-color .25s cubic-bezier(.16,1,.3,1);
}
.primary-nav a:hover { color:var(--ink); background:rgb(255 255 255/.72); border-color:rgb(203 213 225/.8); }
.primary-nav a.is-active {
  color:var(--primary-dark);
  background:#fff;
  border-color:#c7dbf7;
  box-shadow:0 1px 2px rgb(37 99 235/.08);
}
.primary-nav a.is-active iconify-icon { color:var(--primary); }

.page { min-height:calc(100vh - 184px); padding-top:36px; padding-bottom:56px; }
.site-footer {
  border-top:1px solid #c9d6e6;
  background:var(--footer-bg);
  padding:26px 0 28px;
  color:var(--muted);
  font-size:12px;
  box-shadow:0 -8px 24px rgb(15 23 42/.03);
  text-align:center;
}
.site-footer-inner {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:10px;
}
.site-footer-brand {
  display:inline-flex; gap:8px; align-items:center; justify-content:center;
  color:var(--ink); font-size:13px; font-weight:700; letter-spacing:-.01em;
}
.site-footer-brand .brand-mark { width:28px; height:28px; border-radius:8px; font-size:15px; }
.site-footer p { margin:0; text-align:center; }
.site-footer-copy { color:#6b7a8d; text-align:center; }
.demo-footer-notice { margin:0; color:#dc2626; font-size:13px; font-weight:700; letter-spacing:.005em; text-align:center; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:6px; font-size:clamp(25px,3vw,32px); font-weight:740; letter-spacing:-.035em; line-height:1.3; text-wrap:balance; }
h2 { font-size:17px; font-weight:700; letter-spacing:-.018em; line-height:1.45; }
.page-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:28px; }
.page-heading p { max-width:62ch; margin-bottom:0; color:var(--muted); }

.btn { display:inline-flex; min-height:44px; gap:7px; align-items:center; justify-content:center; border:1px solid transparent; border-radius:9px; padding:8px 14px; background:#fff; color:var(--ink); cursor:pointer; font:inherit; font-weight:650; text-decoration:none; transition:background-color .2s cubic-bezier(.16,1,.3,1),border-color .2s cubic-bezier(.16,1,.3,1),color .2s cubic-bezier(.16,1,.3,1),box-shadow .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1); }
.btn:hover { color:var(--ink); }
.btn:hover { transform:translateY(-1px); }
.btn:active { transform:scale(.98); }
.btn-primary { background:var(--primary); color:#fff; box-shadow:0 6px 16px rgb(37 99 235/.18); }
.btn-primary:hover { background:var(--primary-dark); color:#fff; box-shadow:0 9px 22px rgb(37 99 235/.24); }
.btn-outline { border-color:var(--line-strong); }
.btn-outline:hover { border-color:#aab5bf; background:#f6f8f9; }
.btn-danger { background:var(--danger); color:#fff; border-color:#dc2626; box-shadow:0 6px 16px rgb(220 38 38/.18); }
.btn-danger:hover { background:#b91c1c; color:#fff; border-color:#b91c1c; box-shadow:0 9px 22px rgb(220 38 38/.24); }
.btn:disabled { cursor:not-allowed; opacity:.5; }
.btn iconify-icon { flex:0 0 auto; font-size:18px; }

.card { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.card-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:18px 20px; border-bottom:1px solid #e5e9ec; }
.card-heading h2 { margin:0; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.metric-grid-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
#dashboard-stats-grid .metric-card,
#client-stats-grid .metric-card {
  position:relative;
  padding:16px 20px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 1px 2px rgb(23 33 43/.03);
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
#dashboard-stats-grid .metric-card p,
#client-stats-grid .metric-card p {
  margin:0;
  color:var(--muted);
  font-size:13.5px;
  font-weight:650;
  white-space:nowrap;
}
#dashboard-stats-grid .metric-card .metric-value,
#client-stats-grid .metric-card .metric-value {
  display:inline-flex;
  align-items:baseline;
  gap:3px;
  white-space:nowrap;
}
#dashboard-stats-grid .metric-card strong,
#client-stats-grid .metric-card strong {
  font-size:26px;
  line-height:1;
  font-weight:750;
  letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;
  color:var(--ink);
}
#dashboard-stats-grid .metric-card span,
#client-stats-grid .metric-card span {
  color:var(--muted);
  font-size:13px;
  font-weight:650;
}
.dashboard-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px; }

.table-scroll { overflow-x:auto; }
.data-grid { overflow:visible; margin-top:20px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.card .data-grid { margin-top:0; border:0; border-radius:0; box-shadow:none; }
.card:has(.data-grid) { overflow:visible; }
.data-grid-toolbar { display:grid; grid-template-columns:minmax(220px,360px) 1fr auto; gap:12px; align-items:end; padding:14px 16px; border-bottom:1px solid var(--line); background:#fbfcfc; }
.data-grid-toolbar.is-compact { grid-template-columns:minmax(220px,360px) 1fr; }
.data-grid-actions { display:flex; flex-wrap:wrap; gap:8px; }
.data-grid-search { position:relative; display:grid; gap:5px; color:#4d5964; font-size:12px; font-weight:650; }
.data-grid-suggest { z-index:12; }
.data-grid-search input { width:100%; min-height:44px; border:1px solid var(--line-strong); border-radius:8px; padding:8px 11px 8px 36px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2366727e' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") no-repeat 11px center; color:var(--ink); font:inherit; }
.data-grid-search input:focus { border-color:#60a5fa; box-shadow:0 0 0 3px rgb(37 99 235/.12); outline:none; }
.data-grid-summary { align-self:center; color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.data-grid-reset,.data-grid-export { min-height:46px; }
.data-grid-sort { display:flex; width:100%; align-items:center; justify-content:space-between; gap:8px; border:0; padding:0; background:transparent; color:inherit; cursor:pointer; font:inherit; text-align:left; }
.data-grid-sort:hover { color:var(--primary); }
.data-grid-sort:focus-visible { border-radius:3px; outline:2px solid #60a5fa; outline-offset:3px; }
.sort-indicator { color:#87939e; font-size:14px; font-weight:500; }
.data-grid-empty td { padding:32px 16px!important; color:var(--muted); text-align:center; }
.responsive-table { width:100%; border-collapse:collapse; text-align:left; }
.responsive-table caption { padding:12px 20px; text-align:left; color:var(--muted); font-size:13px; }
.responsive-table th { padding:8px 12px; background:#f7f8f9; border-bottom:1px solid var(--line); color:#4d5964; font-size:12px; font-weight:680; letter-spacing:.01em; }
.responsive-table td { padding:7px 12px; border-bottom:1px solid #e8ecef; vertical-align:middle; overflow-wrap:anywhere; font-size:13.5px; line-height:1.45; }
.data-grid .responsive-table .btn { min-height:33px; padding:3px 9px; border-radius:7px; font-size:12.5px; }
.data-grid .responsive-table .badge { min-height:22px; padding-block:2px; }
.data-grid .responsive-table tbody tr.is-striped { background:#f6f9ff; }
.data-grid .responsive-table tbody tr.is-striped:hover { background:#eef5ff; }
.data-grid .responsive-table tbody tr.is-inactive { background:#f1f5f9; color:#8491a3; }
.data-grid .responsive-table tbody tr.is-inactive:hover { background:#e9eef4; }
.data-grid .responsive-table tbody tr.is-inactive a:not(.btn) { color:#64748b; }
.data-grid .responsive-table tbody tr.is-inactive .btn { border-color:#cbd5e1; background:#f8fafc; color:#64748b; box-shadow:none; }
.responsive-table tbody tr:hover { background:#fafbfb; }
.responsive-table tbody tr:last-child td { border-bottom:0; }
.mono { font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace; font-size:.88em; font-variant-numeric:tabular-nums; }
.empty-state { padding:30px 16px; color:var(--muted); text-align:center; }
.activity-list { display:grid; gap:0; margin:0; padding:0; list-style:none; }
.activity-list li { display:grid; grid-template-columns:auto auto 1fr; gap:9px; align-items:center; padding:12px 18px; border-bottom:1px solid #e8ecef; }
.activity-list li:last-child { border-bottom:0; }

.alert { margin-bottom:20px; padding:12px 14px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.alert-danger { color:var(--danger); border-color:#ecccd0; background:var(--danger-bg); }
.form-group { margin-bottom:18px; }
.form-label { display:block; margin:0 0 6px; color:#3c4853; font-weight:650; }
.form-help { margin:5px 0 0; color:var(--muted); font-size:13px; }
.form-error { margin:5px 0 0; color:var(--danger); font-size:13px; font-weight:650; }
.form-input,.form-select,.form-textarea { width:100%; min-height:44px; border:1px solid var(--line-strong); border-radius:8px; padding:9px 11px; background:#fff; color:var(--ink); font:inherit; transition:border-color .18s ease,box-shadow .18s ease; }
.form-input:hover,.form-select:hover,.form-textarea:hover { border-color:#9da9b3; }
.form-input:focus,.form-select:focus,.form-textarea:focus { border-color:#60a5fa; box-shadow:0 0 0 3px rgb(37 99 235/.12); outline:none; }
.form-textarea { min-height:110px; resize:vertical; }
.form-input[aria-invalid="true"],.form-select[aria-invalid="true"],.form-textarea[aria-invalid="true"] { border-color:var(--danger); }
.pagination { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:20px; }
.filter-panel,.form-card { margin:20px 0; padding:20px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.filter-panel { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
.filter-panel label,.form-card label { display:grid; gap:6px; color:#475569; font-size:13px; font-weight:650; }
.filter-panel input,.form-card input:not([type="checkbox"]):not([type="file"]),.form-card select,.form-card textarea { min-height:42px; border:1px solid var(--line-strong); border-radius:8px; padding:8px 10px; background:#fff; color:var(--ink); font:inherit; }
.filter-panel input:focus,.form-card input:focus,.form-card select:focus,.form-card textarea:focus { border-color:#60a5fa; box-shadow:0 0 0 3px rgb(37 99 235/.12); outline:none; }
.form-card { display:grid; gap:16px; max-width:860px; }
.form-card textarea { min-height:120px; resize:vertical; }
.form-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }

/* Compact Form Grid & Redesign */
.form-grid { display:grid; grid-template-columns:repeat(12, minmax(0, 1fr)); gap:14px; }
.form-grid > label { display:flex; flex-direction:column; gap:6px; margin:0; }
.col-12 { grid-column:span 12; }
.col-8 { grid-column:span 8; }
.col-6 { grid-column:span 6; }
.col-5 { grid-column:span 5; }
.col-4 { grid-column:span 4; }
.col-3 { grid-column:span 3; }

.form-meta-banner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:12px 16px; background:#f8fafc; border:1px solid var(--line); border-radius:10px; margin-bottom:4px; }
.form-meta-banner p { margin:0; }
.form-meta-group { display:flex; align-items:center; gap:10px; }
.form-meta-title { font-size:11.5px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.02em; display:block; }
.form-meta-text { font-size:14px; font-weight:700; color:var(--ink); }

.checkbox-panel { display:flex!important; flex-direction:row!important; align-items:center; justify-content:space-between; gap:12px; padding:11px 16px; border:1px solid var(--line); border-radius:10px; background:#f8fafc; cursor:pointer; transition:border-color .15s ease, background .15s ease; }
.checkbox-panel:hover { border-color:#93c5fd; background:#f0f7ff; }
.checkbox-panel-desc { display:flex; flex-direction:column; gap:2px; }
.checkbox-panel-title { font-size:13px; font-weight:700; color:var(--ink); }
.checkbox-panel-sub { font-size:11.5px; font-weight:500; color:var(--muted); }
.checkbox-panel input[type="checkbox"] { width:18px; height:18px; accent-color:var(--primary); cursor:pointer; flex-shrink:0; }

.form-textarea-compact { min-height:84px!important; resize:vertical; font-size:13.5px; }

/* Assets & QR Section Redesign */
.report-assets-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; margin-top:10px; margin-bottom:16px; }
.asset-card { display:flex; flex-direction:column; justify-content:space-between; gap:14px; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.asset-card-header { display:flex; align-items:flex-start; gap:12px; }
.asset-card-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:#eff6ff; color:var(--primary); font-size:20px; flex-shrink:0; }
.asset-card-icon.asset-icon-qr { background:#f0fdf4; color:#16a34a; }
.asset-card-title { font-size:14px; font-weight:700; margin:0 0 2px; color:var(--ink); }
.asset-card-desc { font-size:12px; color:var(--muted); margin:0; line-height:1.4; }
.file-upload-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.file-upload-row label { flex:1; margin:0; }
.asset-status-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:4px; }
.btn-sm { min-height:36px; padding:5px 12px; font-size:12.5px; }
.qr-history-meta { display:flex; flex-wrap:wrap; gap:10px; font-size:12.5px; color:var(--muted); margin-bottom:12px; }
.qr-history-meta strong { color:var(--ink); }
.btn-qr-download-group { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }

/* Inline PDF Upload Panel */
.pdf-upload-panel { background:#f8fafc; border:1px solid var(--line); border-radius:10px; padding:14px 16px; display:flex; flex-direction:column; gap:12px; }
.pdf-upload-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.pdf-upload-title-wrap { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.pdf-upload-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:8px; background:#eff6ff; color:var(--primary); font-size:18px; flex-shrink:0; }
.pdf-upload-title { font-size:13.5px; font-weight:700; color:var(--ink); }
.pdf-upload-sub { font-size:11.5px; color:var(--muted); }
.pdf-upload-status { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }

/* QR Tabbed Interface */
.report-management-shell { margin-top:14px; }
.management-tabs { display:flex; align-items:center; gap:8px; padding:7px; margin-bottom:18px; border:1px solid var(--line); border-radius:14px; background:#f8fafc; box-shadow:0 1px 3px rgba(15,23,42,.04); }
.management-tab-btn { flex:1; min-height:48px; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 18px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--muted); font:inherit; font-size:14px; font-weight:700; cursor:pointer; transition:all .15s ease; }
.management-tab-btn iconify-icon { font-size:20px; }
.management-tab-btn:hover { color:var(--ink); background:#fff; }
.management-tab-btn.active { color:var(--primary); background:#fff; border-color:#bfdbfe; box-shadow:0 2px 8px rgba(37,99,235,.1); }
.management-tab-btn.active .tab-badge { color:#fff; background:var(--primary); }
.qr-tabs-container { margin-top:0; }
.qr-tabs-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; border-bottom:1px solid var(--line); padding-bottom:12px; margin-bottom:16px; }
.qr-management-section + .qr-management-section { margin-top:18px; }
.qr-management-section-title { margin:0 0 10px; }
.qr-token-row { display:flex; align-items:center; gap:10px; margin:12px 0 0; color:var(--muted); font-size:13px; }
.qr-token-row code { padding:4px 8px; border:1px solid var(--line); border-radius:6px; background:#f8fafc; color:var(--ink); font-size:12.5px; }
.tab-list { display:flex; gap:6px; align-items:center; }
.tab-btn { display:inline-flex; align-items:center; gap:7px; padding:8px 14px; font-size:13px; font-weight:600; color:var(--muted); background:transparent; border:1px solid transparent; border-radius:8px; cursor:pointer; transition:all .15s ease; font-family:inherit; }
.tab-btn iconify-icon { font-size:16px; }
.tab-btn:hover { color:var(--ink); background:#f1f5f9; }
.tab-btn.active { color:var(--primary); background:#eff6ff; border-color:#bfdbfe; font-weight:700; }
.tab-badge { display:inline-block; padding:1px 6px; font-size:11px; font-weight:700; border-radius:9999px; background:#e2e8f0; color:#475569; }
.tab-btn.active .tab-badge { background:var(--primary); color:#fff; }
.tab-pane { display:none; }
.tab-pane.active { display:block; animation:tabFadeIn .18s ease; }
@keyframes tabFadeIn { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:translateY(0); } }

.qr-card-surface { padding:20px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.qr-panel-layout { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; }
.qr-panel-info { flex:1; min-width:280px; display:flex; flex-direction:column; gap:14px; }
.qr-panel-preview { display:flex; align-items:center; justify-content:center; }
.qr-preview-frame { padding:10px; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06); display:inline-block; }
.qr-preview-frame img { display:block; width:120px; height:120px; object-fit:contain; }
.qr-preview-button { display:block; padding:0; border:0; background:transparent; cursor:zoom-in; border-radius:8px; }
.qr-preview-button:focus-visible { outline:3px solid rgba(37,99,235,.3); outline-offset:3px; }
.qr-preview-dialog { width:min(92vw, 760px); max-height:92vh; padding:18px; border:0; border-radius:18px; box-shadow:0 24px 70px rgba(15,23,42,.3); }
.qr-preview-dialog::backdrop { background:rgba(15,23,42,.72); backdrop-filter:blur(3px); }
.qr-preview-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.qr-preview-dialog-header h3 { margin:0; font-size:17px; }
.qr-preview-dialog > img { display:block; width:min(100%, 640px); max-height:calc(92vh - 86px); margin:auto; object-fit:contain; }
.qr-preview-close { display:grid; place-items:center; width:38px; height:38px; padding:0; border:0; border-radius:10px; background:#f1f5f9; color:var(--ink); font-size:23px; cursor:pointer; }
.qr-action-bar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }

@media (max-width:768px) {
  .form-grid { grid-template-columns:1fr; }
  .col-12, .col-8, .col-6, .col-5, .col-4, .col-3 { grid-column:span 1; }
  .report-assets-grid { grid-template-columns:1fr; }
  .management-tabs { align-items:stretch; }
  .management-tab-btn { padding:9px 10px; font-size:13px; }
  .qr-tabs-header { flex-direction:column; align-items:stretch; }
  .tab-list { overflow-x:auto; padding-bottom:4px; }
  .qr-panel-layout { flex-direction:column-reverse; align-items:stretch; }
}
/* Clinical Trial Data & Metrics Display */
.clinical-section { margin-top:20px; }
.metric-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:12px; margin-bottom:18px; }
.metric-card { background:#f8fafc; border:1px solid var(--line); border-radius:10px; padding:14px; display:flex; flex-direction:column; gap:4px; }
.metric-card-primary { background:linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%); border-color:#bfdbfe; }
.metric-label { font-size:11.5px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.02em; }
.metric-value { font-size:17px; font-weight:800; color:var(--ink); line-height:1.2; word-break:break-word; }
.metric-value.highlight { color:#0284c7; font-size:20px; }
.metric-sub { font-size:11px; color:var(--muted); }

.clinical-data-table { width:100%; border-collapse:collapse; margin-top:12px; font-size:13.5px; }
.clinical-data-table th, .clinical-data-table td { padding:10px 12px; text-align:left; border-bottom:1px solid var(--line); }
.clinical-data-table th { background:#f8fafc; font-weight:700; color:var(--ink); font-size:12.5px; }
.clinical-badge-val { font-weight:800; color:#0369a1; background:#e0f2fe; padding:2px 8px; border-radius:6px; font-size:13px; display:inline-block; }

/* Inline PDF Viewer Component */
.pdf-viewer-wrapper { margin-top:16px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 4px 12px rgba(0,0,0,.04); }
.pdf-viewer-header { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; background:#f8fafc; border-bottom:1px solid var(--line); flex-wrap:wrap; gap:10px; }
.pdf-viewer-header-title { font-size:13px; font-weight:700; display:inline-flex; align-items:center; gap:6px; color:var(--ink); }
.pdf-viewer-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.pdf-viewer-frame { width:100%; height:580px; border:0; display:block; background:#525659; }
.pdf-viewer-collapsed .pdf-viewer-frame { display:none; }

.section-heading { margin:32px 0 12px; }
.icon-link { display:inline-flex; gap:6px; align-items:center; }
.icon-link iconify-icon,.primary-nav iconify-icon { font-size:18px; }
.organization-cell { display:inline-flex; gap:9px; align-items:center; font-weight:650; }
.organization-logo { width:30px; height:30px; border:1px solid var(--line); border-radius:8px; background:#fff; object-fit:contain; }
.organization-initial { display:inline-grid; width:30px; height:30px; flex:0 0 30px; place-items:center; border:1px solid #bfdbfe; border-radius:8px; background:#eff6ff; color:#2563eb; font-size:12px; font-weight:750; }
.logo-card { grid-template-columns:112px minmax(0,1fr); max-width:820px; align-items:center; }
.logo-preview { display:grid; width:112px; height:82px; place-items:center; overflow:hidden; border:1px dashed #93c5fd; border-radius:10px; background:#f8fbff; color:var(--primary); }
.logo-preview img { width:100%; height:100%; padding:8px; object-fit:contain; }
.logo-preview iconify-icon { font-size:30px; }
.logo-card h2 { margin-bottom:4px; }
.logo-upload { display:flex; flex-wrap:wrap; gap:10px; align-items:end; margin-top:12px; }
.logo-upload label { display:grid; gap:5px; color:#475569; font-size:13px; font-weight:650; }
.public-organization { display:flex; justify-content:flex-start; margin-bottom:18px; }
.public-organization img { width:min(180px,55%); height:64px; object-fit:contain; object-position:left center; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.login-page {
  position:relative; isolation:isolate;
  min-height:100dvh; display:grid; place-items:center; padding-block:40px;
  background:
    linear-gradient(90deg, rgb(13 25 34/.44) 0%, rgb(13 25 34/.2) 41%, rgb(13 25 34/.06) 100%),
    url("/images/login-clinical-lab.png") center center / cover no-repeat,
    var(--surface);
}
.login-page::before {
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgb(232 240 245/.06), rgb(7 20 29/.12));
  pointer-events:none;
}
.login-panel {
  width:min(430px,100%); padding:clamp(24px,5vw,34px);
  background:rgb(255 255 255/.94); border-color:rgb(255 255 255/.7);
  box-shadow:0 18px 52px rgb(8 20 29/.22),0 2px 8px rgb(8 20 29/.08);
  backdrop-filter:blur(5px);
}
.login-brand { display:inline-flex; align-items:center; gap:10px; margin-bottom:28px; color:var(--ink); font-weight:700; }
.login-panel>.form-help { margin-bottom:24px; }
.login-panel .form-label:not(:first-child) { margin-top:18px; }
.login-panel .btn { width:100%; margin-top:24px; }
.login-footer { position:relative; z-index:1; }
.login-footer .site-footer-copy { color:rgb(255 255 255/.82)!important; text-shadow:0 1px 5px rgb(8 20 29/.35); }
.public-report { width:min(700px,100%); margin:18px auto 0; padding:clamp(22px,4vw,32px); }
.public-report>.badge { margin-bottom:14px; }
.public-bridge h1 { margin:8px 0 10px; font-size:clamp(20px,4.5vw,26px); line-height:1.35; }
.public-bridge .bridge-details { margin:18px 0 24px; }
.public-bridge .bridge-url { overflow-wrap:anywhere; word-break:break-all; }
.public-bridge .bridge-actions { margin-top:8px; }
.report-details { display:grid; grid-template-columns:132px 1fr; margin:28px 0; border-top:1px solid var(--line); }
.report-details dt,.report-details dd { margin:0; padding:13px 4px; border-bottom:1px solid #e8ecef; }
.report-details dt { color:var(--muted); font-size:13px; font-weight:650; }
.report-details dd { overflow-wrap:anywhere; }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .tab-pane.active,.btn-guide-pulse::after,.qr-floating-usage-btn .pulse-ping { animation:none!important; }
  .btn,.header-search-option,.management-tab-btn,.tab-btn,.checkbox-panel,.demo-btn,.qr-floating-usage-btn {
    transition-property:background-color,border-color,color,box-shadow!important;
    transition-duration:.1s!important;
  }
}
@media (max-width:900px) { .dashboard-grid { grid-template-columns:1fr; } .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .account-email { display:none; } }
@media (max-width:640px) {
  .header-row { min-height:60px; } .brand { font-size:15px; } .account { gap:5px; }
  .header-search { flex-basis:100%; max-width:none; }
  .tenant-badge { max-width:115px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .primary-nav { gap:18px; } .page { padding-top:24px; padding-bottom:40px; }
  .page-heading { flex-direction:column; margin-bottom:22px; }
  .page-heading .btn,.action-group .btn { width:100%; } .action-group { width:100%; }
  .metric-grid,.metric-grid-three { grid-template-columns:1fr; gap:10px; } .metric-card { padding:12px 16px 11px; }
  .data-grid-toolbar { grid-template-columns:1fr; align-items:end; }
  .data-grid-actions { width:100%; }
  .data-grid-actions .btn { flex:1 1 auto; }
  .data-grid-summary { grid-column:1/-1; grid-row:2; }
  .responsive-table,.responsive-table tbody,.responsive-table tr,.responsive-table td { display:block; width:100%; }
  .responsive-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .responsive-table tr { margin:10px; width:calc(100% - 20px); border:1px solid var(--line); border-radius:8px; }
  .responsive-table td { display:flex; gap:16px; justify-content:space-between; align-items:flex-start; border-bottom:1px dashed var(--line-strong); }
  .data-grid .responsive-table .btn { min-height:44px; }
  .responsive-table td::before { content:attr(data-label); flex:0 0 38%; color:var(--muted); font-size:13px; font-weight:650; }
  .responsive-table td:last-child { border-bottom:0; } .responsive-table td[colspan] { display:block; } .responsive-table td[colspan]::before { content:none; }
  .activity-list li { grid-template-columns:1fr; gap:5px; }
  .report-details { grid-template-columns:1fr; } .report-details dt { padding-bottom:2px; border-bottom:0; } .report-details dd { padding-top:2px; }
  .logo-card { grid-template-columns:1fr; } .logo-preview { width:100%; height:96px; }
}
/* ==========================================================================
   Driver.js Custom Theme & Enhancements
   ========================================================================== */

.driver-popover {
  border-radius: 1rem !important;
  box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25), 0 0 0 1px rgba(226, 232, 240, 0.9) !important;
  padding: 1.25rem 1.25rem 1rem !important;
  max-width: 360px !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  font-family: var(--font-sans) !important;
  border: 1px solid #e2e8f0 !important;
  animation: qrPopoverFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes qrPopoverFadeIn {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(4px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.driver-popover-title {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  line-height: 1.4 !important;
  margin-bottom: 0.5rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.375rem !important;
}

.driver-popover-description {
  font-size: 0.875rem !important;
  color: #475569 !important;
  line-height: 1.55 !important;
  margin-bottom: 0.875rem !important;
}

.driver-popover-progress-text {
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #64748b !important;
  background-color: #f1f5f9 !important;
  padding: 0.2rem 0.5rem !important;
  border-radius: 9999px !important;
}

.driver-popover-footer {
  margin-top: 0.75rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.5rem !important;
}

.driver-popover-btn-group {
  display: flex !important;
  align-items: center !important;
  gap: 0.375rem !important;
}

.driver-popover-prev-btn,
.driver-popover-next-btn,
.driver-popover-close-btn {
  font-family: var(--font-sans) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  border-radius: 0.5rem !important;
  padding: 0.4rem 0.8rem !important;
  transition: all 0.15s ease-in-out !important;
  cursor: pointer !important;
}

.driver-popover-prev-btn {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #e2e8f0 !important;
}

.driver-popover-prev-btn:hover {
  background-color: #e2e8f0 !important;
  color: #1e293b !important;
}

.driver-popover-next-btn {
  background-color: #2563eb !important;
  color: #ffffff !important;
  border: 1px solid #1d4ed8 !important;
}

.driver-popover-next-btn:hover {
  background-color: #1d4ed8 !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3) !important;
}

.driver-popover-close-btn {
  color: #94a3b8 !important;
  font-size: 1.25rem !important;
  padding: 0.25rem !important;
  width: 2.75rem !important;
  height: 2.75rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.driver-popover-close-btn:hover {
  color: #334155 !important;
  background-color: #f1f5f9 !important;
}

/* Custom Controls Bar (Skip & Don't Show Again) */
.qr-tour-custom-controls {
  margin-top: 0.75rem;
  padding-top: 0.625rem;
  border-top: 1px dashed #e2e8f0;
}

.qr-tour-custom-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.qr-tour-checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: #64748b;
  cursor: pointer;
  user-select: none;
}

.qr-tour-checkbox-label input[type="checkbox"] {
  width: 0.875rem;
  height: 0.875rem;
  border-radius: 0.25rem;
  border: 1px solid #cbd5e1;
  accent-color: #2563eb;
  cursor: pointer;
}

.qr-tour-checkbox-label:hover {
  color: #334155;
}

.qr-tour-skip-btn {
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  background: transparent;
  border: none;
  min-height: 2.75rem;
  padding: 0.55rem 0.75rem;
  border-radius: 0.375rem;
  cursor: pointer;
  transition: all 0.15s ease;
}

.qr-tour-skip-btn:hover {
  color: #ef4444;
  background-color: #fef2f2;
}

/* Custom Guide Help Button Pulse Effect */
.btn-guide-pulse {
  position: relative;
}

.btn-guide-pulse::after {
  content: '';
  position: absolute;
  top: -2px;
  right: -2px;
  width: 8px;
  height: 8px;
  background-color: #3b82f6;
  border-radius: 50%;
  border: 2px solid white;
  animation: pulseDot 2s infinite;
}

@keyframes pulseDot {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(59, 130, 246, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
}

/* ==========================================================================
   Floating "사용법 보기" Action Button
   ========================================================================== */

.qr-floating-usage-btn {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 999;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem;
  border-radius: 9999px;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  color: #ffffff;
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  box-shadow: 0 10px 25px -3px rgba(37, 99, 235, 0.45), 0 4px 6px -2px rgba(37, 99, 235, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.25);
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
}

.qr-floating-usage-btn:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 16px 32px -4px rgba(37, 99, 235, 0.55);
  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
}

.qr-floating-usage-btn:active {
  transform: translateY(0) scale(0.98);
}

.qr-floating-usage-btn svg {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
}

.qr-floating-usage-btn .pulse-ping {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 10px;
  height: 10px;
  background-color: #60a5fa;
  border-radius: 50%;
  border: 2px solid #ffffff;
  animation: pulseDot 2s infinite;
}

@media (max-width: 767px) {
  .qr-floating-usage-btn {
    display: none !important;
  }
}

.swal2-container { z-index: 100000; }
.qr-toast.swal2-popup,
.qr-swal.swal2-popup {
  font-family: inherit;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.qr-toast.swal2-popup { font-size: 14px; font-weight: 650; padding: 12px 14px; }
.qr-swal.swal2-popup { padding: 1.4rem 1.35rem 1.2rem; }
.qr-swal-title { color: var(--ink) !important; font-size: 1.15rem !important; font-weight: 720 !important; }
.qr-swal-text { color: var(--muted) !important; font-size: 14px !important; }
.qr-swal-actions { gap: 8px !important; margin-top: 1.1rem !important; }

.demo-login-box {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.demo-login-heading {
  font-size: 12.5px;
  font-weight: 650;
  color: var(--muted);
  text-align: center;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.demo-login-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

/* Read-only operational WIKI */
.wiki-heading { align-items:center; }
.wiki-readonly { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:5px 11px; border:1px solid #cbd5e1; border-radius:999px; background:#f8fafc; color:#526277; font-size:12.5px; font-weight:680; white-space:nowrap; }
.wiki-readonly iconify-icon { font-size:17px; }
.wiki-layout { display:grid; grid-template-columns:250px minmax(0,1fr); gap:22px; align-items:start; }
.wiki-sidebar { position:sticky; top:148px; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.wiki-sidebar-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:17px 17px 14px; border-bottom:1px solid var(--line); }
.wiki-sidebar-heading h2 { margin:0; font-size:15px; }
.wiki-sidebar-heading span { color:var(--muted); font-size:12px; }
.wiki-tree { padding:8px 10px 12px; }
.wiki-tree details + details { margin-top:4px; }
.wiki-tree summary { display:grid; grid-template-columns:20px 1fr auto; gap:7px; align-items:center; min-height:38px; padding:6px 7px; border-radius:8px; color:#42516a; cursor:pointer; font-size:13px; font-weight:700; list-style:none; }
.wiki-tree summary::-webkit-details-marker { display:none; }
.wiki-tree summary:hover { background:#f4f7fb; }
.wiki-tree summary:focus-visible { outline:3px solid #60a5fa; outline-offset:1px; }
.wiki-tree summary > iconify-icon { color:#60799a; font-size:18px; transition:transform .18s ease; }
.wiki-tree details:not([open]) summary > iconify-icon { transform:rotate(-90deg); }
.wiki-tree-count { display:grid; min-width:21px; height:21px; place-items:center; border-radius:999px; background:#edf2f8; color:#66758a; font-size:11px; font-variant-numeric:tabular-nums; }
.wiki-tree-children { position:relative; margin-left:16px; padding:2px 0 5px 15px; }
.wiki-tree-children::before { content:""; position:absolute; top:0; bottom:8px; left:0; width:1px; background:#d5dee9; }
.wiki-tree-children button { position:relative; display:flex; width:100%; align-items:flex-start; gap:8px; min-height:40px; border:0; border-radius:8px; padding:8px 9px; background:transparent; color:#526277; cursor:pointer; font:inherit; font-size:12.5px; font-weight:610; line-height:1.45; text-align:left; }
.wiki-tree-children button::before { content:""; position:absolute; top:19px; left:-15px; width:11px; height:1px; background:#d5dee9; }
.wiki-tree-children button:hover { background:var(--primary-soft); color:var(--primary-dark); }
.wiki-tree-children button[aria-current="page"] { background:#e8f1ff; color:var(--primary-dark); font-weight:700; }
.wiki-tree-children button iconify-icon { flex:0 0 auto; margin-top:1px; color:#718096; font-size:17px; }
.wiki-content { min-width:0; }
.wiki-tabbar { display:flex; gap:5px; overflow-x:auto; margin-bottom:12px; padding:5px; border:1px solid var(--line); border-radius:11px; background:#e9eef5; scrollbar-width:thin; }
.wiki-tab-item { display:flex; flex:0 0 auto; align-items:center; min-width:0; border:1px solid transparent; border-radius:8px; color:#596779; }
.wiki-tab-item:has([aria-selected="true"]) { border-color:#c7d7eb; background:#fff; color:var(--primary-dark); box-shadow:0 1px 3px rgb(15 23 42/.08); }
.wiki-tab-item [role="tab"] { overflow:hidden; max-width:230px; min-height:38px; border:0; padding:7px 5px 7px 11px; background:transparent; color:inherit; cursor:pointer; font:inherit; font-size:12.5px; font-weight:680; text-overflow:ellipsis; white-space:nowrap; }
.wiki-tab-close { display:grid; width:34px; height:34px; flex:0 0 auto; place-items:center; border:0; border-radius:7px; background:transparent; color:#788597; cursor:pointer; }
.wiki-tab-close:hover { background:#edf2f7; color:#334155; }
.wiki-tab-close iconify-icon { font-size:17px; pointer-events:none; }
.wiki-article { scroll-margin-top:150px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.wiki-article > header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:22px 24px 14px; }
.wiki-article > header h2 { margin:4px 0 0; font-size:20px; letter-spacing:-.025em; }
.wiki-article > header time { flex:0 0 auto; padding-top:3px; color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.wiki-category { color:var(--primary-dark); font-size:11.5px; font-weight:720; }
.wiki-summary { max-width:70ch; margin:0; padding:0 24px 18px; color:#526277; line-height:1.7; }
.wiki-article > footer { display:flex; flex-wrap:wrap; gap:8px 20px; padding:13px 24px; border-top:1px solid var(--line); background:#f8fafc; color:#6b7889; font-size:12px; }
.wiki-steps,.wiki-checklist,.wiki-rules,.wiki-timeline { margin:0 24px 22px; padding:0; list-style:none; }
.wiki-steps { counter-reset:wiki-step; display:grid; gap:10px; }
.wiki-steps li { counter-increment:wiki-step; display:grid; grid-template-columns:30px minmax(130px,180px) 1fr; gap:10px; align-items:start; }
.wiki-steps li::before { content:counter(wiki-step); display:grid; width:26px; height:26px; place-items:center; border-radius:50%; background:var(--primary-soft); color:var(--primary-dark); font-size:12px; font-weight:760; }
.wiki-steps strong,.wiki-rules strong { font-size:13.5px; }
.wiki-steps span,.wiki-rules span { color:#596779; font-size:13.5px; }
.wiki-checklist { display:grid; gap:8px; }
.wiki-checklist li { display:flex; align-items:flex-start; gap:9px; padding:10px 12px; border-radius:9px; background:#f5f9f7; color:#425b50; font-size:13.5px; }
.wiki-checklist iconify-icon { flex:0 0 auto; margin-top:2px; color:var(--success); font-size:17px; }
.wiki-table-wrap { overflow-x:auto; margin:0 24px 22px; border:1px solid var(--line); border-radius:9px; }
.wiki-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.wiki-table th,.wiki-table td { padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; }
.wiki-table th { background:#f7f9fc; color:#526277; font-size:12px; }
.wiki-table tr:last-child td { border-bottom:0; }
.wiki-definition-list { display:grid; gap:0; margin:0 24px 16px; border-top:1px solid var(--line); }
.wiki-definition-list div { display:grid; grid-template-columns:130px 1fr; gap:18px; padding:11px 0; border-bottom:1px solid var(--line); }
.wiki-definition-list dt { font-weight:700; }
.wiki-definition-list dd { margin:0; color:#596779; }
.wiki-note { display:flex; gap:10px; margin:0 24px 22px; padding:11px 13px; border:1px solid #bfdbfe; border-radius:9px; background:var(--primary-soft); color:#395373; }
.wiki-note iconify-icon { flex:0 0 auto; margin-top:2px; color:var(--primary); font-size:18px; }
.wiki-note p { margin:0; font-size:13px; }
.wiki-rules { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.wiki-rules li { display:grid; gap:3px; padding:12px 14px; border:1px solid var(--line); border-radius:9px; background:#fbfcfe; }
.wiki-timeline { position:relative; display:grid; gap:0; }
.wiki-timeline::before { content:""; position:absolute; top:11px; bottom:11px; left:76px; width:1px; background:#cbd5e1; }
.wiki-timeline li { position:relative; display:grid; grid-template-columns:64px 14px 1fr; gap:12px; padding:8px 0; }
.wiki-timeline li::before { content:""; z-index:1; grid-column:2; width:10px; height:10px; margin-top:6px; border:3px solid #fff; border-radius:50%; background:var(--primary); box-shadow:0 0 0 1px #93b4ea; }
.wiki-timeline li > span { color:var(--primary-dark); font-size:12px; font-weight:700; text-align:right; }
.wiki-timeline li > div { grid-column:3; }
.wiki-timeline strong { font-size:13.5px; }
.wiki-timeline p { margin:1px 0 0; color:#596779; font-size:13.5px; }

@media (max-width:800px) {
  .wiki-layout { grid-template-columns:1fr; }
  .wiki-sidebar { position:static; }
  .wiki-tree { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .wiki-tree details + details { margin-top:0; }
  .wiki-tree-children { margin-left:8px; }
}
@media (max-width:560px) {
  .wiki-heading { align-items:flex-start; }
  .wiki-readonly { margin-top:3px; }
  .wiki-article > header { display:block; padding:19px 18px 12px; }
  .wiki-article > header time { display:block; margin-top:6px; }
  .wiki-summary { padding:0 18px 15px; }
  .wiki-steps,.wiki-checklist,.wiki-rules,.wiki-timeline { margin-inline:18px; }
  .wiki-steps li { grid-template-columns:30px 1fr; }
  .wiki-steps li span { grid-column:2; }
  .wiki-rules { grid-template-columns:1fr; }
  .wiki-table-wrap,.wiki-definition-list,.wiki-note { margin-inline:18px; }
  .wiki-definition-list div { grid-template-columns:1fr; gap:2px; }
  .wiki-article > footer { padding-inline:18px; }
  .wiki-tree { grid-template-columns:1fr; }
  .wiki-tab-item [role="tab"] { max-width:190px; }
}
.login-panel .demo-btn {
  margin-top: 0;
  min-height: 40px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 650;
  border-color: #cbd5e1;
  background: #f8fafc;
  color: var(--ink);
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: all 0.2s ease;
  cursor: pointer;
}
.login-panel .demo-btn:hover {
  background: #ffffff;
  border-color: var(--primary);
  color: var(--primary);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgb(37 99 235 / 0.12);
}