/* What's new alerts: hub banner + whats-new.html (tiko-whatsnew.js). Mobile first, 320px safe. Uses the tiko-ui.css tokens. */
.wn-banner { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; background: #faf3fc; border: 2px solid #ecd5f3; border-radius: 18px; padding: 12px; margin-bottom: 14px; min-width: 0; }
.wn-b-ico { -webkit-flex: 0 0 auto; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; background: #702082; color: #fff; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font-size: 20px; margin-right: 10px; }
.wn-b-txt { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; }
.wn-b-t { font-weight: 800; font-size: 15px; color: #1f2937; overflow-wrap: anywhere; }
.wn-b-go { display: inline-block; margin-top: 4px; font-weight: 800; font-size: 14px; color: #702082; text-decoration: underline; min-height: 28px; line-height: 28px; }
.wn-b-x { -webkit-flex: 0 0 auto; flex: 0 0 auto; border: 0; background: transparent; color: #6b7280; width: 44px; height: 44px; border-radius: 50%; cursor: pointer; font-size: 18px; }

.wn-page { margin: 0; background: var(--tk-bg, #faf7fb); color: var(--tk-ink, #1f2937); font-family: var(--tk-font, 'Plus Jakarta Sans', sans-serif); min-height: 100vh; }
.wn-top { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; padding: 14px 16px; background: #4A1556; color: #fff; }
.wn-brand { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; font-weight: 800; font-size: 17px; }
.wn-brand img { width: 32px; height: 32px; margin-right: 10px; border-radius: 8px; }
.wn-lang { font: inherit; font-size: 14px; padding: 6px 8px; border-radius: 10px; border: 0; background: rgba(255,255,255,.15); color: #fff; }
.wn-lang option { color: #1f2937; }
.wn-wrap { max-width: 560px; margin: 0 auto; padding: 16px 16px 40px; min-width: 0; }
.wn-back { display: inline-block; color: #702082; font-weight: 800; font-size: 14px; text-decoration: none; min-height: 44px; line-height: 44px; }
.wn-hero { margin: 4px 0 14px; }
.wn-kicker { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #702082; }
.wn-h1 { margin: 4px 0 6px; font-size: 22px; line-height: 1.25; font-weight: 800; overflow-wrap: anywhere; }
.wn-sum { margin: 0; font-size: 14.5px; font-weight: 600; color: #4b5563; line-height: 1.5; overflow-wrap: anywhere; }
.wn-prog { display: inline-block; margin-top: 10px; font-size: 12.5px; font-weight: 800; color: #702082; background: #F3E8FA; border-radius: 99px; padding: 4px 12px; }
.wn-card { background: #fff; border: 1.5px solid #ece4f0; border-radius: 18px; padding: 14px; margin-bottom: 12px; box-shadow: 0 6px 16px rgba(112, 32, 130, .08); min-width: 0; }
.wn-card.wn-seen { border-color: #a7e3cf; }
.wn-center { text-align: center; padding: 24px 18px; }
.wn-card-top { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-start; align-items: flex-start; }
.wn-mt { margin: 0; font-size: 16px; font-weight: 800; color: #4A1556; min-width: 0; overflow-wrap: anywhere; -webkit-flex: 1 1 auto; flex: 1 1 auto; }
.wn-chip { -webkit-flex: 0 0 auto; flex: 0 0 auto; margin-left: 8px; font-size: 11.5px; font-weight: 800; color: #702082; background: #F3E8FA; border-radius: 99px; padding: 3px 10px; }
.wn-ul { margin: 10px 0 0; padding-left: 20px; font-size: 14px; font-weight: 600; color: #374151; line-height: 1.5; }
.wn-ul li { margin-bottom: 6px; overflow-wrap: anywhere; }
.wn-look { margin-top: 6px; font-size: 12.5px; font-weight: 700; color: #6b7280; }
.wn-row { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-top: 10px; }
.wn-btn { display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; box-sizing: border-box; line-height: 1.2; border: 0; background: #702082; color: #fff; font: inherit; font-weight: 800; font-size: 14px; padding: 11px 18px; border-radius: 99px; cursor: pointer; min-height: 44px; text-decoration: none; text-align: center; margin: 0 8px 6px 0; }
.wn-btn.wn-alt { background: #fff; color: #702082; border: 1.5px solid #e9d5f0; }
.wn-btn.wn-big { width: 100%; font-size: 16px; padding: 14px 18px; margin: 0; }
.wn-btn[disabled] { opacity: .5; cursor: default; }
.wn-tick { color: #0f766e; font-weight: 800; font-size: 13.5px; margin-bottom: 6px; }
.wn-final { margin-top: 16px; }
.wn-note { font-size: 13px; font-weight: 700; color: #92400e; margin: 8px 0 0; overflow-wrap: anywhere; }
.wn-ico { width: 60px; height: 60px; border-radius: 50%; margin: 0 auto 12px; background: #F3E8FA; color: #702082; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; font-size: 30px; }
.wn-ico.wn-ok { background: #d1fae5; color: #0f766e; }
.wn-h { margin: 0 0 6px; font-size: 19px; font-weight: 800; overflow-wrap: anywhere; }
.wn-p { margin: 0 0 14px; font-size: 14.5px; font-weight: 600; color: #4b5563; line-height: 1.5; }
.wn-btn:focus, .wn-b-go:focus, .wn-b-x:focus, .wn-back:focus { outline: 3px solid #f5b800; outline-offset: 2px; }
