.sixsn-notice {
    --sixsn-ink: #211a29;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 13px max(24px, calc((100vw - 1220px) / 2));
    color: var(--sixsn-ink);
    background: #ffd096;
    border-bottom: 1px solid var(--sixsn-ink);
    font-family: Arial, Helvetica, sans-serif;
}

.sixsn-icon {
    display: block;
    width: 29px;
    height: 29px;
}

.sixsn-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sixsn-copy { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.sixsn-copy strong { flex: none; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.sixsn-copy p { margin: 0; font-size: 13px; line-height: 1.45; }
.sixsn-close { width: 34px; height: 34px; padding: 0; color: var(--sixsn-ink); background: transparent; border: 0; border-radius: 50%; font: 26px/1 Arial, sans-serif; cursor: pointer; }
.sixsn-close:hover { color: #fff; background: var(--sixsn-ink); }
.sixsn-close:focus-visible { outline: 3px solid #6d35ed; outline-offset: 2px; }
.sixsn-notice[hidden] { display: none; }

@media (max-width: 720px) {
    .sixsn-notice { align-items: start; gap: 10px; padding: 12px 15px; }
    .sixsn-icon { width: 25px; height: 25px; }
    .sixsn-copy { display: block; }
    .sixsn-copy strong { display: block; margin: 2px 0 4px; }
    .sixsn-copy p { font-size: 12px; }
    .sixsn-close { width: 30px; height: 30px; }
}
