﻿:root {
            --bg:#fbf3e2;
            --panel:#fffaf1;
            --panel-2:#f6e6c3;
            --ink:#2a160f;
            --muted:#8a6248;
            --line:#e6c988;
            --blue:#0f6e63;
            --blue-2:#e0f0ec;
            --green:#15803d;
            --green-2:#dcfce7;
            --amber:#a9750f;
            --amber-2:#f7ecd2;
            --red:#a3231e;
            --red-2:#f7dfdb;
            --violet:#6b2d5c;
            --violet-2:#f1e3ee;
            --maroon:#5b214f;
            --maroon-deep:#35112f;
            --gold:#b8902e;
            --gold-bright:#dba63e;
            --sun-border:#c9a227;
            --shadow:0 18px 50px rgba(64,19,58,.16);
            --font-display:"Cinzel","Georgia",serif;
            font-family:"Mukta","Segoe UI",Arial,sans-serif;
        }
        * { box-sizing:border-box; }
        body {
            margin:0;
            background:
                radial-gradient(circle at 12% 8%, rgba(184,144,46,.16), transparent 26%),
                radial-gradient(circle at 90% 14%, rgba(91,33,79,.10), transparent 24%),
                linear-gradient(180deg,#fbf3e2 0%,#fdf7ea 42%,#f6e9cb 100%);
            color:var(--ink);
            font-size:14px;
            overflow-x:hidden;
        }
        h1,h2,h3,.brand-name { font-family:var(--font-display); letter-spacing:.01em; }
        h1 { font-size:18px; margin:0; font-weight:800; }
        h2 { font-size:15px; margin:0 0 12px; font-weight:800; }
        h3 { font-size:13px; margin:0; }
        a { color:var(--maroon); text-decoration:none; }
        button,input,select,textarea { font:inherit; }
        button { cursor:pointer; }

        .template-corner-emblem {
            position:fixed;
            top:12px;
            right:18px;
            width:clamp(82px,10vw,148px);
            height:auto;
            z-index:8;
            pointer-events:none;
            filter:drop-shadow(0 8px 18px rgba(53,17,47,.18));
        }
        .is-auth .template-corner-emblem {
            width:clamp(64px,6vw,96px);
        }

        .login {
            min-height:100vh;
            display:grid;
            grid-template-columns:minmax(280px,460px) 1fr;
        }
        .onboarding-login {
            grid-template-columns:minmax(560px,720px) 1fr;
        }
        .login-card {
            background:var(--panel);
            padding:42px;
            display:flex;
            flex-direction:column;
            justify-content:center;
            border-right:1px solid var(--line);
            min-width:0;
        }
        .login-card-wide { min-width:0; }
        .login-art {
            position:relative;
            overflow:hidden;
            padding:42px;
            display:flex;
            align-items:center;
            justify-content:center;
            background:
                radial-gradient(circle at 18% 12%, rgba(184,144,46,.30), transparent 34%),
                radial-gradient(circle at 88% 82%, rgba(91,33,79,.14), transparent 36%),
                linear-gradient(180deg,#f6e6c3 0%,#ecd6a8 46%,#e3c988 100%);
        }
        .login-art:before {
            content:"";
            position:absolute;
            left:50%;
            bottom:-4%;
            width:320px;
            height:262px;
            transform:translateX(-50%);
            background-repeat:no-repeat;
            background-image:
                radial-gradient(circle,var(--gold-bright) 0 48%,transparent 50%),
                linear-gradient(var(--maroon),var(--maroon)),
                linear-gradient(var(--maroon),var(--maroon)),
                linear-gradient(var(--maroon),var(--maroon)),
                linear-gradient(var(--maroon),var(--maroon)),
                linear-gradient(var(--gold),var(--gold));
            background-size:24px 24px,70px 44px,118px 48px,176px 54px,250px 64px,260px 8px;
            background-position:50% 0,50% 24px,50% 68px,50% 116px,50% 170px,50% 234px;
            opacity:.9;
        }
        .login-art > * { position:relative; z-index:1; }
        .auth-summary { max-width:520px; }

        .qr-screen {
            min-height:100vh;
            display:grid;
            grid-template-columns:minmax(320px,1fr) minmax(360px,560px);
            align-items:center;
            gap:28px;
            padding:42px;
            background:
                radial-gradient(circle at 18% 16%, rgba(219,166,62,.22), transparent 30%),
                radial-gradient(circle at 84% 82%, rgba(91,33,79,.13), transparent 32%),
                linear-gradient(135deg,#fffaf1 0%,#fbf3e2 48%,#efdcae 100%);
        }
        .qr-hero,
        .qr-panel { min-width:0; }
        .qr-brand { margin-bottom:28px; }
        .qr-kicker {
            color:var(--maroon);
            font-size:13px;
            text-transform:uppercase;
            letter-spacing:.12em;
            font-weight:900;
            margin:0 0 12px;
        }
        .qr-hero h1 {
            color:var(--maroon);
            font-size:clamp(30px,4vw,58px);
            line-height:1.08;
            max-width:760px;
            margin-bottom:16px;
        }
        .qr-copy {
            color:var(--muted);
            font-size:20px;
            line-height:1.5;
            max-width:680px;
            margin:0 0 24px;
        }
        .qr-actions { max-width:520px; }
        .qr-panel {
            display:flex;
            flex-direction:column;
            align-items:center;
            gap:14px;
        }
        .qr-card {
            width:min(100%,520px);
            background:#fff;
            border:1px solid var(--line);
            border-radius:14px;
            padding:24px;
            box-shadow:var(--shadow);
            text-align:center;
        }
        .qr-image {
            width:min(100%,420px);
            aspect-ratio:1;
            display:block;
            margin:0 auto;
        }
        .qr-url {
            margin-top:14px;
            padding:10px 12px;
            background:var(--amber-2);
            border:1px solid var(--line);
            border-radius:8px;
            color:var(--maroon);
            font-weight:800;
            overflow-wrap:anywhere;
        }

        .app {
            min-height:100vh;
            display:grid;
            grid-template-columns:258px 1fr;
            background:
                linear-gradient(90deg, rgba(251,243,226,.92), rgba(253,247,234,.94)),
                radial-gradient(circle at 80% 18%, rgba(184,144,46,.14), transparent 28%);
        }
        .sidebar {
            background:linear-gradient(190deg,var(--maroon) 0%,var(--maroon-deep) 100%);
            border-right:1px solid var(--maroon-deep);
            display:flex;
            flex-direction:column;
            min-height:100vh;
            position:relative;
        }
        .sidebar:after {
            content:"";
            position:absolute;
            top:0;
            right:0;
            bottom:0;
            width:3px;
            background:linear-gradient(180deg,var(--gold-bright),var(--gold) 40%,var(--maroon-deep));
        }
        .side-head {
            padding:18px;
            border-bottom:1px solid rgba(219,166,62,.35);
            background:linear-gradient(135deg,rgba(0,0,0,.12),transparent);
        }
        .brand { display:flex; align-items:center; gap:12px; margin-bottom:28px; min-width:0; }
        .brand-mark {
            width:42px;
            height:42px;
            border-radius:10px;
            background:linear-gradient(145deg,var(--maroon),var(--maroon-deep));
            display:grid;
            place-items:center;
            border:1px solid rgba(219,166,62,.82);
            box-shadow:inset 0 0 0 1px rgba(255,250,241,.10), 0 8px 18px rgba(53,17,47,.18);
            overflow:hidden;
            padding:4px;
            flex:0 0 auto;
        }
        .brand-mark img { width:100%; height:100%; object-fit:contain; display:block; }
        .brand-name {
            font-size:20px;
            font-weight:800;
            background:linear-gradient(90deg,var(--maroon),var(--gold));
            -webkit-background-clip:text;
            -webkit-text-fill-color:transparent;
            background-clip:text;
        }
        .side-head .brand { margin:0; }
        .side-head .brand-name {
            background:linear-gradient(90deg,var(--gold-bright),#f3d78a);
            -webkit-background-clip:text;
            -webkit-text-fill-color:transparent;
            background-clip:text;
        }
        .side-head .hint { color:rgba(246,230,195,.72); }

        .nav { padding:12px 8px; overflow:auto; position:relative; z-index:1; }
        .nav-section { border-top:1px solid rgba(219,166,62,.25); margin-top:8px; padding-top:6px; }
        .nav-section:first-child { border-top:0; margin-top:0; padding-top:0; }
        .nav-label {
            padding:12px 10px 6px;
            color:var(--gold-bright);
            font-size:10px;
            text-transform:uppercase;
            letter-spacing:.12em;
            font-weight:800;
            opacity:.85;
        }
        .nav a {
            width:100%;
            display:flex;
            align-items:center;
            gap:9px;
            color:rgba(246,230,195,.82);
            text-align:left;
            padding:9px 10px;
            border-radius:8px;
            margin:2px 0;
        }
        .nav a:hover { background:rgba(0,0,0,.16); color:#fff; }
        .nav a.active {
            background:linear-gradient(90deg,rgba(219,166,62,.28),rgba(219,166,62,.10));
            color:var(--gold-bright);
            font-weight:800;
            border-left:3px solid var(--gold-bright);
        }
        .side-logout { display:none; }
        .ico {
            width:20px;
            height:20px;
            border-radius:6px;
            display:inline-grid;
            place-items:center;
            background:rgba(184,144,46,.18);
            color:inherit;
            font-size:9px;
            font-weight:900;
            flex:0 0 auto;
        }
        .ico.icon-only svg {
            width:14px;
            height:14px;
            display:block;
            fill:currentColor;
        }
        .nav .ico { background:rgba(219,166,62,.22); }

        .main { min-width:0; }
        .topbar {
            min-height:70px;
            background:rgba(255,250,240,.96);
            backdrop-filter:blur(10px);
            border-bottom:1px solid var(--line);
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:12px;
            padding:0 clamp(118px,9vw,150px) 0 22px;
            position:sticky;
            top:0;
            z-index:5;
        }
        .topbar:before {
            content:"";
            position:absolute;
            left:0;
            top:0;
            bottom:0;
            width:4px;
            background:linear-gradient(180deg,var(--gold-bright),var(--maroon));
        }
        .topbar h1:before {
            content:"";
            display:inline-block;
            width:16px;
            height:16px;
            margin-right:9px;
            vertical-align:-3px;
            border-radius:50% 50% 50% 4px;
            transform:rotate(45deg);
            background:linear-gradient(135deg,var(--gold-bright),var(--gold));
            box-shadow:inset 0 0 0 2px rgba(91,33,79,.35);
        }
        .userbox { display:flex; align-items:center; gap:10px; }
        .topbar-title { display:flex; align-items:center; gap:10px; min-width:0; }
        .mobile-menu-toggle,
        .mobile-nav-close,
        .mobile-nav-backdrop { display:none; }
        .hamburger-lines {
            display:grid;
            gap:3px;
            width:16px;
        }
        .hamburger-lines span {
            height:2px;
            border-radius:999px;
            background:currentColor;
        }
        .content { padding:20px; max-width:1420px; position:relative; }
        .content:before {
            content:"Hare Krishna";
            position:fixed;
            right:26px;
            bottom:18px;
            font-size:46px;
            color:rgba(91,33,79,.06);
            font-weight:900;
            font-family:var(--font-display);
            pointer-events:none;
            z-index:0;
        }
        .content > * { position:relative; z-index:1; }

        .grid { display:grid; gap:14px; }
        .grid > * { min-width:0; }
        .two { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
        .three { grid-template-columns:repeat(3,minmax(0,1fr)); }
        .four { grid-template-columns:repeat(4,minmax(0,1fr)); }
        .span-two { grid-column:1 / -1; }
        .card,.stat {
            background:var(--panel);
            border:1px solid var(--line);
            border-radius:10px;
            padding:16px;
            position:relative;
            box-shadow:0 8px 24px rgba(91,33,79,.06);
            min-width:0;
        }
        .card:before,.stat:before {
            content:"";
            position:absolute;
            left:14px;
            right:14px;
            top:0;
            height:2px;
            background:linear-gradient(90deg,transparent,var(--gold-bright),transparent);
            opacity:.8;
        }
        .card > h2:first-child {
            color:var(--maroon);
            display:flex;
            align-items:center;
            gap:8px;
        }
        .card > h2:first-child:before {
            content:"";
            width:7px;
            height:7px;
            border-radius:50%;
            background:var(--gold-bright);
            box-shadow:0 0 0 3px rgba(184,144,46,.18);
            flex:0 0 auto;
        }
        .stat {
            background:linear-gradient(145deg,#fff 55%,var(--panel-2));
            border-left:4px solid var(--maroon);
        }
        .stat .label { color:var(--muted); font-size:12px; margin-bottom:8px; font-weight:800; }
        .stat .value { font-size:28px; font-weight:900; line-height:1; color:var(--maroon); font-family:var(--font-display); }
        .stat .sub { color:var(--muted); font-size:12px; margin-top:7px; }

        label { display:block; color:var(--muted); font-size:12px; font-weight:800; margin-bottom:5px; }
        .field:has(input[required]) > label::after,
        .field:has(select[required]) > label::after,
        .field:has(textarea[required]) > label::after {
            content:" *";
            color:var(--red);
            font-weight:900;
        }
        input,select,textarea {
            width:100%;
            min-width:0;
            border:1px solid var(--sun-border);
            background:#fefaf0;
            color:var(--ink);
            border-radius:7px;
            padding:9px 10px;
            outline:0;
        }
        input:focus,select:focus,textarea:focus { border-color:var(--maroon); box-shadow:0 0 0 3px rgba(91,33,79,.14); }
        textarea { min-height:86px; resize:vertical; }
        .field { margin-bottom:12px; }
        .mantra-strip {
            display:flex;
            align-items:center;
            gap:10px;
            width:100%;
            padding:10px 14px;
            border:1px solid rgba(230,201,136,.72);
            border-left:4px solid var(--gold);
            border-radius:10px;
            background:linear-gradient(90deg,rgba(255,250,241,.96),rgba(247,236,210,.86));
            color:var(--maroon);
            font-family:var(--font-display);
            font-weight:800;
        }
        .mantra-mark {
            width:18px;
            height:18px;
            flex:0 0 auto;
            border-radius:50%;
            background:
                radial-gradient(circle at 50% 50%,var(--gold-bright) 0 28%,transparent 31%),
                radial-gradient(circle at 50% 50%,var(--maroon) 0 50%,var(--gold) 52% 72%,transparent 74%);
            box-shadow:0 0 0 3px rgba(219,166,62,.14);
        }
        .peacock-feather {
            display:inline-block;
            position:relative;
            width:22px;
            height:26px;
            margin-left:7px;
            vertical-align:-5px;
            border-radius:70% 30% 70% 30%;
            background:
                radial-gradient(circle at 52% 34%,#2e9f8f 0 13%,#244c8f 15% 26%,#dba63e 29% 40%,transparent 42%),
                linear-gradient(145deg,#198f80 0%,#58b47e 52%,#dba63e 100%);
            transform:rotate(22deg);
            box-shadow:0 2px 7px rgba(53,17,47,.16);
        }
        .peacock-feather::after {
            content:"";
            position:absolute;
            left:9px;
            bottom:-10px;
            width:2px;
            height:16px;
            border-radius:999px;
            background:var(--gold);
            transform:rotate(-10deg);
        }
        .peacock-feather.light {
            filter:brightness(1.15) saturate(1.1);
        }
        .btn {
            border:1px solid var(--sun-border);
            background:var(--panel);
            color:var(--ink);
            border-radius:8px;
            padding:8px 13px;
            display:inline-flex;
            align-items:center;
            gap:7px;
            min-height:36px;
            transition:.12s;
            text-decoration:none;
        }
        .btn.mobile-menu-toggle,
        .btn.mobile-nav-close,
        .mobile-nav-backdrop {
            display:none;
        }
        .btn:hover { background:var(--panel-2); border-color:var(--maroon); }
        .btn:disabled,
        .btn[disabled] {
            cursor:not-allowed;
            opacity:.58;
            filter:saturate(.65);
        }
        .primary { background:linear-gradient(135deg,var(--maroon),var(--maroon-deep)); border-color:var(--maroon); color:#fff; }
        .success { background:linear-gradient(135deg,#16a34a,#15803d); border-color:#16a34a; color:#fff; }
        .danger { background:linear-gradient(135deg,#c0392b,#96271c); border-color:#c0392b; color:#fff; }
        .danger-soft {
            color:#96271c;
            border-color:rgba(192,57,43,.62);
            background:rgba(255,245,242,.92);
        }
        .danger-soft:hover {
            color:#fff;
            background:linear-gradient(135deg,#c0392b,#96271c);
            border-color:#c0392b;
        }
        .icon-btn {
            width:34px;
            min-width:34px;
            height:34px;
            min-height:34px;
            padding:0;
            justify-content:center;
        }
        .icon-actions {
            gap:6px;
            flex-wrap:nowrap;
        }
        .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;
        }
        .actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
        .actions > form { display:inline-flex; }
        .actions input,
        .actions select { flex:1 1 220px; }
        .list-toolbar {
            display:grid;
            grid-template-columns:minmax(0,1fr) auto;
            gap:14px;
            align-items:start;
        }
        .list-toolbar h2 { margin-bottom:4px; }
        .list-toolbar-actions {
            justify-content:flex-end;
            width:auto;
        }
        .list-search {
            grid-column:1 / -1;
            width:100%;
        }
        .kl-profile-table-wrap table {
            min-width:940px;
        }
        .kl-profile-table td:first-child strong,
        .kl-profile-table td:nth-child(2) strong {
            color:var(--ink);
        }
        .kl-row-actions {
            flex-wrap:nowrap;
            min-width:max-content;
            gap:5px;
        }
        .icon-btn svg {
            width:15px;
            height:15px;
            max-width:15px;
            max-height:15px;
            fill:none;
            stroke:currentColor;
            stroke-width:2;
            stroke-linecap:round;
            stroke-linejoin:round;
        }
        .icon-btn > svg.action-svg,
        .icon-btn .action-svg {
            width:15px !important;
            height:15px !important;
            max-width:15px !important;
            max-height:15px !important;
        }
        .icon-btn > svg.action-svg *,
        .icon-btn .action-svg * {
            vector-effect:non-scaling-stroke;
        }
        .action-svg {
            display:block;
            flex:0 0 auto;
            overflow:visible;
        }
        .kl-row-actions .icon-btn {
            width:32px;
            min-width:32px;
            height:32px;
            min-height:32px;
        }
        .kl-row-actions .icon-btn svg,
        .kl-row-actions .icon-btn svg * {
            width:14px;
            height:14px;
            fill:none !important;
            stroke:currentColor !important;
            stroke-width:2;
            stroke-linecap:round;
            stroke-linejoin:round;
        }
        .pager {
            display:flex;
            align-items:center;
            justify-content:flex-end;
            gap:10px;
            margin-top:14px;
        }
        .pager-status {
            color:var(--muted);
            font-weight:800;
            font-size:12px;
        }
        .pager-btn.disabled {
            opacity:.48;
            pointer-events:none;
        }
        .stack-top { margin-top:14px; }
        .stack-bottom { margin-bottom:14px; }
        .hint-block { display:block; }
        .option-card { margin:0; cursor:pointer; }
        .check-label { display:flex; align-items:center; gap:8px; }
        .check-input { width:auto; }
        .check-list {
            display:grid;
            gap:8px;
            border:1px solid var(--line);
            border-radius:10px;
            background:rgba(255,250,241,.66);
            padding:10px;
        }
        .check-list.large {
            max-height:360px;
            overflow:auto;
        }
        .check-list-group {
            padding:6px 4px 2px;
            color:var(--maroon);
            font-size:12px;
            font-weight:800;
            text-transform:uppercase;
        }
        .check-row {
            display:flex;
            align-items:flex-start;
            gap:10px;
            margin:0;
            padding:10px;
            border:1px solid rgba(230,201,136,.72);
            border-radius:8px;
            background:#fffaf1;
            color:var(--ink);
            cursor:pointer;
        }
        .check-row:hover { border-color:var(--maroon); background:#fdf6e8; }
        .check-row .check-input { margin-top:3px; flex:0 0 auto; }
        .check-row[hidden] { display:none; }
        table { width:100%; border-collapse:collapse; }
        th {
            text-align:left;
            color:var(--muted);
            font-size:11px;
            text-transform:uppercase;
            letter-spacing:.04em;
            background:linear-gradient(90deg,var(--amber-2),var(--panel-2));
        }
        th,td { padding:10px; border-bottom:1px solid var(--line); vertical-align:middle; }
        tr:last-child td { border-bottom:0; }
        tbody tr:hover td { background:#fdf6e8; }
        .badge {
            display:inline-flex;
            align-items:center;
            gap:5px;
            padding:3px 9px;
            border-radius:999px;
            font-size:11px;
            font-weight:900;
            white-space:normal;
            background:var(--violet-2);
            color:var(--violet);
        }
        .muted { color:var(--muted); }
        .hint { font-size:12px; color:var(--muted); line-height:1.5; }
        .label-text {
            display:block;
            margin-bottom:6px;
            color:var(--muted);
            font-size:12px;
            font-weight:900;
        }
        .rowline {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:12px;
            padding:10px 0;
            border-bottom:1px solid rgba(230,201,136,.62);
        }
        .rowline > * {
            min-width:0;
            overflow-wrap:anywhere;
        }
        .rowline:last-child { border-bottom:0; }
        .compact-row {
            padding:0;
            border-bottom:0;
            align-items:center;
        }
        .compact-row label {
            margin-bottom:0;
        }
        .select-all-label {
            color:var(--maroon);
            font-weight:900;
            white-space:nowrap;
        }
        .empty {
            padding:14px;
            border:1px dashed var(--line);
            border-radius:8px;
            background:rgba(255,250,241,.68);
            color:var(--muted);
        }
        .profile-summary {
            display:flex;
            align-items:center;
            gap:16px;
            min-width:0;
        }
        .profile-summary > div:last-child { min-width:0; }
        .profile-avatar {
            width:74px;
            height:74px;
            border-radius:50%;
            display:grid;
            place-items:center;
            overflow:hidden;
            flex:0 0 auto;
            background:linear-gradient(145deg,var(--panel-2),var(--gold-bright));
            border:2px solid var(--gold);
            color:var(--maroon);
            font-family:var(--font-display);
            font-size:30px;
            font-weight:900;
        }
        .profile-avatar img {
            width:100%;
            height:100%;
            object-fit:cover;
            display:block;
        }
        .profile-avatar.small {
            width:54px;
            height:54px;
            font-size:22px;
        }
        .person-cell {
            display:flex;
            align-items:center;
            gap:10px;
            min-width:0;
        }
        .person-cell > span {
            min-width:0;
        }
        .profile-progress {
            height:8px;
            width:min(100%,360px);
            margin:10px 0 6px;
            border-radius:999px;
            background:var(--amber-2);
            overflow:hidden;
        }
        .profile-progress span {
            display:block;
            height:100%;
            border-radius:999px;
            background:linear-gradient(90deg,var(--maroon),var(--gold-bright));
        }
        .line {
            height:1px;
            background:linear-gradient(90deg,transparent,var(--line),transparent);
            margin:12px 0;
        }
        .compact-list {
            display:grid;
            gap:10px;
        }
        .compact-list-row {
            padding:10px 0;
            border-bottom:1px solid rgba(230,201,136,.58);
        }
        .compact-list-row:last-child {
            border-bottom:0;
        }
        .service-duty-card h3 {
            margin:0 0 8px;
            color:var(--maroon);
            font-family:var(--font-display);
            font-size:18px;
        }
        .event-detail-service {
            border:1px solid var(--line);
            border-radius:10px;
            padding:14px;
            background:rgba(255,250,241,.58);
        }
        .event-detail-service h3,
        .event-detail-service h4 {
            margin:0 0 8px;
            color:var(--maroon);
            font-family:var(--font-display);
        }
        .event-detail-service h3 { font-size:18px; }
        .event-detail-service h4 { font-size:15px; }
        .calling-hero {
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:16px;
        }
        .calling-hero-compact { padding-block:14px; }
        .calling-stats {
            display:flex;
            gap:10px;
            flex-wrap:wrap;
        }
        .calling-tabs {
            display:grid;
            grid-template-columns:repeat(6,minmax(0,1fr));
            gap:8px;
            overflow:visible;
            padding:2px 0 8px;
        }
        .calling-tabs a {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:7px;
            white-space:nowrap;
            border:1px solid var(--line);
            border-radius:999px;
            background:var(--panel);
            color:var(--maroon);
            padding:8px 11px;
            font-weight:800;
            min-width:0;
        }
        .calling-tabs a.active {
            background:linear-gradient(135deg,var(--maroon),var(--maroon-deep));
            border-color:var(--maroon);
            color:#fff;
        }
        .calling-tabs span {
            min-width:22px;
            height:22px;
            border-radius:999px;
            display:inline-grid;
            place-items:center;
            background:rgba(184,144,46,.22);
            font-size:11px;
        }
        .calling-stats span,
        .mini-grid span {
            display:grid;
            gap:3px;
            min-width:88px;
            padding:10px;
            border:1px solid var(--line);
            border-radius:8px;
            background:linear-gradient(145deg,#fff,var(--amber-2));
        }
        .calling-stats strong,
        .mini-grid strong {
            color:var(--maroon);
            font-size:20px;
            line-height:1;
            font-family:var(--font-display);
        }
        .calling-stats small,
        .mini-grid small {
            color:var(--muted);
            font-size:11px;
            font-weight:800;
        }
        .calling-board {
            display:grid;
            gap:14px;
        }
        .queue-guide {
            padding:10px 12px;
            border:1px solid rgba(218,164,47,.62);
            border-left:5px solid var(--gold);
            border-radius:10px;
            background:linear-gradient(135deg,#fffaf1,#fff3d7);
            color:var(--brown);
            font-size:13px;
            line-height:1.45;
        }
        .queue-guide strong {
            color:var(--maroon);
        }
        .calling-card {
            display:grid;
            grid-template-columns:minmax(220px,.8fr) minmax(320px,1.2fr);
            gap:16px;
            padding:16px;
            border:1px solid var(--line);
            border-radius:10px;
            background:var(--panel);
            box-shadow:0 8px 24px rgba(91,33,79,.06);
        }
        .calling-person {
            display:flex;
            gap:12px;
            align-items:flex-start;
        }
        .calling-person h2 { margin-bottom:4px; }
        .calling-meta {
            display:flex;
            align-items:center;
            flex-wrap:wrap;
            gap:7px;
            margin-top:7px;
        }
        .calling-actions {
            min-width:0;
            border-left:1px solid rgba(230,201,136,.72);
            padding-left:16px;
        }
        .calling-actions > .actions {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:8px;
            width:100%;
        }
        .calling-actions > .actions .btn {
            min-height:32px;
            padding:6px 9px;
            justify-content:center;
            width:100%;
        }
        .calling-actions > .actions .ico {
            width:19px;
            height:19px;
            border-radius:6px;
        }
        .calling-actions > .actions .ico.icon-only svg {
            width:12px;
            height:12px;
        }
        .calling-details {
            border:1px solid rgba(230,201,136,.78);
            border-radius:8px;
            padding:10px;
            background:rgba(255,250,241,.58);
            margin-bottom:12px;
        }
        .calling-details summary {
            color:var(--maroon);
            cursor:pointer;
            font-weight:900;
        }
        .calling-details[open] summary { margin-bottom:10px; }
        .calling-update-panel {
            border:1px solid rgba(230,201,136,.78);
            border-radius:8px;
            padding:10px;
            background:rgba(255,250,241,.68);
        }
        .calling-update-panel summary {
            cursor:pointer;
            color:var(--maroon);
            font-weight:900;
            list-style-position:inside;
        }
        .calling-update-panel[open] summary {
            margin-bottom:10px;
        }
        .table-update-panel {
            width:100%;
            max-width:320px;
        }
        .mini-grid {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:8px;
        }
        .calling-form textarea { min-height:78px; }
        .calling-table-filters {
            grid-column:1 / -1;
            display:grid;
            grid-template-columns:minmax(240px,1.7fr) repeat(5,minmax(140px,1fr)) auto auto;
            gap:10px;
            align-items:end;
            width:100%;
        }
        .volunteer-calling-filters {
            grid-template-columns:minmax(240px,1.8fr) repeat(2,minmax(140px,1fr)) auto auto;
        }
        .calling-table-wrap table {
            min-width:1220px;
        }
        .volunteer-calling-table-wrap table {
            min-width:1360px;
        }
        .calling-table td {
            vertical-align:top;
        }
        .calling-table td:last-child {
            width:300px;
            min-width:300px;
        }
        .calling-table-form {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:8px;
            width:100%;
            min-width:0;
            max-width:300px;
        }
        .expected-headcount-fields {
            grid-column:1 / -1;
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:8px;
        }
        .calling-table-form select,
        .calling-table-form input,
        .calling-table-form textarea {
            width:100%;
            min-width:0;
        }
        .expected-headcount-fields label {
            display:grid;
            gap:4px;
            color:var(--brown);
            font-size:12px;
            font-weight:800;
        }
        .inline-profile-editor {
            grid-column:1 / -1;
            border:1px solid rgba(218,164,47,.48);
            border-radius:8px;
            background:rgba(255,250,241,.74);
            padding:8px 10px;
        }
        .inline-profile-editor summary {
            cursor:pointer;
            color:var(--maroon);
            font-size:12px;
            font-weight:900;
            list-style-position:inside;
        }
        .inline-profile-editor[open] summary {
            margin-bottom:8px;
        }
        .inline-profile-grid {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:8px;
        }
        .inline-profile-grid label {
            display:grid;
            gap:4px;
            color:var(--brown);
            font-size:12px;
            font-weight:800;
        }
        .calling-table-form textarea {
            grid-column:1 / -1;
            min-height:58px;
            resize:vertical;
        }
        .calling-table-form .btn {
            grid-column:1 / -1;
            justify-content:center;
        }
        .mobile-calling-summary {
            display:none;
        }
        .volunteer-calling-table .call-action,
        .volunteer-calling-table .whatsapp-action {
            width:36px;
            min-width:36px;
            height:36px;
            min-height:36px;
        }
        .volunteer-calling-table .call-action {
            background:#fff8e8;
            border-color:rgba(184,128,31,.78);
            color:var(--maroon);
        }
        .volunteer-calling-table .whatsapp-action {
            background:#149447;
            border-color:#149447;
            color:#fff;
        }
        .volunteer-calling-table .call-action svg,
        .volunteer-calling-table .whatsapp-action svg {
            width:16px !important;
            height:16px !important;
            max-width:16px !important;
            max-height:16px !important;
        }
        .alert {
            position:relative;
            padding:13px 14px 13px 42px;
            border-radius:10px;
            margin-bottom:14px;
            background:linear-gradient(135deg,#f0fdf4,#fffaf1);
            color:var(--green);
            border:1px solid rgba(21,128,61,.24);
            border-left:5px solid var(--green);
            box-shadow:0 10px 24px rgba(91,33,79,.08);
            font-weight:800;
            line-height:1.45;
        }
        .alert::before {
            content:"";
            position:absolute;
            left:14px;
            top:17px;
            width:14px;
            height:14px;
            border-radius:999px;
            background:var(--green);
            box-shadow:inset 0 0 0 4px #dcfce7;
        }
        .error {
            padding:13px 15px;
            border-radius:10px;
            margin-bottom:14px;
            background:linear-gradient(135deg,#fff1f1,var(--red-2));
            color:var(--red);
            border:1px solid rgba(163,35,30,.28);
            border-left:6px solid var(--red);
            box-shadow:0 10px 24px rgba(163,35,30,.10);
            font-weight:900;
            line-height:1.5;
        }
        .success-message {
            padding:12px 14px;
            border-radius:10px;
            margin:14px 0;
            background:var(--green-2);
            color:var(--green);
            border:1px solid rgba(21,128,61,.18);
            font-weight:800;
        }
        .public-counter {
            min-height:100vh;
            padding:clamp(16px,3vw,34px);
            background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);
        }
        .public-counter-hero {
            border-radius:0 0 18px 18px;
            padding:clamp(20px,4vw,42px);
            margin:calc(clamp(16px,3vw,34px) * -1) calc(clamp(16px,3vw,34px) * -1) 18px;
            background:linear-gradient(135deg,var(--maroon),var(--maroon-deep));
            color:#fff;
            border-bottom:4px solid var(--gold);
        }
        .public-counter-hero .brand-name,
        .public-counter-hero .hint,
        .public-counter-hero p {
            color:#fff;
        }
        .public-counter-hero h1 {
            margin:18px 0 8px;
            color:var(--gold-bright);
            font-size:clamp(28px,4vw,48px);
        }
        .public-counter-mantra {
            display:inline-flex;
            flex-direction:column;
            align-items:center;
            line-height:1.35;
            margin-top:12px;
            padding:9px 14px;
            border-radius:999px;
            background:var(--gold-bright);
            color:var(--maroon);
            font-weight:900;
        }
        .public-counter-grid {
            align-items:start;
        }
        .public-counter-grid-validated {
            grid-template-columns:minmax(0,1fr);
        }
        .counter-programme-inline {
            margin:14px 0 18px;
            padding:14px;
            border:1px solid var(--line);
            border-radius:10px;
            background:rgba(255,250,241,.7);
        }
        .counter-programme-inline h2 {
            margin-bottom:10px;
        }
        .kiosk-step {
            display:inline-flex;
            align-items:center;
            min-height:34px;
            padding:6px 14px;
            border-radius:999px;
            background:var(--amber-2);
            color:var(--maroon);
            font-weight:900;
            margin-bottom:12px;
        }
        .counter-cta {
            width:100%;
            justify-content:center;
        }
        @media (max-width:760px) {
            .public-counter {
                padding:14px;
            }
            .public-counter-hero {
                margin:-14px -14px 14px;
                padding:18px 16px 20px;
                border-radius:0 0 14px 14px;
            }
            .public-counter-hero .brand {
                margin-bottom:12px;
            }
            .public-counter-hero h1 {
                margin:12px 0 8px;
                font-size:clamp(24px,8vw,34px);
                line-height:1.12;
            }
            .public-counter-hero p {
                font-size:15px;
                line-height:1.4;
                margin:0;
            }
            .public-counter-mantra {
                display:flex;
                align-items:flex-start;
                width:100%;
                max-width:100%;
                margin-top:14px;
                padding:12px 16px;
                border-radius:22px;
                font-size:15px;
                line-height:1.45;
                text-align:left;
            }
            .public-counter-grid,
            .public-counter-grid.two {
                grid-template-columns:minmax(0,1fr);
                gap:12px;
            }
            .public-counter-ready-card {
                display:none;
            }
            .public-counter .card {
                padding:16px;
                border-radius:12px;
            }
            .public-counter .card h2 {
                font-size:22px;
                line-height:1.2;
            }
            .public-counter .muted {
                font-size:15px;
                line-height:1.45;
            }
            .public-counter .field {
                margin-bottom:14px;
            }
            .public-counter input,
            .public-counter select,
            .public-counter textarea {
                min-height:48px;
                font-size:16px;
            }
            .public-counter .btn {
                min-height:50px;
                font-size:16px;
            }
            .public-counter .badge {
                min-width:max-content;
                white-space:nowrap;
                align-self:flex-start;
            }
            .public-counter .rowline {
                gap:8px;
            }
            .counter-programme-inline {
                padding:12px;
            }
        }
        .pagination { margin-top:14px; color:var(--muted); }
        .table-wrap { overflow:auto; }
        .table-wrap table { min-width:720px; }
        .table-wrap .actions { min-width:max-content; }
        .service-mobile-head {
            display:block;
        }
        .service-mobile-actions {
            display:none;
        }
        .service-description {
            max-width:48ch;
        }
        .transfer-form {
            flex-wrap:nowrap;
        }
        .transfer-form select {
            min-width:160px;
            flex:1 1 160px;
        }
        .compact-check-list {
            max-height:300px;
        }
        .compact-service-row {
            padding:8px 10px;
        }
        .volunteer-actions {
            gap:6px;
        }
        .volunteer-actions .btn {
            min-height:32px;
            padding:6px 9px;
        }

        .calling-detail-page {
            display:grid;
            gap:14px;
        }
        .calling-detail-hero {
            display:flex;
            justify-content:space-between;
            align-items:flex-start;
            gap:14px;
        }
        .calling-detail-person {
            display:flex;
            align-items:center;
            gap:14px;
            min-width:0;
        }
        .calling-detail-person > div {
            min-width:0;
        }
        .calling-detail-person h2 {
            margin-bottom:4px;
            color:var(--maroon);
            font-size:18px;
        }
        .calling-detail-contact {
            display:flex;
            flex-wrap:wrap;
            gap:4px 10px;
            min-width:0;
        }
        .calling-detail-contact span {
            min-width:0;
            overflow-wrap:anywhere;
        }
        .calling-detail-contact span + span::before {
            content:"|";
            margin-right:10px;
            color:rgba(137,88,57,.72);
        }
        .calling-detail-badges {
            display:flex;
            flex-wrap:wrap;
            gap:6px;
            margin-top:8px;
        }
        .calling-detail-actions {
            display:flex;
            flex-wrap:wrap;
            justify-content:flex-end;
            gap:8px;
            flex:0 0 auto;
        }
        .calling-detail-list {
            display:grid;
            gap:10px;
        }
        .calling-detail-list-compact {
            grid-template-columns:repeat(2,minmax(0,1fr));
        }
        .calling-detail-list-compact .wide {
            grid-column:1 / -1;
        }
        .calling-detail-list > div,
        .calling-detail-plan {
            display:grid;
            gap:3px;
            padding:10px 0;
            border-bottom:1px solid rgba(230,201,136,.62);
        }
        .calling-detail-list > div:last-child,
        .calling-detail-plan:last-child {
            border-bottom:0;
        }
        .calling-detail-list span {
            color:var(--muted);
            font-size:11px;
            font-weight:900;
            letter-spacing:.04em;
            text-transform:uppercase;
        }
        .calling-detail-list strong,
        .calling-detail-plan strong {
            overflow-wrap:anywhere;
        }
        .calling-detail-form {
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:12px;
            align-items:end;
        }
        .calling-detail-form .span-two {
            grid-column:1 / -1;
        }
        .calling-detail-form .btn {
            justify-content:center;
        }
        .calling-detail-timeline {
            display:grid;
            gap:10px;
        }
        .timeline-row {
            display:grid;
            grid-template-columns:18px minmax(0,1fr);
            gap:10px;
            padding:10px;
            border:1px solid rgba(230,201,136,.72);
            border-radius:9px;
            background:rgba(255,250,241,.62);
        }
        .timeline-row p {
            margin:6px 0 0;
            color:var(--ink);
        }
        .timeline-dot {
            width:10px;
            height:10px;
            margin-top:5px;
            border-radius:50%;
            background:var(--gold-bright);
            box-shadow:0 0 0 4px rgba(219,166,62,.16);
        }
        .calling-detail-plan-list {
            display:grid;
            gap:0;
        }
        .calling-detail-plan {
            grid-template-columns:minmax(180px,1fr) minmax(160px,1fr) auto auto minmax(140px,.7fr);
            align-items:center;
            gap:10px;
        }

        @media (max-width:1180px) {
            .app { grid-template-columns:230px 1fr; }
            .four { grid-template-columns:repeat(3,minmax(0,1fr)); }
            .three { grid-template-columns:repeat(2,minmax(0,1fr)); }
        }
        @media (max-width:600px) and (max-device-width:600px) and (hover:none) and (pointer:coarse) {
            .login,
            .onboarding-login { grid-template-columns:1fr; }
            .login-art { display:none; }
            .qr-screen { grid-template-columns:1fr; padding:24px; }
            .app { grid-template-columns:1fr; }
            .sidebar {
                position:fixed;
                top:0;
                left:0;
                bottom:0;
                width:min(84vw,320px);
                min-height:100dvh;
                z-index:30;
                box-shadow:0 10px 24px rgba(53,17,47,.18);
                transform:translateX(-105%);
                transition:transform .18s ease;
            }
            .nav-open .sidebar { transform:translateX(0); }
            .nav-open { overflow:hidden; }
            .mobile-nav-backdrop {
                display:block;
                position:fixed;
                inset:0;
                z-index:25;
                border:0;
                padding:0;
                background:rgba(42,22,15,.45);
                opacity:0;
                pointer-events:none;
                transition:opacity .18s ease;
            }
            .nav-open .mobile-nav-backdrop {
                opacity:1;
                pointer-events:auto;
            }
            .sidebar:after { height:auto; width:3px; top:0; right:0; bottom:0; }
            .side-head { padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
            .side-head .brand { gap:8px; }
            .brand-mark { width:36px; height:36px; border-radius:9px; }
            .brand-name { font-size:16px; }
            .btn.mobile-nav-close { display:inline-flex; color:#fff; border-color:rgba(219,166,62,.45); background:rgba(0,0,0,.14); }
            .btn.mobile-menu-toggle { display:inline-flex; flex:0 0 auto; }
            .nav {
                display:block;
                overflow:auto;
                padding:10px 8px 18px;
            }
            .nav-section {
                display:block;
                border-top:1px solid rgba(219,166,62,.25);
                margin-top:8px;
                padding-top:6px;
            }
            .nav-section:first-child { border-top:0; margin-top:0; padding-top:0; }
            .nav-label { display:block; }
            .nav a {
                width:100%;
                margin:2px 0;
                white-space:nowrap;
                padding:8px 10px;
            }
            .nav a.active { border-left:3px solid var(--gold-bright); box-shadow:none; }
            .two,.three,.four { grid-template-columns:1fr; }
            .span-two { grid-column:auto; }
            .topbar { padding:12px; min-height:64px; align-items:flex-start; flex-direction:column; }
            .is-auth .topbar { padding-right:92px; }
            .template-corner-emblem { width:76px; top:8px; right:10px; }
            .content { padding:14px; }
            .calling-card { grid-template-columns:1fr; }
            .calling-actions { border-left:0; padding-left:0; border-top:1px solid rgba(230,201,136,.72); padding-top:14px; }
            .table-wrap {
                margin-inline:-4px;
                padding-bottom:6px;
            }
            .table-wrap table { min-width:760px; }
        }
        @media (max-width:600px) and (max-device-width:600px) and (hover:none) and (pointer:coarse) {
            body { font-size:13px; }
            .template-corner-emblem { width:62px; }
            .is-guest .template-corner-emblem { opacity:.82; }
            .login-card { padding:24px; }
            .qr-screen { padding:18px; align-items:start; }
            .qr-copy { font-size:16px; }
            .qr-card { padding:16px; }
            .content { padding:10px; }
            .card,.stat { padding:14px; }
            .mobile-hide-card { display:none !important; }
            .profile-summary { align-items:flex-start; }
            .profile-avatar { width:58px; height:58px; font-size:24px; }
            .rowline { align-items:flex-start; flex-direction:column; }
            .calling-hero { align-items:flex-start; flex-direction:column; }
            .calling-hero-compact { padding:12px; }
            .calling-hero-compact p { display:none; }
            .calling-stats span { min-width:76px; padding:8px; }
            .calling-card { padding:12px; gap:12px; }
            .calling-person h2 { font-size:14px; }
            .calling-form textarea { min-height:64px; }
            .mini-grid { grid-template-columns:1fr; }
            .actions { width:100%; }
            .actions .btn,
            .actions > form,
            .actions > form .btn { flex:1 1 auto; justify-content:center; width:100%; }
            .calling-actions > .actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .calling-actions > .actions .btn {
                width:100%;
                flex:initial;
                font-size:12px;
            }
            .actions input,
            .actions select { flex-basis:100%; }
            .table-wrap {
                border:1px solid var(--line);
                border-radius:10px;
                background:rgba(255,250,241,.45);
            }
            .service-table-wrap {
                overflow:visible;
                margin-inline:0;
                border:0;
                background:transparent;
                padding-bottom:0;
            }
            .service-table {
                min-width:0;
                border-collapse:separate;
                border-spacing:0 10px;
            }
            .service-table thead {
                display:none;
            }
            .service-table,
            .service-table tbody,
            .service-table tr,
            .service-table td {
                display:block;
                width:100%;
            }
            .service-table tr {
                border:1px solid var(--line);
                border-radius:10px;
                background:var(--panel);
                overflow:hidden;
                box-shadow:0 8px 20px rgba(91,33,79,.06);
            }
            .service-table td {
                border-bottom:1px solid rgba(230,201,136,.58);
                padding:10px 12px;
            }
            .service-table td:last-child {
                border-bottom:0;
            }
            .service-table td:not(:first-child)::before {
                content:attr(data-label);
                display:block;
                color:var(--muted);
                font-size:10px;
                font-weight:900;
                letter-spacing:.06em;
                text-transform:uppercase;
                margin-bottom:3px;
            }
            .service-mobile-head {
                display:flex;
                align-items:center;
                justify-content:space-between;
                gap:10px;
            }
            .service-mobile-actions {
                display:inline-flex;
                width:auto;
                flex:0 0 auto;
            }
            .service-mobile-actions .icon-btn,
            .service-mobile-actions.actions .btn {
                width:34px;
                min-width:34px;
                height:34px;
                min-height:34px;
                flex:0 0 34px;
                padding:0;
            }
            .service-desktop-actions {
                display:none;
            }
            .service-table td.service-desktop-actions {
                display:none;
            }
            .service-description {
                display:none;
            }
            .service-table .badge {
                margin:2px 4px 2px 0;
            }
            .volunteer-table-wrap {
                overflow:visible;
                margin-inline:0;
                border:0;
                background:transparent;
                padding-bottom:0;
            }
            .volunteer-table {
                min-width:0;
                border-collapse:separate;
                border-spacing:0 10px;
            }
            .volunteer-table thead {
                display:none;
            }
            .volunteer-table,
            .volunteer-table tbody,
            .volunteer-table tr,
            .volunteer-table td {
                display:block;
                width:100%;
            }
            .volunteer-table tr {
                border:1px solid var(--line);
                border-radius:10px;
                background:var(--panel);
                overflow:hidden;
                box-shadow:0 8px 20px rgba(91,33,79,.06);
            }
            .volunteer-table td {
                border-bottom:1px solid rgba(230,201,136,.58);
                padding:10px 12px;
            }
            .volunteer-table td:last-child {
                border-bottom:0;
            }
            .volunteer-table td::before {
                content:attr(data-label);
                display:block;
                color:var(--muted);
                font-size:10px;
                font-weight:900;
                letter-spacing:.06em;
                text-transform:uppercase;
                margin-bottom:3px;
            }
            .volunteer-actions {
                display:grid;
                grid-template-columns:1fr 1fr;
            }
            .volunteer-actions > form,
            .volunteer-actions > form .btn {
                width:100%;
            }
            .transfer-form {
                width:100%;
                display:grid;
                grid-template-columns:minmax(0,1fr) 34px;
            }
            .transfer-form select {
                min-width:0;
                width:100%;
            }
            .transfer-form .icon-btn {
                width:34px;
                min-width:34px;
                height:34px;
                min-height:34px;
                padding:0;
            }
            .list-toolbar {
                grid-template-columns:1fr;
            }
            .list-toolbar-actions {
                justify-content:stretch;
                width:100%;
                display:grid;
                grid-template-columns:repeat(3,minmax(0,1fr));
            }
            .list-toolbar-actions .btn {
                width:100%;
                justify-content:center;
                font-size:12px;
                padding-inline:8px;
            }
            .list-search {
                display:grid;
                grid-template-columns:1fr;
            }
            .calling-table-filters,
            .volunteer-calling-filters {
                grid-template-columns:1fr;
            }
            .calling-table-form {
                min-width:0;
                grid-template-columns:1fr;
            }
            .expected-headcount-fields {
                grid-template-columns:1fr;
            }
            .calling-table-form textarea,
            .calling-table-form .btn {
                grid-column:auto;
            }
            .calling-detail-hero {
                flex-direction:column;
                align-items:stretch;
            }
            .calling-detail-person {
                align-items:flex-start;
            }
            .calling-detail-actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                justify-content:stretch;
                width:100%;
            }
            .calling-detail-actions .btn {
                width:100%;
                justify-content:center;
                font-size:12px;
                padding-inline:8px;
            }
            .calling-detail-stats.four {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .calling-detail-form {
                grid-template-columns:1fr;
            }
            .calling-detail-form .span-two {
                grid-column:auto;
            }
            .timeline-row {
                padding:9px;
                grid-template-columns:14px minmax(0,1fr);
            }
            .calling-detail-plan {
                display:block;
                padding:12px;
                margin-bottom:10px;
                border:1px solid var(--line);
                border-radius:9px;
                background:rgba(255,250,241,.62);
            }
            .calling-detail-plan > * {
                display:block;
                margin-top:5px;
            }
            .calling-detail-plan > :first-child {
                margin-top:0;
            }
            .kl-profile-table-wrap {
                overflow:visible;
                margin-inline:0;
                border:0;
                background:transparent;
                padding-bottom:0;
            }
            .kl-profile-table {
                min-width:0 !important;
                border-collapse:separate;
                border-spacing:0 10px;
            }
            .kl-profile-table thead {
                display:none;
            }
            .kl-profile-table,
            .kl-profile-table tbody,
            .kl-profile-table tr,
            .kl-profile-table td {
                display:block;
                width:100%;
            }
            .kl-profile-table tr {
                border:1px solid var(--line);
                border-radius:10px;
                background:var(--panel);
                overflow:hidden;
                box-shadow:0 8px 20px rgba(91,33,79,.06);
            }
            .kl-profile-table td {
                border-bottom:1px solid rgba(230,201,136,.58);
                padding:10px 12px;
            }
            .kl-profile-table td:last-child {
                border-bottom:0;
            }
            .kl-profile-table td::before {
                content:attr(data-label);
                display:block;
                color:var(--muted);
                font-size:10px;
                font-weight:900;
                letter-spacing:.06em;
                text-transform:uppercase;
                margin-bottom:3px;
            }
            .kl-row-actions {
                display:grid;
                grid-template-columns:repeat(4,28px);
                justify-content:start;
                width:auto;
                gap:5px;
            }
            .kl-row-actions .icon-btn,
            .kl-row-actions.actions .btn {
                width:28px;
                min-width:28px;
                height:28px;
                min-height:28px;
                flex:0 0 28px;
                padding:0;
            }
            .kl-row-actions .icon-btn svg,
            .kl-row-actions .icon-btn svg * {
                width:13px;
                height:13px;
            }
            .pager {
                justify-content:space-between;
                gap:8px;
            }
            .pager .btn {
                width:auto;
                flex:0 0 auto;
            }
            .pager-status {
                text-align:center;
            }
            .userbox { width:100%; justify-content:space-between; flex-wrap:wrap; }
            .topbar-logout { display:none; }
            .side-logout {
                display:block;
                margin:12px 8px 0;
                padding-top:12px;
                border-top:1px solid rgba(219,166,62,.25);
            }
            .side-logout .btn {
                width:100%;
                justify-content:flex-start;
                color:rgba(246,230,195,.9);
                border-color:rgba(219,166,62,.45);
                background:rgba(0,0,0,.14);
            }
        }
        @media (min-width:601px) and (max-width:980px) {
            .app { grid-template-columns:230px 1fr; }
            .sidebar {
                position:relative;
                inset:auto;
                width:auto;
                min-height:100vh;
                z-index:auto;
                box-shadow:none;
                transform:none;
                transition:none;
            }
            .nav-open { overflow:auto; }
            .nav-open .sidebar { transform:none; }
            .btn.mobile-menu-toggle,
            .btn.mobile-nav-close,
            .mobile-nav-backdrop { display:none; }
            .side-head {
                padding:18px;
                display:block;
            }
            .brand-mark { width:42px; height:42px; border-radius:10px; }
            .brand-name { font-size:20px; }
            .nav a {
                white-space:normal;
                padding:9px 10px;
                font-size:14px;
            }
            .topbar {
                min-height:70px;
                align-items:center;
                flex-direction:row;
                padding:0 clamp(98px,8vw,128px) 0 22px;
            }
            .is-auth .topbar { padding-right:clamp(98px,8vw,128px); }
            .userbox {
                width:auto;
                justify-content:flex-end;
                flex-wrap:nowrap;
            }
        }
        @media (max-width:460px) {
            .topbar h1 { font-size:16px; }
            .is-auth .topbar { padding-right:76px; }
            .template-corner-emblem { width:54px; }
            .nav a { padding:7px 8px; font-size:12px; }
            .nav .ico { width:20px; height:20px; font-size:10px; }
            .calling-stats span,
            .mini-grid span { min-width:0; width:100%; }
            .calling-stats { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
            .calling-stats strong { font-size:16px; }
            .calling-tabs {
                grid-template-columns:repeat(6,minmax(0,1fr));
                gap:4px;
                margin-inline:0;
                padding-inline:0;
            }
            .calling-tabs a {
                gap:3px;
                padding:6px 3px;
                font-size:9px;
                line-height:1.05;
                white-space:normal;
                text-align:center;
            }
            .calling-tabs span { display:none; }
            .profile-summary { flex-direction:column; }
        }

        @media (max-width:600px) {
            .volunteer-calling-table-wrap {
                overflow:visible;
                margin-inline:0;
                border:0;
                background:transparent;
                padding-bottom:0;
            }
            .volunteer-calling-table {
                min-width:0 !important;
                border-collapse:separate;
                border-spacing:0 12px;
            }
            .volunteer-calling-table thead {
                display:none;
            }
            .volunteer-calling-table,
            .volunteer-calling-table tbody,
            .volunteer-calling-table tr,
            .volunteer-calling-table td {
                display:block;
                width:100%;
            }
            .volunteer-calling-table tr {
                border:1px solid var(--line);
                border-radius:12px;
                background:var(--panel);
                overflow:hidden;
                box-shadow:0 8px 20px rgba(91,33,79,.08);
            }
            .volunteer-calling-table td {
                padding:11px 12px;
                border-bottom:1px solid rgba(230,201,136,.58);
            }
            .volunteer-calling-table td.calling-table-mobile-hide {
                display:none;
            }
            .volunteer-calling-table td[data-label="KL"] {
                border-bottom:0;
                padding:12px;
            }
            .volunteer-calling-table td[data-label="KL"]::before {
                display:none;
            }
            .volunteer-calling-table td[data-label="Contact"] {
                background:rgba(255,248,232,.72);
                border-top:1px solid rgba(230,201,136,.7);
            }
            .volunteer-calling-table td[data-label="Save Remarks"] {
                background:#fffaf1;
                border-bottom:0;
            }
            .mobile-calling-summary {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:7px;
                margin-top:10px;
            }
            .mobile-calling-summary .summary-line {
                display:grid;
                gap:2px;
                padding:8px;
                border:1px solid rgba(230,201,136,.64);
                border-radius:8px;
                background:rgba(255,250,241,.68);
                min-width:0;
            }
            .mobile-calling-summary .summary-line.full {
                grid-column:1 / -1;
            }
            .mobile-calling-summary small {
                color:var(--muted);
                font-size:10px;
                font-weight:900;
                letter-spacing:.05em;
                text-transform:uppercase;
            }
            .mobile-calling-summary strong {
                color:var(--ink);
                font-size:12px;
                line-height:1.25;
                overflow-wrap:anywhere;
            }
            .volunteer-calling-table .kl-row-actions {
                display:grid;
                grid-template-columns:34px 40px 40px;
                gap:8px;
                justify-content:start;
                align-items:center;
                width:max-content;
                min-width:0;
            }
            .volunteer-calling-table .kl-row-actions .icon-btn {
                width:34px;
                min-width:34px;
                height:34px;
                min-height:34px;
                padding:0;
            }
            .volunteer-calling-table .kl-row-actions .call-action,
            .volunteer-calling-table .kl-row-actions .whatsapp-action {
                width:40px;
                min-width:40px;
                height:40px;
                min-height:40px;
            }
            .volunteer-calling-table .kl-row-actions .call-action svg,
            .volunteer-calling-table .kl-row-actions .whatsapp-action svg {
                width:17px !important;
                height:17px !important;
                max-width:17px !important;
                max-height:17px !important;
            }
            .volunteer-calling-table td[data-label="Contact"] .hint {
                margin-top:5px;
                font-size:11px;
            }
            .volunteer-calling-table .calling-table-form {
                max-width:none;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
            }
            .volunteer-calling-table .inline-profile-editor {
                padding:9px;
            }
            .volunteer-calling-table .inline-profile-editor summary {
                font-size:13px;
            }
            .volunteer-calling-table .expected-headcount-fields {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .volunteer-calling-table .calling-table-form input[type="date"],
            .volunteer-calling-table .calling-table-form textarea,
            .volunteer-calling-table .calling-table-form .btn {
                grid-column:1 / -1;
            }
            .volunteer-calling-table .calling-table-form textarea {
                min-height:54px;
            }
            .volunteer-calling-table .calling-table-form .btn {
                min-height:42px;
            }
        }

        @media (max-width:380px) {
            .volunteer-calling-table .calling-table-form,
            .volunteer-calling-table .expected-headcount-fields,
            .volunteer-calling-table .inline-profile-grid {
                grid-template-columns:1fr;
            }
            .mobile-calling-summary {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
        }

        @media (max-width:980px) {
            html,
            body {
                max-width:100%;
                overflow-x:hidden;
            }
            .app {
                display:block;
                width:100%;
                min-height:100vh;
            }
            .main {
                width:100%;
                min-width:0;
            }
            .sidebar {
                position:fixed;
                top:0;
                left:0;
                bottom:0;
                width:min(86vw,330px);
                max-width:330px;
                min-height:100dvh;
                z-index:40;
                transform:translateX(-104%);
                transition:transform .18s ease;
                box-shadow:0 18px 40px rgba(33,13,30,.32);
            }
            .nav-open .sidebar {
                transform:translateX(0);
            }
            .nav-open {
                overflow:hidden;
            }
            .mobile-nav-backdrop {
                display:block;
                position:fixed;
                inset:0;
                z-index:35;
                border:0;
                padding:0;
                background:rgba(32,16,28,.56);
                opacity:0;
                pointer-events:none;
                transition:opacity .18s ease;
            }
            .nav-open .mobile-nav-backdrop {
                opacity:1;
                pointer-events:auto;
            }
            .btn.mobile-menu-toggle,
            .btn.mobile-nav-close {
                display:inline-flex;
            }
            .btn.mobile-nav-close {
                color:#fff;
                border-color:rgba(219,166,62,.45);
                background:rgba(0,0,0,.18);
            }
            .topbar {
                min-height:auto;
                padding:10px clamp(72px,18vw,96px) 10px 12px;
                align-items:stretch;
                flex-direction:column;
                gap:8px;
            }
            .is-auth .topbar {
                padding-right:clamp(72px,18vw,96px);
            }
            .topbar-title {
                width:100%;
                align-items:flex-start;
                gap:8px;
            }
            .topbar-title > div {
                min-width:0;
            }
            .topbar h1 {
                font-size:clamp(18px,5vw,22px);
                line-height:1.12;
                overflow-wrap:anywhere;
            }
            .userbox {
                width:100%;
                justify-content:flex-start;
                flex-wrap:wrap;
                gap:8px;
            }
            .topbar-logout {
                display:none;
            }
            .side-logout {
                display:block;
                margin:12px 8px 0;
                padding-top:12px;
                border-top:1px solid rgba(219,166,62,.25);
            }
            .side-logout .btn {
                width:100%;
                color:#fff;
                justify-content:flex-start;
                border-color:rgba(219,166,62,.35);
                background:rgba(0,0,0,.12);
            }
            .content {
                width:100%;
                max-width:100vw;
                overflow-x:hidden;
                padding:12px;
            }
            .two,
            .three,
            .four {
                grid-template-columns:1fr;
            }
            .list-toolbar {
                grid-template-columns:1fr;
            }
            .list-toolbar-actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                width:100%;
                justify-content:stretch;
            }
            .list-toolbar-actions .btn {
                width:100%;
                justify-content:center;
                padding-inline:8px;
            }
            .calling-hero {
                align-items:stretch;
                flex-direction:column;
            }
            .calling-hero-compact {
                padding:12px;
            }
            .calling-stats {
                width:100%;
                display:grid;
                grid-template-columns:repeat(3,minmax(0,1fr));
            }
            .calling-stats span {
                min-width:0;
                width:100%;
                padding:8px;
            }
            .calling-stats strong {
                font-size:17px;
            }
            .calling-tabs {
                grid-template-columns:repeat(3,minmax(0,1fr));
                gap:6px;
            }
            .calling-tabs a {
                min-height:38px;
                padding:7px 6px;
                white-space:normal;
                text-align:center;
                line-height:1.12;
                font-size:11px;
            }
            .calling-tabs span {
                min-width:18px;
                height:18px;
                font-size:10px;
            }
            .calling-card {
                grid-template-columns:1fr;
                gap:12px;
                padding:12px;
                max-width:100%;
                overflow:hidden;
            }
            .calling-person {
                display:grid;
                grid-template-columns:auto minmax(0,1fr);
                width:100%;
            }
            .calling-person > div {
                min-width:0;
            }
            .calling-person h2 {
                font-size:16px;
                overflow-wrap:anywhere;
            }
            .calling-actions {
                border-left:0;
                border-top:1px solid rgba(230,201,136,.72);
                padding-left:0;
                padding-top:12px;
                width:100%;
            }
            .calling-actions > .actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .calling-actions > .actions .btn {
                width:100%;
                min-width:0;
                justify-content:center;
                font-size:12px;
                padding-inline:8px;
            }
            .calling-table-filters,
            .volunteer-calling-filters {
                grid-template-columns:1fr;
            }
            .volunteer-calling-table-wrap {
                overflow:visible;
                margin-inline:0;
                border:0;
                background:transparent;
                padding-bottom:0;
            }
            table.volunteer-calling-table {
                min-width:0 !important;
                border-collapse:separate;
                border-spacing:0 12px;
            }
            .volunteer-calling-table thead {
                display:none;
            }
            .volunteer-calling-table,
            .volunteer-calling-table tbody,
            .volunteer-calling-table tr,
            .volunteer-calling-table td {
                display:block;
                width:100%;
            }
            .volunteer-calling-table tr {
                border:1px solid var(--line);
                border-radius:12px;
                background:var(--panel);
                overflow:hidden;
                box-shadow:0 8px 20px rgba(91,33,79,.08);
            }
            .volunteer-calling-table td {
                padding:11px 12px;
                border-bottom:1px solid rgba(230,201,136,.58);
            }
            .volunteer-calling-table td.calling-table-mobile-hide {
                display:none;
            }
            .volunteer-calling-table td[data-label="KL"] {
                border-bottom:0;
                padding:12px;
            }
            .volunteer-calling-table td[data-label="Contact"] {
                background:rgba(255,248,232,.72);
                border-top:1px solid rgba(230,201,136,.7);
            }
            .volunteer-calling-table td[data-label="Save Remarks"] {
                background:#fffaf1;
                border-bottom:0;
            }
            .mobile-calling-summary {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:7px;
                margin-top:10px;
            }
            .mobile-calling-summary .summary-line {
                display:grid;
                gap:2px;
                padding:8px;
                border:1px solid rgba(230,201,136,.64);
                border-radius:8px;
                background:rgba(255,250,241,.68);
                min-width:0;
            }
            .mobile-calling-summary .summary-line.full {
                grid-column:1 / -1;
            }
            .mobile-calling-summary small {
                color:var(--muted);
                font-size:10px;
                font-weight:900;
                text-transform:uppercase;
            }
            .mobile-calling-summary strong {
                color:var(--ink);
                font-size:12px;
                line-height:1.25;
                overflow-wrap:anywhere;
            }
            .volunteer-calling-table .kl-row-actions {
                display:grid;
                grid-template-columns:34px 40px 40px;
                gap:8px;
                justify-content:start;
                align-items:center;
                width:max-content;
                min-width:0;
            }
            .volunteer-calling-table .kl-row-actions .icon-btn {
                width:34px;
                min-width:34px;
                height:34px;
                min-height:34px;
                padding:0;
            }
            .volunteer-calling-table .kl-row-actions .call-action,
            .volunteer-calling-table .kl-row-actions .whatsapp-action {
                width:40px;
                min-width:40px;
                height:40px;
                min-height:40px;
            }
            .volunteer-calling-table .calling-table-form {
                max-width:none;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
            }
            .volunteer-calling-table .expected-headcount-fields {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .volunteer-calling-table .calling-table-form input[type="date"],
            .volunteer-calling-table .calling-table-form textarea,
            .volunteer-calling-table .calling-table-form .btn {
                grid-column:1 / -1;
            }
        }

        .dashboard-shell {
            display:grid;
            gap:16px;
        }
        .dashboard-panel {
            background:linear-gradient(135deg, rgba(255,252,245,.98), rgba(255,247,229,.9));
            border:1px solid var(--line);
            border-radius:8px;
            padding:18px;
            box-shadow:0 14px 30px rgba(93,35,73,.05);
            min-width:0;
        }
        .dashboard-panel-feature {
            border-left:5px solid var(--gold);
        }
        .dashboard-panel-head {
            display:flex;
            justify-content:space-between;
            align-items:flex-start;
            gap:16px;
            margin-bottom:16px;
        }
        .dashboard-panel-head h2 {
            margin:4px 0 0;
            font-family:var(--font-display);
            color:var(--maroon);
            font-size:22px;
        }
        .section-kicker {
            display:inline-flex;
            align-items:center;
            gap:7px;
            color:var(--muted);
            font-size:12px;
            font-weight:800;
            letter-spacing:.04em;
            text-transform:uppercase;
        }
        .section-kicker:before {
            content:"";
            width:9px;
            height:9px;
            border-radius:999px;
            background:var(--gold);
            box-shadow:inset 0 0 0 2px rgba(255,255,255,.52);
        }
        .dashboard-actions {
            justify-content:flex-end;
            width:auto;
        }
        .dashboard-event-spotlight {
            display:grid;
            grid-template-columns:minmax(0,1fr) auto;
            gap:14px;
            align-items:center;
            background:rgba(255,248,232,.74);
            border:1px solid rgba(230,201,136,.8);
            border-radius:8px;
            padding:14px;
            margin-bottom:14px;
        }
        .dashboard-event-spotlight strong {
            display:block;
            color:var(--ink);
            font-size:18px;
        }
        .dashboard-metric-row {
            display:grid;
            grid-template-columns:repeat(4,minmax(0,1fr));
            gap:10px;
            margin-bottom:14px;
        }
        .dashboard-metric-row-five {
            grid-template-columns:repeat(5,minmax(0,1fr));
        }
        .dashboard-metric {
            min-width:0;
            padding:12px;
            border:1px solid rgba(230,201,136,.78);
            border-radius:8px;
            background:rgba(255,255,255,.56);
        }
        .dashboard-metric span {
            display:block;
            color:var(--muted);
            font-size:12px;
            line-height:1.25;
        }
        .dashboard-metric strong {
            display:block;
            margin-top:5px;
            color:var(--ink);
            font-size:24px;
            line-height:1;
        }
        .dashboard-metric.emphasis {
            border-color:rgba(93,25,74,.28);
            background:rgba(242,222,240,.58);
        }
        .dashboard-metric.warning {
            border-color:rgba(184,128,31,.45);
            background:rgba(255,239,198,.68);
        }
        .dashboard-compare-grid {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:14px;
            margin:10px 0 14px;
        }
        .dashboard-table-wrap {
            border:1px solid rgba(230,201,136,.72);
            border-radius:8px;
            background:rgba(255,255,255,.45);
        }
        .dashboard-table th {
            background:rgba(246,231,191,.86);
        }
        .dashboard-table td {
            vertical-align:middle;
        }
        .dashboard-attention-grid {
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:10px;
            margin:12px 0;
        }
        .dashboard-attention-item {
            padding:12px;
            border-radius:8px;
            border:1px dashed rgba(184,128,31,.62);
            background:rgba(255,248,232,.6);
        }
        .dashboard-attention-item span,
        .dashboard-attention-item strong {
            display:block;
        }
        .dashboard-attention-item span {
            color:var(--muted);
            font-size:12px;
            font-weight:700;
        }
        .dashboard-attention-item strong {
            margin-top:5px;
            color:var(--maroon);
            font-size:22px;
        }
        .dashboard-next-actions {
            margin-top:14px;
        }

        @media (max-width:900px) {
            .dashboard-panel-head,
            .dashboard-event-spotlight {
                grid-template-columns:1fr;
                flex-direction:column;
            }
            .dashboard-actions {
                width:100%;
                justify-content:flex-start;
            }
            .dashboard-metric-row,
            .dashboard-metric-row-five,
            .dashboard-compare-grid,
            .dashboard-attention-grid {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .dashboard-table-wrap table {
                min-width:760px;
            }
        }

        @media (max-width:520px) {
            .dashboard-panel {
                padding:14px;
            }
            .dashboard-panel-head h2 {
                font-size:19px;
            }
            .dashboard-metric-row,
            .dashboard-metric-row-five,
            .dashboard-compare-grid,
            .dashboard-attention-grid {
                grid-template-columns:1fr;
            }
            .dashboard-actions .btn,
            .dashboard-next-actions .btn {
                width:100%;
                justify-content:center;
            }
            .dashboard-event-spotlight .btn {
                width:100%;
                justify-content:center;
            }
        }

        @media (max-width:720px) {
            .card.list-toolbar,
            .calling-hero.card {
                display:block;
                padding:12px;
            }
            .card.list-toolbar > div:first-child,
            .calling-hero.card > div:first-child {
                margin-bottom:10px;
            }
            .list-toolbar h2,
            .calling-hero h2 {
                font-size:20px;
                line-height:1.16;
                margin-bottom:6px;
            }
            .list-toolbar p.muted,
            .calling-hero p.muted {
                max-width:none;
                line-height:1.35;
            }
            .list-toolbar-actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
                margin-top:8px;
                width:100%;
            }
            .list-toolbar-actions .btn {
                min-height:42px;
                width:100%;
                justify-content:center;
                white-space:normal;
            }
            .calling-stats {
                display:grid;
                grid-template-columns:repeat(3,minmax(0,1fr));
                gap:8px;
                width:100%;
            }
            .calling-stats span {
                min-width:0;
                width:100%;
                padding:8px 6px;
                text-align:center;
            }
            .calling-stats strong {
                font-size:18px;
            }
            .calling-stats small {
                font-size:10px;
                line-height:1.15;
            }
            .calling-tabs {
                grid-template-columns:repeat(3,minmax(0,1fr));
                gap:6px;
            }
            .calling-tabs a {
                min-height:38px;
                padding:7px 5px;
                white-space:normal;
                text-align:center;
                line-height:1.12;
                font-size:11px;
            }
            .calling-tabs span {
                display:none;
            }
            .calling-card {
                display:block;
                padding:12px;
                max-width:100%;
                overflow:hidden;
            }
            .calling-person {
                display:grid;
                grid-template-columns:58px minmax(0,1fr);
                gap:10px;
                width:100%;
            }
            .calling-person > div {
                min-width:0;
            }
            .calling-person h2 {
                font-size:18px;
                line-height:1.18;
                overflow-wrap:anywhere;
            }
            .calling-meta {
                gap:6px;
            }
            .calling-meta .hint {
                flex-basis:100%;
                min-width:0;
                overflow-wrap:anywhere;
            }
            .calling-actions {
                margin-top:12px;
                padding-top:12px;
                padding-left:0;
                border-left:0;
                border-top:1px solid rgba(230,201,136,.72);
                width:100%;
            }
            .calling-actions > .actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
                width:100%;
            }
            .calling-actions > .actions .btn {
                min-width:0;
                width:100%;
                min-height:42px;
                justify-content:center;
                padding-inline:8px;
                white-space:normal;
            }
            .calling-details,
            .calling-update-panel,
            .calling-form {
                width:100%;
                max-width:none;
            }
            .calling-form {
                grid-template-columns:1fr;
            }
            .calling-form textarea,
            .calling-form .btn {
                grid-column:auto;
            }
            .calling-table-filters,
            .volunteer-calling-filters {
                display:grid;
                grid-template-columns:1fr;
                gap:8px;
            }
            .volunteer-calling-table-wrap {
                overflow:visible;
                margin-inline:0;
                border:0;
                background:transparent;
                padding-bottom:0;
            }
            table.volunteer-calling-table {
                min-width:0 !important;
                border-collapse:separate;
                border-spacing:0 12px;
            }
            .volunteer-calling-table thead {
                display:none;
            }
            .volunteer-calling-table,
            .volunteer-calling-table tbody,
            .volunteer-calling-table tr,
            .volunteer-calling-table td {
                display:block;
                width:100%;
            }
            .volunteer-calling-table tr {
                border:1px solid var(--line);
                border-radius:12px;
                background:var(--panel);
                overflow:hidden;
                box-shadow:0 8px 20px rgba(91,33,79,.08);
            }
            .volunteer-calling-table td {
                padding:11px 12px;
                border-bottom:1px solid rgba(230,201,136,.58);
            }
            .volunteer-calling-table td.calling-table-mobile-hide {
                display:none;
            }
            .volunteer-calling-table td[data-label="KL"] {
                border-bottom:0;
            }
            .volunteer-calling-table td[data-label="Contact"] {
                background:rgba(255,248,232,.72);
                border-top:1px solid rgba(230,201,136,.7);
            }
            .volunteer-calling-table td[data-label="Save Remarks"] {
                background:#fffaf1;
                border-bottom:0;
            }
            .mobile-calling-summary {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:7px;
                margin-top:10px;
            }
            .mobile-calling-summary .summary-line {
                display:grid;
                gap:2px;
                padding:8px;
                border:1px solid rgba(230,201,136,.64);
                border-radius:8px;
                background:rgba(255,250,241,.68);
                min-width:0;
            }
            .mobile-calling-summary .summary-line.full {
                grid-column:1 / -1;
            }
            .mobile-calling-summary small {
                color:var(--muted);
                font-size:10px;
                font-weight:900;
                text-transform:uppercase;
            }
            .mobile-calling-summary strong {
                color:var(--ink);
                font-size:12px;
                line-height:1.25;
                overflow-wrap:anywhere;
            }
            .volunteer-calling-table .kl-row-actions {
                display:grid;
                grid-template-columns:36px 44px 44px;
                gap:8px;
                justify-content:start;
                align-items:center;
                width:max-content;
            }
            .volunteer-calling-table .kl-row-actions .icon-btn {
                width:36px;
                min-width:36px;
                height:36px;
                min-height:36px;
                padding:0;
            }
            .volunteer-calling-table .kl-row-actions .call-action,
            .volunteer-calling-table .kl-row-actions .whatsapp-action {
                width:44px;
                min-width:44px;
                height:44px;
                min-height:44px;
            }
            .volunteer-calling-table .calling-table-form {
                max-width:none;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
            }
            .volunteer-calling-table .table-update-panel {
                max-width:none;
            }
            .volunteer-calling-table .expected-headcount-fields {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
            .volunteer-calling-table .inline-profile-editor,
            .volunteer-calling-table .calling-table-form input[type="date"],
            .volunteer-calling-table .calling-table-form textarea,
            .volunteer-calling-table .calling-table-form .btn {
                grid-column:1 / -1;
            }
        }

        @media (max-width:380px) {
            .calling-stats,
            .calling-tabs,
            .volunteer-calling-table .calling-table-form,
            .volunteer-calling-table .expected-headcount-fields {
                grid-template-columns:1fr;
            }
            .mobile-calling-summary {
                grid-template-columns:repeat(2,minmax(0,1fr));
            }
        }

        @media (max-width:720px) {
            .calling-detail-page {
                gap:12px;
            }
            .calling-detail-hero {
                display:grid;
                grid-template-columns:1fr;
                gap:14px;
                overflow:hidden;
            }
            .calling-detail-person {
                display:grid;
                grid-template-columns:74px minmax(0,1fr);
                align-items:center;
                gap:12px;
                width:100%;
                min-width:0;
            }
            .calling-detail-person > div {
                min-width:0;
            }
            .calling-detail-person .profile-avatar {
                width:72px;
                height:72px;
                font-size:30px;
            }
            .calling-detail-person h2 {
                font-size:24px;
                line-height:1.15;
                margin:2px 0 6px;
                overflow-wrap:normal;
                word-break:normal;
            }
            .calling-detail-contact {
                display:grid;
                grid-template-columns:1fr;
                gap:3px;
                font-size:14px;
                line-height:1.25;
            }
            .calling-detail-contact span + span::before {
                content:"";
                margin-right:0;
            }
            .calling-detail-badges {
                gap:5px;
                margin-top:9px;
            }
            .calling-detail-actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
                width:100%;
                justify-content:stretch;
            }
            .calling-detail-actions .btn {
                width:100%;
                min-width:0;
                min-height:42px;
                justify-content:center;
                padding:8px 10px;
                font-size:13px;
                white-space:normal;
            }
            .calling-detail-stats.four {
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:10px;
            }
            .calling-detail-stats .stat {
                min-width:0;
                padding:12px;
            }
            .calling-detail-list-compact {
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
            }
            .calling-detail-list-compact > div {
                min-width:0;
                padding:9px;
                border:1px solid rgba(230,201,136,.64);
                border-radius:8px;
                background:rgba(255,250,241,.68);
            }
            .calling-detail-list-compact .wide {
                grid-column:1 / -1;
            }
            .calling-detail-list-compact span {
                font-size:10px;
                letter-spacing:0;
            }
            .calling-detail-list-compact strong {
                font-size:12px;
                line-height:1.25;
            }
            .calling-detail-form {
                grid-template-columns:1fr;
            }
            .calling-detail-form .span-two {
                grid-column:auto;
            }
            .calling-detail-plan {
                display:block;
                padding:12px;
                margin-bottom:10px;
                border:1px solid var(--line);
                border-radius:9px;
                background:rgba(255,250,241,.62);
            }
            .calling-detail-plan > * {
                display:block;
                margin-top:5px;
            }
            .calling-detail-plan > :first-child {
                margin-top:0;
            }
        }

        @media (max-width:720px) {
            .calling-queue-hero.card {
                display:grid;
                grid-template-columns:1fr;
                gap:10px;
                padding:10px 12px;
                margin-bottom:10px;
            }
            .calling-queue-hero h2 {
                font-size:24px;
                line-height:1.1;
                margin:0;
            }
            .calling-queue-hero p.muted {
                display:none;
            }
            .calling-queue-stats {
                display:grid;
                grid-template-columns:repeat(3,minmax(0,1fr));
                gap:6px;
                width:100%;
            }
            .calling-queue-stats span {
                min-width:0;
                width:100%;
                padding:7px 5px;
                text-align:center;
                border-radius:8px;
            }
            .calling-queue-stats strong {
                font-size:18px;
                line-height:1;
            }
            .calling-queue-stats small {
                font-size:10px;
                line-height:1.1;
            }
            .calling-queue-tabs {
                grid-template-columns:repeat(3,minmax(0,1fr));
                gap:6px;
                margin-bottom:8px;
                padding-bottom:0;
            }
            .calling-queue-tabs a {
                min-height:34px;
                padding:6px 5px;
                border-radius:999px;
                font-size:11px;
                line-height:1.1;
                white-space:normal;
                text-align:center;
            }
            .calling-queue-tabs span {
                display:inline-grid;
                min-width:18px;
                height:18px;
                font-size:10px;
            }
            .queue-guide {
                margin-bottom:8px;
                padding:7px 9px;
                border-radius:8px;
                font-size:12px;
                line-height:1.3;
            }
            .queue-guide strong {
                display:inline;
            }
            .calling-board {
                gap:10px;
            }
        }

        @media (max-width:380px) {
            .calling-queue-stats,
            .calling-queue-tabs {
                grid-template-columns:repeat(3,minmax(0,1fr));
            }
            .calling-queue-tabs span {
                display:none;
            }
        }

        .festival-public {
            width:min(1180px,100%);
            margin:0 auto;
            padding:18px;
        }
        .festival-public.narrow {
            width:min(760px,100%);
        }
        .festival-hero {
            display:grid;
            grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);
            gap:18px;
            align-items:center;
            padding:22px;
            border:1px solid var(--line);
            border-radius:14px;
            background:linear-gradient(135deg,#fff8e8,#f2d99a);
            box-shadow:var(--shadow);
            overflow:hidden;
        }
        .festival-kicker {
            display:inline-block;
            margin-bottom:12px;
            color:var(--maroon);
            font-family:var(--font-display);
            font-weight:900;
            text-transform:uppercase;
            letter-spacing:0;
            font-size:15px;
        }
        .festival-title-text {
            max-width:680px;
            margin:0;
            color:var(--maroon-deep);
            font-family:var(--font-display);
            text-transform:uppercase;
            text-wrap:balance;
            letter-spacing:0;
        }
        .festival-title-text span,
        .festival-title-text small,
        .festival-title-text em {
            display:block;
            font-style:normal;
            letter-spacing:0;
            overflow-wrap:normal;
            word-break:normal;
        }
        .festival-title-text span {
            font-size:64px;
            line-height:.92;
            font-weight:800;
            color:var(--maroon-deep);
            text-shadow:0 2px 0 rgba(255,244,211,.9), 0 10px 24px rgba(91,33,79,.16);
        }
        .festival-title-text small {
            margin-top:4px;
            font-size:42px;
            line-height:1.02;
            font-weight:700;
            color:#7b2d57;
        }
        .festival-title-text em {
            width:max-content;
            max-width:100%;
            margin-top:12px;
            padding:7px 16px;
            border:1px solid rgba(184,144,46,.5);
            border-radius:999px;
            background:linear-gradient(90deg,#7c1d4f,#4b123f);
            color:#fff8dd;
            font-family:"Mukta","Segoe UI",Arial,sans-serif;
            font-size:22px;
            font-weight:800;
            line-height:1;
            text-transform:none;
        }
        .festival-subtitle {
            margin:8px 0 0;
            color:var(--gold);
            font-family:var(--font-display);
            font-size:32px;
            font-weight:900;
            text-transform:uppercase;
            letter-spacing:.08em;
        }
        .festival-hero p {
            max-width:620px;
            margin:12px 0 0;
            color:var(--muted);
            font-size:17px;
            line-height:1.45;
        }
        .festival-event-meta {
            font-size:20px;
            font-weight:800;
            color:var(--maroon);
        }
        .festival-event-venue {
            font-size:18px;
            font-weight:600;
        }
        .festival-hero img {
            width:100%;
            max-height:470px;
            object-fit:contain;
            object-position:center;
            border:1px solid rgba(184,144,46,.5);
            border-radius:12px;
            box-shadow:0 14px 34px rgba(64,19,58,.2);
            background:#f6dda4;
        }
        .festival-layout {
            display:grid;
            grid-template-columns:minmax(0,1fr) minmax(280px,380px);
            gap:18px;
            margin-top:18px;
            align-items:start;
        }
        .festival-form,
        .festival-services,
        .festival-payment-card {
            border-radius:14px;
        }
        .festival-public .field {
            margin-bottom:14px;
        }
        .festival-public input,
        .festival-public select,
        .festival-public textarea {
            min-height:44px;
            padding:10px 12px;
            font-size:15px;
            line-height:1.35;
        }
        .festival-public textarea {
            min-height:92px;
        }
        .festival-public .btn {
            min-height:42px;
            padding:10px 16px;
            font-size:15px;
            justify-content:center;
            white-space:normal;
        }
        .festival-form .counter-cta {
            width:auto;
            min-width:220px;
        }
        .festival-form-actions {
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:12px;
            margin-top:14px;
        }
        .festival-detected {
            display:grid;
            gap:3px;
            padding:12px;
            border:1px solid var(--line);
            border-radius:10px;
            background:var(--amber-2);
            color:var(--muted);
        }
        .festival-detected strong {
            color:var(--maroon);
        }
        .festival-donation-choice {
            display:grid;
            gap:10px;
            padding:14px;
            border:1px solid var(--line);
            border-radius:10px;
            background:rgba(255,250,241,.7);
            margin:14px 0;
            font-weight:800;
            color:var(--muted);
        }
        .festival-donation-choice > div {
            display:flex;
            flex-wrap:wrap;
            gap:14px;
        }
        .festival-donation-choice label label,
        .festival-donation-choice > div label {
            display:inline-flex;
            gap:8px;
            align-items:center;
            color:var(--ink);
            font-weight:700;
        }
        .festival-seva-panel {
            margin:14px 0;
            padding:14px;
            border:1px solid var(--line);
            border-radius:12px;
            background:linear-gradient(180deg,#fffaf1,#fbefd7);
        }
        .festival-seva-grid {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:10px;
        }
        .festival-seva-option {
            display:flex;
            gap:10px;
            align-items:flex-start;
            min-height:74px;
            padding:12px;
            border:1px solid var(--line);
            border-radius:10px;
            background:#fffaf1;
        }
        .festival-seva-option strong,
        .festival-seva-option small {
            display:block;
        }
        .festival-seva-option small {
            margin-top:3px;
            color:var(--muted);
            font-weight:700;
        }
        .festival-services img {
            width:100%;
            max-height:520px;
            object-fit:contain;
            border-radius:10px;
            border:1px solid var(--line);
            background:#f8e7c5;
        }
        .festival-service-list {
            display:grid;
            gap:8px;
            margin-top:12px;
        }
        .festival-service-list div {
            display:flex;
            justify-content:space-between;
            gap:12px;
            padding:9px 0;
            border-bottom:1px solid rgba(230,201,136,.7);
        }
        .festival-service-list span {
            color:var(--maroon);
            font-weight:800;
        }
        .festival-status-grid,
        .festival-summary-grid {
            display:grid;
            grid-template-columns:repeat(4,minmax(0,1fr));
            gap:12px;
            margin:14px 0;
        }
        .festival-status-grid {
            grid-template-columns:repeat(2,minmax(0,1fr));
        }
        .festival-status-grid div,
        .festival-summary-grid .card {
            min-width:0;
            padding:14px;
            border:1px solid var(--line);
            border-radius:10px;
            background:rgba(255,250,241,.72);
        }
        .festival-status-grid span,
        .festival-summary-grid span {
            display:block;
            color:var(--muted);
            font-weight:800;
            text-transform:uppercase;
            font-size:11px;
        }
        .festival-status-grid strong,
        .festival-summary-grid strong {
            display:block;
            margin-top:4px;
            font-size:20px;
            color:var(--maroon);
            overflow-wrap:anywhere;
        }
        .festival-payment-lines {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            column-gap:24px;
            row-gap:0;
            margin:10px 0 14px;
            padding:10px 14px;
            border:1px solid rgba(184,144,46,.38);
            border-radius:12px;
            background:rgba(255,250,241,.66);
        }
        .festival-payment-lines div {
            display:grid;
            grid-template-columns:112px minmax(0,1fr);
            gap:10px;
            align-items:start;
            padding:8px 0;
            border-bottom:1px solid rgba(184,144,46,.22);
        }
        .festival-payment-lines div:nth-last-child(-n+2) {
            border-bottom:0;
        }
        .festival-payment-lines dt {
            color:var(--muted);
            font-size:11px;
            font-weight:800;
            text-transform:uppercase;
        }
        .festival-payment-lines dd {
            margin:0;
            color:var(--maroon);
            font-size:17px;
            font-weight:800;
            line-height:1.35;
            overflow-wrap:anywhere;
        }
        .festival-manual-payment {
            margin-top:20px;
            padding-top:18px;
            border-top:1px solid rgba(184,144,46,.35);
        }
        .festival-manual-payment h2 {
            margin-bottom:8px;
        }
        .festival-manual-grid {
            display:grid;
            grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
            gap:14px;
            align-items:start;
            margin-top:16px;
        }
        .festival-donation-card {
            min-height:100%;
            padding:16px;
            border:1px solid rgba(184,144,46,.42);
            border-radius:14px;
            background:
                linear-gradient(145deg,rgba(255,252,244,.96),rgba(252,239,211,.78));
            box-shadow:0 14px 30px rgba(42,25,15,.08);
        }
        .festival-donation-card h3 {
            margin:0 0 8px;
            color:var(--maroon);
            font-family:var(--font-display);
            font-size:20px;
            letter-spacing:0;
        }
        .festival-upi-card {
            border-left:5px solid var(--maroon);
        }
        .festival-bank-card {
            border-left:5px solid var(--gold);
        }
        .festival-qr-card {
            text-align:center;
            border-left:5px solid #159447;
        }
        .festival-detail-row {
            margin:14px 0;
            padding:14px;
            border:1px solid var(--line);
            border-radius:12px;
            background:#fffaf1;
        }
        .festival-detail-row span {
            display:block;
            margin-bottom:4px;
            color:var(--muted);
            font-size:11px;
            font-weight:800;
            text-transform:uppercase;
        }
        .festival-detail-row strong {
            display:block;
            color:var(--ink);
            font-size:17px;
            overflow-wrap:anywhere;
        }
        .festival-bank-lines {
            display:block;
            margin-top:6px;
        }
        .festival-bank-lines div {
            display:grid;
            grid-template-columns:minmax(94px,118px) minmax(0,1fr);
            gap:10px;
            align-items:start;
            padding:8px 0;
            border-bottom:1px solid rgba(184,144,46,.28);
        }
        .festival-bank-lines div:last-child {
            border-bottom:0;
        }
        .festival-bank-lines dt {
            color:var(--muted);
            font-size:11px;
            font-weight:800;
            text-transform:uppercase;
        }
        .festival-bank-lines dd {
            margin:0;
            color:var(--ink);
            font-size:15px;
            font-weight:800;
            line-height:1.35;
            overflow-wrap:anywhere;
        }
        .festival-bank-lines--payment div {
            display:block;
            padding:9px 0;
        }
        .festival-bank-lines--payment dt {
            margin-bottom:4px;
        }
        .festival-bank-lines--payment dd {
            font-size:15px;
            letter-spacing:.01em;
        }
        .festival-payment-qr {
            width:100%;
            max-width:190px;
            border:1px solid rgba(184,144,46,.45);
            border-radius:14px;
            background:#fff;
            box-shadow:0 16px 34px rgba(42,25,15,.12);
        }
        .festival-manual-payment .actions {
            display:grid;
            grid-template-columns:repeat(auto-fit,minmax(180px,auto));
            justify-content:start;
            gap:10px;
            margin-top:16px;
        }
        .festival-manual-payment .actions .btn,
        .festival-manual-payment .actions > form,
        .festival-manual-payment .actions > form .btn {
            width:100%;
            justify-content:center;
        }
        .festival-payment-status-form {
            display:flex;
            gap:8px;
            align-items:center;
            margin-top:10px;
        }
        .festival-payment-status-form select {
            min-height:38px;
            padding:7px 10px;
            font-size:14px;
        }
        .festival-admin-head {
            display:flex;
            justify-content:space-between;
            align-items:flex-start;
            gap:16px;
            margin-bottom:14px;
        }
        .festival-filter-grid {
            display:grid;
            grid-template-columns:minmax(180px,1fr) minmax(160px,220px) minmax(220px,1.2fr) auto;
            gap:12px;
            align-items:end;
        }
        .festival-filter-grid .btn {
            min-width:96px;
        }
        .success-badge {
            background:var(--green-2);
            color:var(--green);
        }

        @media (max-width:820px) {
            .festival-public {
                padding:10px;
            }
            .festival-hero,
            .festival-layout {
                grid-template-columns:1fr;
            }
            .festival-hero {
                padding:14px;
                gap:12px;
            }
            .festival-title-text span {
                font-size:38px;
                line-height:.96;
            }
            .festival-title-text small {
                font-size:26px;
            }
            .festival-hero p {
                font-size:14px;
                margin-top:8px;
            }
            .festival-title-text em {
                font-size:18px;
                padding:7px 14px;
            }
            .festival-event-meta {
                font-size:16px;
            }
            .festival-hero img {
                max-height:none;
            }
            .festival-seva-grid,
            .festival-status-grid,
            .festival-summary-grid,
            .festival-manual-grid,
            .festival-filter-grid {
                grid-template-columns:1fr;
            }
            .festival-payment-qr {
                max-width:220px;
            }
            .festival-payment-status-form {
                display:grid;
                grid-template-columns:1fr auto;
            }
            .festival-admin-head {
                display:grid;
            }
            .festival-admin-head .actions {
                display:grid;
                grid-template-columns:repeat(2,minmax(0,1fr));
                gap:8px;
            }
            .festival-admin-head .actions .btn {
                justify-content:center;
            }
            .festival-public input,
            .festival-public select,
            .festival-public textarea {
                min-height:48px;
                padding:12px 13px;
                font-size:16px;
            }
            .festival-public textarea {
                min-height:86px;
            }
            .festival-public .btn {
                min-height:48px;
                padding:12px 14px;
                font-size:16px;
            }
            .festival-form .counter-cta,
            .festival-public.narrow .btn,
            .festival-payment-card .btn {
                width:100%;
                min-width:0;
            }
            .festival-form-actions {
                flex-direction:column;
                align-items:stretch;
            }
            .festival-payment-lines {
                grid-template-columns:1fr;
                padding:8px 12px;
            }
            .festival-payment-lines div:nth-last-child(-n+2) {
                border-bottom:1px solid rgba(184,144,46,.22);
            }
            .festival-payment-lines div:last-child {
                border-bottom:0;
            }
        }

        @media (max-width:420px) {
            .festival-public .grid.two {
                grid-template-columns:1fr;
            }
            .festival-public {
                padding:8px;
            }
            .festival-form,
            .festival-payment-card {
                padding:14px;
            }
            .festival-title-text span {
                font-size:32px;
            }
            .festival-title-text small {
                font-size:22px;
            }
            .festival-title-text em {
                font-size:16px;
                margin-top:9px;
            }
            .festival-bank-lines div {
                grid-template-columns:1fr;
                gap:3px;
            }
            .festival-bank-lines--payment div {
                display:block;
            }
            .festival-payment-lines div {
                grid-template-columns:1fr;
                gap:3px;
                padding:7px 0;
            }
            .festival-payment-lines dd {
                font-size:16px;
            }
            .festival-public .field {
                margin-bottom:10px;
            }
            .festival-seva-panel {
                padding:10px;
            }
            .festival-seva-option {
                min-height:62px;
                padding:10px;
            }
            .festival-services {
                display:none;
            }
            .festival-hero img {
                max-height:none;
            }
            .festival-donation-choice > div {
                display:grid;
                grid-template-columns:1fr 1fr;
            }
        }
