*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,sans-serif;background:#f3f6fb;color:#101828}
.bar{height:74px;padding:0 max(20px,calc((100% - 1120px)/2));display:flex;align-items:center;justify-content:space-between;background:#0b1739;color:white}.bar span{font-size:12px;opacity:.7}
.wrap{max-width:1120px;margin:45px auto;padding:0 22px;display:grid;grid-template-columns:.8fr 1.2fr;gap:42px}.hero{padding:45px 0}.hero small,.card small{font-weight:900;letter-spacing:.15em;color:#246bfd}.hero h1{font-size:58px;line-height:1;margin:14px 0;color:#0b1739;letter-spacing:-.05em}.hero em{font-style:normal;color:#246bfd}.hero p{color:#667085;line-height:1.7}
.card{background:white;border-radius:25px;padding:30px;box-shadow:0 18px 55px #0b173915}.card h2{margin-top:0}.card label{display:block;font-size:12px;font-weight:800;margin:14px 0}.card input{width:100%;padding:14px;border:1px solid #e2e8f0;border-radius:12px;margin-top:7px;font-size:16px}.deps{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dep{padding:15px;text-align:left;background:white;border:1px solid #e2e8f0;border-radius:14px;cursor:pointer}.dep b,.dep span{display:block}.dep span{font-size:11px;color:#667085;margin-top:5px}.dep.sel{border:2px solid #246bfd;background:#f6f9ff;padding:14px}
button{border:0;border-radius:13px;padding:14px 18px;font-weight:800;cursor:pointer}#joinBtn,.primary{width:100%;background:#0b1739;color:white;margin-top:10px}.error{color:#d92d20;font-size:12px;min-height:15px}.hidden{display:none!important}.center{text-align:center}.number{font-size:64px;font-weight:950;color:#0b1739;letter-spacing:-.05em;margin:10px}.ahead{margin:20px auto;background:#f3f6fb;border-radius:17px;padding:18px;max-width:230px}.ahead b,.ahead span{display:block}.ahead b{font-size:38px;color:#246bfd}.ahead span{font-size:12px;color:#667085}.called{border:2px solid #bcd0ff}.bell{font-size:50px}.counter{font-size:34px;font-weight:950;color:#246bfd}
.dashboard{max-width:1180px;margin:35px auto;padding:0 22px}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat{background:white;border-radius:16px;padding:18px}.stat b{font-size:26px;display:block;color:#0b1739}.list{display:grid;gap:8px}.row{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid #e2e8f0;border-radius:12px}.row small{display:block;color:#667085}.actions{display:flex;gap:8px;margin-top:12px}.actions button{flex:1}.secondary{background:#eef2f7}.danger{background:#fff0ef;color:#b42318}.login{max-width:430px;margin:80px auto}.table{width:100%;border-collapse:collapse}.table td,.table th{padding:10px;border-bottom:1px solid #e2e8f0;text-align:left;font-size:12px}
@media(max-width:760px){.wrap{grid-template-columns:1fr;margin-top:15px}.hero{padding:20px 0}.hero h1{font-size:43px}.grid{grid-template-columns:1fr}.statgrid{grid-template-columns:1fr 1fr}.deps{grid-template-columns:1fr}}.brand{display:flex;align-items:center;gap:10px}.brand-logo{width:42px;height:42px;object-fit:contain;border-radius:10px;background:#fff;padding:3px}.brand-fallback{width:42px;height:42px;border-radius:10px;background:#fff;color:#0b1739;display:grid;place-items:center;font-weight:900}.top-actions,.row-actions{display:flex;gap:8px;flex-wrap:wrap}.section-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.section-title h2{margin:0}.mini{font-size:11px;color:#667085}.edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.logo-preview{width:72px;height:72px;border:1px solid #e4e7ec;border-radius:14px;object-fit:contain;background:white;padding:5px}.modal{position:fixed;inset:0;background:#0b173966;display:grid;place-items:center;padding:18px;z-index:30}.modal-card{width:min(560px,100%);background:white;border-radius:22px;padding:24px;box-shadow:0 20px 60px #0b173933}.badge{font-size:10px;font-weight:900;padding:6px 8px;border-radius:999px}.badge.on{background:#eafaf2;color:#087a48}.badge.off{background:#fff0ef;color:#b42318}.notice{background:#fff7e8;border:1px solid #fedf89;color:#7a2e0e;padding:12px;border-radius:12px;font-size:12px;margin:12px 0}.success{color:#067647;font-size:12px;min-height:16px}.card textarea{width:100%;padding:13px;border:1px solid #e2e8f0;border-radius:12px;margin-top:7px}.card select{width:100%;padding:13px;border:1px solid #e2e8f0;border-radius:12px;margin-top:7px;background:#fff}@media(max-width:760px){.edit-grid{grid-template-columns:1fr}}
/* =========================================
   WAITING MINI GAME
========================================= */

.waiting-message {
    color: #667085;

    font-size: 13px;

    line-height: 1.6;
}


/* GAME OFFER */

.game-offer {
    margin-top: 25px;

    padding: 13px;

    display: flex;

    align-items: center;

    gap: 11px;

    border:
        1px solid
        #e1e8f5;

    border-radius: 15px;

    background:
        linear-gradient(
            135deg,
            #f8faff,
            #eef4ff
        );

    text-align: left;
}


.game-offer-icon {
    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    display: grid;

    place-items: center;

    border-radius: 12px;

    background: white;

    font-size: 20px;

    box-shadow:
        0 4px 12px
        rgba(11, 23, 57, 0.08);
}


.game-offer-text {
    min-width: 0;

    flex: 1;
}


.game-offer-text strong,
.game-offer-text span {
    display: block;
}


.game-offer-text strong {
    color: #0b1739;

    font-size: 12px;
}


.game-offer-text span {
    margin-top: 3px;

    color: #667085;

    font-size: 10px;
}


.game-open-button {
    min-width: 70px;

    padding: 9px 13px;

    border: 0;

    border-radius: 10px;

    background: #0b1739;

    color: white;

    font-size: 11px;

    font-weight: 800;

    cursor: pointer;
}



/* GAME CONTAINER */

.mini-game {
    margin-top: 18px;

    padding: 16px;

    border:
        1px solid
        #e1e8f5;

    border-radius: 18px;

    background: #f8faff;
}



/* SCORE BAR */

.game-header {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 8px;

    margin-bottom: 12px;
}


.game-header > div {
    padding: 9px;

    border-radius: 11px;

    background: white;
}


.game-header span,
.game-header strong {
    display: block;
}


.game-header span {
    color: #98a2b3;

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 0.08em;
}


.game-header strong {
    margin-top: 2px;

    color: #0b1739;

    font-size: 18px;
}



/* GAME ARENA */

.game-arena {
    position: relative;

    width: 100%;

    height: 260px;

    overflow: hidden;

    border:
        1px solid
        #dfe7f4;

    border-radius: 16px;

    background:
        radial-gradient(
            circle at center,
            #ffffff,
            #f2f6fd
        );
}



/* TARGET */

.game-target {
    position: absolute;

    width: 54px;
    height: 54px;

    padding: 0;

    border: 6px solid white;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            #74a0ff 0 30%,
            #246bfd 31% 58%,
            #0b1739 59%
        );

    box-shadow:
        0 8px 20px
        rgba(36, 107, 253, 0.28);

    cursor: pointer;

    touch-action: manipulation;

    transition:
        transform 0.08s ease;
}


.game-target:active {
    transform: scale(0.86);
}



/* START SCREEN */

.game-start-screen {
    margin-top: 15px;

    text-align: center;
}


.game-emoji {
    font-size: 30px;
}


.game-start-screen h3 {
    margin:
        8px 0
        5px;

    color: #0b1739;

    font-size: 18px;
}


.game-start-screen p {
    max-width: 320px;

    margin:
        0 auto
        14px;

    color: #667085;

    font-size: 11px;

    line-height: 1.5;
}



/* RESULT */

.game-result {
    margin-top: 15px;

    padding: 17px;

    border-radius: 15px;

    background: white;

    text-align: center;
}


.game-result span,
.game-result strong {
    display: block;
}


.game-result span {
    color: #98a2b3;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.1em;
}


.game-result strong {
    margin-top: 3px;

    color: #246bfd;

    font-size: 42px;

    line-height: 1;
}


.game-result p {
    margin:
        7px 0
        12px;

    color: #667085;

    font-size: 11px;
}



/* BUTTONS */

.game-primary-button {
    min-width: 120px;

    padding: 11px 15px;

    border: 0;

    border-radius: 11px;

    background: #0b1739;

    color: white;

    font-size: 11px;

    font-weight: 800;

    cursor: pointer;
}


.game-close-button {
    margin-top: 12px;

    padding: 8px 12px;

    border: 0;

    background: transparent;

    color: #667085;

    font-size: 10px;

    font-weight: 700;

    cursor: pointer;
}



/* MOBILE */

@media (max-width: 480px) {

    .game-arena {
        height: 230px;
    }


    .game-target {
        width: 50px;
        height: 50px;
    }

    /* =========================================
   STAFF SELECTION
========================================= */

.staff-selection {
    margin-top: 22px;

    padding-top: 18px;

    border-top: 1px solid #e8edf5;
}


.staff-selection-heading {
    margin-bottom: 12px;
}


.staff-selection-heading small {
    display: block;

    margin-bottom: 4px;

    color: #246bfd;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.12em;
}


.staff-selection-heading h3 {
    margin: 0;

    color: #0b1739;

    font-size: 17px;
}


.staff-selection-heading p {
    margin: 5px 0 0;

    color: #667085;

    font-size: 11px;
}



/* =========================================
   STAFF LIST
========================================= */

.staff-members {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}


.staff-member-card {
    width: 100%;

    min-height: 88px;

    padding: 12px;

    display: flex;

    align-items: center;

    gap: 11px;

    text-align: left;

    border:
        1px solid
        #e2e8f0;

    border-radius: 14px;

    background: white;

    transition:
        border-color 0.2s ease,
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


.staff-member-card:hover {
    border-color: #b8ccff;

    transform: translateY(-1px);

    box-shadow:
        0 8px 22px
        rgba(11, 23, 57, 0.06);
}


.staff-member-card.selected {
    border: 2px solid #246bfd;

    padding: 11px;

    background: #f5f8ff;
}


.staff-member-card:disabled {
    cursor: not-allowed;

    opacity: 0.58;
}


.staff-unavailable {
    background: #f8f9fb;
}



/* =========================================
   STAFF AVATAR
========================================= */

.staff-avatar {
    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    display: grid;

    place-items: center;

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #0b1739,
            #246bfd
        );

    color: white;

    font-size: 13px;

    font-weight: 900;
}



/* =========================================
   STAFF INFO
========================================= */

.staff-member-info {
    min-width: 0;

    flex: 1;
}


.staff-member-info strong,
.staff-member-info span,
.staff-member-info small {
    display: block;
}


.staff-member-info strong {
    overflow: hidden;

    color: #0b1739;

    font-size: 12px;

    white-space: nowrap;

    text-overflow: ellipsis;
}


.staff-member-info span {
    margin-top: 3px;

    color: #667085;

    font-size: 10px;
}


.staff-availability {
    width: fit-content;

    margin-top: 6px;

    padding: 3px 7px;

    border-radius: 999px;

    font-size: 8px;

    font-weight: 900;
}


.staff-availability.available {
    color: #067647;

    background: #ecfdf3;
}


.staff-availability.away {
    color: #b54708;

    background: #fff6ed;
}


.staff-select-arrow {
    flex: 0 0 auto;

    color: #98a2b3;

    font-size: 16px;

    font-weight: 900;
}


.staff-member-card.selected
.staff-select-arrow {
    color: #246bfd;
}



/* =========================================
   SELECTED STAFF SUMMARY
========================================= */

.selected-staff-card {
    margin-top: 12px;

    padding: 12px 14px;

    border:
        1px solid
        #d9e5ff;

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #f6f9ff,
            #eef4ff
        );
}


.selected-staff-card span,
.selected-staff-card strong,
.selected-staff-card small {
    display: block;
}


.selected-staff-card span {
    color: #667085;

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 0.07em;

    text-transform: uppercase;
}


.selected-staff-card strong {
    margin-top: 4px;

    color: #0b1739;

    font-size: 13px;
}


.selected-staff-card small {
    margin-top: 2px;

    color: #246bfd;

    font-size: 10px;
}



/* =========================================
   STAFF LOADING / EMPTY
========================================= */

.staff-loading,
.staff-empty {
    grid-column: 1 / -1;

    padding: 16px;

    border:
        1px dashed
        #d8dee9;

    border-radius: 13px;

    background: #fafbfc;

    color: #667085;

    font-size: 11px;

    text-align: center;
}


.staff-empty strong,
.staff-empty span {
    display: block;
}


.staff-empty strong {
    color: #344054;

    font-size: 12px;
}


.staff-empty span {
    margin-top: 3px;

    font-size: 10px;
}



/* =========================================
   WAITING STAFF INFO
========================================= */

.waiting-staff-info {
    max-width: 280px;

    margin:
        15px auto
        0;

    padding: 11px 14px;

    border:
        1px solid
        #e1e8f5;

    border-radius: 13px;

    background: #f8faff;
}


.waiting-staff-info span,
.waiting-staff-info strong,
.waiting-staff-info small {
    display: block;
}


.waiting-staff-info span {
    color: #98a2b3;

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 0.07em;

    text-transform: uppercase;
}


.waiting-staff-info strong {
    margin-top: 4px;

    color: #0b1739;

    font-size: 13px;
}


.waiting-staff-info small {
    margin-top: 2px;

    color: #246bfd;

    font-size: 10px;
}



/* =========================================
   CALLED STAFF INFO
========================================= */

.called-staff-info {
    max-width: 260px;

    margin:
        14px auto
        0;

    padding: 10px 13px;

    border-radius: 12px;

    background: #f3f6fb;
}


.called-staff-info span,
.called-staff-info strong {
    display: block;
}


.called-staff-info span {
    color: #98a2b3;

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 0.08em;

    text-transform: uppercase;
}


.called-staff-info strong {
    margin-top: 4px;

    color: #0b1739;

    font-size: 12px;
}



/* =========================================
   MOBILE
========================================= */

@media (max-width: 760px) {

    .staff-members {
        grid-template-columns: 1fr;
    }

}

/* =========================================
   SVMS VISIT PURPOSE / Q-CODE FLOW
========================================= */
.visit-step-heading{margin:24px 0 12px}.visit-step-heading small{display:block;color:#246bfd;font-size:9px;font-weight:900;letter-spacing:.14em}.visit-step-heading h3{margin:6px 0 3px;color:#0b1739;font-size:17px}.visit-step-heading p{margin:0;color:#667085;font-size:11px;line-height:1.5}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.service-card{position:relative;min-height:112px;padding:15px;text-align:left;border:1px solid #e2e8f0;border-radius:15px;background:#fff;transition:.18s ease}.service-card:hover{transform:translateY(-1px);border-color:#b7ccff;box-shadow:0 9px 24px rgba(11,23,57,.06)}.service-card.selected{border:2px solid #246bfd;background:#f5f8ff;padding:14px}.service-code{display:inline-flex;padding:4px 7px;border-radius:999px;background:#eef4ff;color:#246bfd;font-size:8px;font-weight:950;letter-spacing:.08em}.service-card strong,.service-card small{display:block}.service-card strong{margin-top:8px;color:#0b1739;font-size:12px;line-height:1.35;padding-right:20px}.service-card small{margin-top:5px;color:#667085;font-size:9px;line-height:1.45}.service-arrow{position:absolute;right:13px;bottom:12px;color:#98a2b3;font-size:18px;font-weight:900}
.visit-options{margin-top:22px;padding-top:2px}.service-option-grid{display:grid;gap:9px}.service-option-card{width:100%;display:grid;grid-template-columns:38px 1fr 20px;gap:9px;align-items:center;text-align:left;padding:12px;border:1px solid #e2e8f0;border-radius:13px;background:#fff}.service-option-card>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#f3f6fb;color:#246bfd;font-size:9px;font-weight:900}.service-option-card strong,.service-option-card small{display:block}.service-option-card strong{font-size:11px;color:#0b1739}.service-option-card small{margin-top:3px;font-size:9px;color:#667085}.service-option-card>b{font-size:17px;color:#98a2b3}.service-option-card.selected{border:2px solid #246bfd;background:#f5f8ff;padding:11px}
.information-result{margin-top:18px;padding:16px;border:1px solid #bcd0ff;border-radius:15px;background:linear-gradient(135deg,#f5f8ff,#eef4ff)}.information-result>span{font-size:8px;font-weight:950;letter-spacing:.12em;color:#246bfd}.information-result h3{margin:6px 0 5px;color:#0b1739;font-size:15px}.information-result p{margin:0;color:#475467;font-size:11px;line-height:1.6}.staff-cover-note{display:block;margin-top:6px;color:#246bfd;font-size:8px;font-weight:800;line-height:1.4}
@media(max-width:760px){.service-grid{grid-template-columns:1fr}.service-card{min-height:96px}}

/* v2.2: intrinsic widths and explicit card grid placement */
.wrap {grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.wrap>*,.card,.grid>*,.statgrid>*,.row>*,.staff-member-info {min-width:0}
.service-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
.service-card,.service-option-card,.staff-member-card {min-width:0;max-width:100%;overflow-wrap:anywhere}
.service-option-card {grid-template-columns:34px minmax(0,1fr) 16px;grid-template-rows:auto auto;column-gap:12px}
.service-option-card>span {grid-column:1;grid-row:1/3}
.service-option-card>strong {grid-column:2;grid-row:1;font-size:13px;line-height:1.5}
.service-option-card>small {grid-column:2;grid-row:2;letter-spacing:normal;line-height:1.5;font-size:11px}
.service-option-card>b {grid-column:3;grid-row:1/3}
.service-card small {letter-spacing:normal;font-weight:500;font-size:11px}
.service-card strong {font-size:13px}
.number {font-size:clamp(28px,6vw,58px);overflow-wrap:anywhere}
button:disabled {opacity:.55;cursor:not-allowed}
button:focus-visible,a:focus-visible {outline:3px solid #60a5fa;outline-offset:3px}
.briefing-page {grid-column:1/-1;max-width:850px;width:100%;margin:auto;line-height:1.8}
.briefing-page h1 {font-size:clamp(28px,4vw,44px);line-height:1.15;color:#0b1739}
.briefing-page h2 {margin:28px 0 10px}
.briefing-page img {display:block;max-width:100%;height:auto;border-radius:16px;margin:16px auto}
.briefing-page p,.briefing-page li {overflow-wrap:anywhere;color:#475467}
.briefing-page .brief-subtitle {font-size:18px;color:#246bfd}
.briefing-notice {border-left:4px solid #246bfd;background:#eef4ff;padding:16px;border-radius:10px}
@media(max-width:760px){.wrap{grid-template-columns:minmax(0,1fr);gap:20px}.service-grid{grid-template-columns:minmax(0,1fr)}.card{padding:22px}.top{align-items:flex-start;gap:12px;flex-wrap:wrap}.stat b{font-size:20px;overflow-wrap:anywhere}.row{gap:10px;flex-wrap:wrap}.brand{min-width:0}.brand>div{min-width:0}.bar{height:auto;min-height:74px;padding:14px 18px;gap:12px}.bar .brand{flex:1}.bar span{overflow-wrap:anywhere}.actions{flex-wrap:wrap}}

/* v2.4 compact progressive service selection: details appear after selection. */
#services.service-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
#services .q-code-button {display:grid;place-items:center;min-height:52px;padding:12px 4px;font-size:13px;font-weight:800;letter-spacing:.02em;color:#0b1739;background:#f6f8fc;border:1px solid #dfe6f1;border-radius:12px;text-align:center}
#services .q-code-button:hover {background:#eef4ff;transform:none;border-color:#246bfd}
#services .q-code-button.selected {background:#0b1739;color:white;border-color:#0b1739;box-shadow:0 5px 14px #0b173920}
.selected-service-details {margin-top:16px;padding:18px;border:1px solid #dce7fa;border-radius:15px;background:#f5f8ff}
.detail-eyebrow {font-size:11px;font-weight:900;letter-spacing:.09em;color:#246bfd}
.selected-service-details h3 {margin:6px 0;font-size:18px;line-height:1.4;overflow-wrap:anywhere}
.selected-service-details p {margin:0;font-size:13px;line-height:1.65;color:#667085}
#serviceOptions.service-option-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
#serviceOptions .option-number-button {display:grid;grid-template-columns:1fr;grid-template-rows:1fr;place-items:center;min-height:46px;padding:10px 4px;border:1px solid #dfe6f1;background:white;border-radius:12px;font-size:14px;font-weight:800;color:#475467;text-align:center}
#serviceOptions .option-number-button:hover {border-color:#246bfd;background:#f5f8ff}
#serviceOptions .option-number-button.selected {background:#246bfd;border-color:#246bfd;color:white}
.selected-option-details {display:flex;align-items:center;gap:12px;margin-top:14px;padding:16px;background:#f5f8ff;border-radius:13px;min-width:0}
.option-detail-number {display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;background:white;color:#246bfd;border-radius:9px;font-weight:900;font-size:12px}
.selected-option-details h3 {font-size:15px;line-height:1.5;margin:0;min-width:0;overflow-wrap:anywhere}
@media(max-width:400px){#services.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#serviceOptions.service-option-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}}

/* v2.5: dropdowns after the main Q-code buttons */
#serviceOptions.service-option-grid,#staffMembers{display:block;width:100%;grid-template-columns:none}#serviceOptions label,.staff-dropdown-label{display:block;font-size:13px;margin:12px 0;color:#344054}#serviceOptions select,#staffSelect{display:block;width:100%;padding:13px;margin-top:8px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:#10213e;font:inherit}.priority-notice{padding:16px;border:2px solid #f2b84b;border-radius:14px;background:#fff7df;text-align:left;color:#452d08;margin:14px 0;line-height:1.6}.priority-notice p{margin:8px 0}#selectedOptionNumber{display:none}

@font-face{font-family:SVMS-Sinhala;src:url('../vendor/fonts/noto-sans-sinhala-sinhala-400-normal.woff2') format('woff2');font-display:swap}@font-face{font-family:SVMS-Tamil;src:url('../vendor/fonts/noto-sans-tamil-tamil-400-normal.woff2') format('woff2');font-display:swap}
.priority-notice,#priorityDisplayNotice,#priorityReason,#briefIntro,#briefNotice,.briefing-page{font-family:Arial,SVMS-Sinhala,SVMS-Tamil,sans-serif}

.visitor-sound{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;padding:10px 16px;background:#eaf1ff;color:#10213e;font-size:12px}.visitor-sound button{padding:8px 12px}#visitorSoundStatus{max-width:100%;overflow-wrap:anywhere}