:root { --surface: #fff; --soft: #f5f9fc; --ink: #163148; --muted: #718597; --line: #e1ebf2; --blue: #009ed5; --shadow: 0 5px 22px #18395205; }
body { background: radial-gradient(at 90% 0px, rgb(234, 246, 252) 0px, transparent 42%), rgb(244, 247, 250); color: var(--ink); }
[hidden] { display: none !important; }
.card { background: var(--surface); box-shadow: var(--shadow); }
header { background: var(--surface); }
.top { height: 76px; }
.account { gap: 16px; }
.account button, .account a { font-size: 13px; }
.account a { text-decoration: none; color: var(--ink); }
.icon-button, .language-button, .quiet { border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 8px; padding: 9px 12px; }
.quiet:hover { border-color: var(--blue); color: var(--blue); }
.small-primary { background: var(--blue); color: white; text-decoration: none; border: 0px; padding: 10px 16px; border-radius: 8px; font-weight: 600; }
.header-nav { gap: 6px; height: auto; min-height: 57px; flex-wrap: wrap; padding-block: 8px; }
.header-nav a { display: flex; gap: 8px; align-items: center; text-decoration: none; white-space: nowrap; border-radius: 8px; padding: 10px 13px; color: rgb(100, 126, 145); font-size: 14px; border: 1px solid transparent; }
.header-nav a:hover { background: var(--soft); }
.header-nav a.current { background: rgb(232, 247, 255); color: rgb(0, 150, 205); border-color: rgb(188, 233, 250); font-weight: 600; }
.nav-icon { width: 17px; height: 17px; stroke: currentcolor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mobile-menu { display: none; }
.language { position: relative; }
.language-menu { position: absolute; right: 0px; top: 42px; z-index: 25; width: 108px; background: var(--surface); border: 1px solid var(--line); box-shadow: rgba(17, 34, 51, 0.133) 0px 10px 25px; border-radius: 10px; padding: 6px; }
.language-menu button { width: 100%; text-align: left; padding: 8px; border: 0px; background: transparent; color: var(--ink); border-radius: 5px; }
.language-menu button:hover { background: var(--soft); }
main { min-height: 65vh; padding-top: 24px; }
a { color: rgb(0, 143, 190); }
.page-grid { display: grid; gap: 24px; align-items: stretch; }
.two-col { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); }
.main-right { grid-template-columns: minmax(240px, 23fr) minmax(0px, 77fr); }
.main-left { grid-template-columns: minmax(0px, 76fr) minmax(240px, 24fr); }
.market-grid { grid-template-columns: minmax(200px, 18fr) minmax(0px, 58fr) minmax(240px, 24fr); }
.padded { padding: 28px; }
.stack { display: flex; flex-direction: column; gap: 20px; min-width: 0px; }
.stack > .stretch { flex: 1 1 0%; }
.stretch { height: 100%; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 24px; }
.section-heading p { color: var(--muted); font-size: 13px; margin-top: 8px; line-height: 1.7; }
.section-heading h1 { font-size: 20px; }
.section-heading h2 { font-size: 17px; }
.kicker { font-size: 11px; letter-spacing: 1.7px; color: var(--muted); font-weight: 700; margin-bottom: 12px; }
.muted { color: var(--muted); }
.body-copy { font-size: 14px; line-height: 1.9; color: rgb(102, 128, 147); }
.body-copy p + p { margin-top: 18px; }
.body-copy h3 { font-size: 14px; color: var(--ink); margin: 24px 0px 9px; }
.soft-box { background: var(--soft); border: 1px solid var(--line); padding: 16px; border-radius: 9px; font-size: 14px; line-height: 1.85; color: rgb(96, 123, 142); }
.info-line { display: flex; justify-content: space-between; gap: 15px; align-items: center; font-size: 13px; color: var(--muted); padding: 14px 0px; }
.info-line strong { color: var(--ink); }
.mini-stats { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 16px; margin-bottom: 24px; }
.stat { padding: 24px; }
.stat span { font-size: 13px; color: var(--muted); }
.stat strong { display: block; margin-top: 14px; font-size: 27px; letter-spacing: -0.8px; font-weight: 650; }
.stat small { font-size: 12px; color: var(--muted); display: block; margin-top: 8px; }
.stat .accent { color: var(--blue); }
.choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 12px; margin-bottom: 20px; }
.choice { padding: 18px; text-align: left; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--ink); cursor: pointer; position: relative; }
.choice strong { font-size: 14px; display: block; margin-top: 12px; }
.choice small { font-size: 12px; color: var(--muted); display: block; margin-top: 6px; }
.choice.selected, .select-row.selected { background: rgb(237, 249, 255); border-color: rgb(0, 168, 223); box-shadow: rgb(0, 168, 223) 0px 0px 0px 1px; }
.choice.selected::after { content: "✓"; position: absolute; right: 12px; top: 10px; color: var(--blue); font-size: 14px; }
.choice .nav-icon { width: 22px; height: 22px; color: var(--blue); }
.select-row { display: flex; width: 100%; align-items: center; gap: 16px; border: 1px solid var(--line); border-radius: 10px; padding: 20px; background: var(--surface); color: var(--ink); text-align: left; margin-bottom: 12px; }
.select-row strong { font-size: 15px; }
.select-row small { display: block; font-size: 12px; color: var(--muted); margin-top: 6px; }
.select-row .row-price { margin-left: auto; color: var(--blue); white-space: nowrap; font-size: 15px; font-weight: 650; }
.select-row .row-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 10px; background: rgb(238, 248, 252); color: var(--blue); }
textarea { width: 100%; min-height: 112px; resize: vertical; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; padding: 13px; line-height: 1.7; outline: none; }
textarea:focus { border-color: var(--blue); box-shadow: rgba(0, 158, 213, 0.07) 0px 0px 0px 3px; }
.inline-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.inline-fields .field { min-width: 0px; }
.full-button { width: 100%; }
.button-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.danger { color: rgb(206, 93, 101); }
.pill { display: inline-flex; align-items: center; padding: 5px 9px; background: rgb(234, 247, 253); color: rgb(0, 142, 188); font-size: 12px; border-radius: 6px; }
.pill.success { background: rgb(233, 247, 239); color: rgb(49, 136, 104); }
.pill.warning { background: rgb(255, 244, 223); color: rgb(182, 124, 39); }
.split-rule { height: 1px; background: var(--line); margin: 22px 0px; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip { padding: 8px 13px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); color: var(--muted); font-size: 13px; }
.chip.selected { background: rgb(234, 248, 255); color: rgb(0, 143, 190); border-color: rgb(156, 221, 244); }
.order-tools { display: flex; gap: 12px; align-items: center; padding: 0px 28px 22px; }
.order-tools input { max-width: 350px; }
.order-tools select { width: 150px; }
.order-list { margin-top: 24px; overflow: hidden; }
.order-list .empty-state { text-align: center; padding: 50px; color: var(--muted); }
.order-list .table-wrap { max-width: 100%; }
.order-list .pagination { flex-wrap: wrap; }
.order-list table button { font-size: 12px; }
.table-action { color: rgb(0, 143, 190); border: 0px; background: none; padding: 5px; }
.table-action:hover { text-decoration: underline; }
.pagination nav { flex-wrap: wrap; }
.number-panel { background: linear-gradient(140deg, rgb(18, 52, 78), rgb(11, 26, 44)); border: 1px solid rgb(36, 67, 88); color: rgb(255, 255, 255); min-height: 335px; display: flex; flex-direction: column; justify-content: center; padding: 30px; border-radius: 16px; }
.number-panel .muted { color: rgb(135, 167, 186); }
.number-panel h2 { font-size: 28px; letter-spacing: -0.6px; margin: 15px 0px; }
.number-panel .soft-box { background: rgba(255, 255, 255, 0.047); border-color: rgba(255, 255, 255, 0.1); color: rgb(213, 229, 240); }
.number-panel .quiet { background: rgba(255, 255, 255, 0.063); border-color: rgba(255, 255, 255, 0.145); color: rgb(255, 255, 255); }
.sms-code { font-size: 28px; font-weight: 650; color: rgb(92, 211, 255); letter-spacing: 5px; margin: 12px 0px; }
.number-panel .empty-symbol { width: 60px; height: 60px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.094); border-radius: 16px; display: grid; place-items: center; color: rgb(98, 203, 237); margin-bottom: 16px; }
.empty-symbol .nav-icon { width: 30px; height: 30px; }
.number-panel p { font-size: 14px; line-height: 1.8; }
.segment { display: flex; background: var(--soft); border-radius: 9px; padding: 4px; margin-bottom: 24px; }
.segment button { flex: 1 1 0%; padding: 11px; border: 0px; border-radius: 7px; background: none; color: var(--muted); font-size: 14px; }
.segment button.selected { background: var(--surface); box-shadow: rgba(22, 49, 72, 0.043) 0px 2px 5px; color: rgb(0, 143, 190); font-weight: 650; }
.picker-list { display: grid; gap: 6px; max-height: 220px; overflow: auto; margin-top: 10px; }
.picker-list button { display: flex; align-items: center; justify-content: space-between; padding: 12px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: var(--ink); font-size: 14px; text-align: left; }
.picker-list button.selected { background: rgb(234, 248, 255); border-color: rgb(188, 232, 250); color: rgb(0, 143, 190); }
.picker-list small { font-size: 12px; color: var(--muted); }
.eligibility-result { margin-top: 15px; padding: 12px 20px; border-radius: 8px; background: rgb(234, 248, 241); color: rgb(50, 131, 106); font-size: 14px; }
.process-list { list-style: none; padding: 0px; margin: 8px 0px 26px; counter-reset: process 0; }
.process-list li { padding-left: 40px; margin: 0px 0px 24px; counter-increment: process 1; }
.process-list li::before { content: counter(process); background: rgb(232, 247, 255); border-radius: 50%; width: 26px; height: 26px; display: grid; place-items: center; font-size: 12px; }
.membership-hero { background: linear-gradient(115deg, rgb(15, 48, 75), rgb(21, 87, 117)); color: white; padding: 32px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.membership-hero p { color: rgb(178, 203, 217); margin-top: 12px; line-height: 1.8; font-size: 14px; }
.membership-hero h1 { font-size: 27px; }
.membership-hero .member-mark { font-size: 45px; font-weight: 600; letter-spacing: -2px; color: rgb(138, 219, 243); }
.member-plans { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 18px; margin-top: 24px; }
.member-plan { padding: 25px; display: flex; flex-direction: column; }
.member-plan h2 { font-size: 23px; margin-bottom: 18px; }
.member-plan strong { font-size: 28px; color: var(--blue); }
.member-plan p { font-size: 13px; color: var(--muted); line-height: 1.8; margin-top: 16px; }
.member-plan .quiet { margin-top: 23px; }
.member-plan.current { border-color: var(--blue); }
.comparison { margin-top: 24px; overflow: hidden; }
.payment-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.payment-summary h2 { font-size: 28px; margin-top: 10px; }
.payment-summary p { font-size: 13px; color: var(--muted); }
.payment-demo { padding: 25px; background: var(--soft); border: 1px dashed rgb(190, 217, 232); border-radius: 12px; text-align: center; line-height: 1.9; color: var(--muted); font-size: 14px; margin: 20px 0px; }
.payment-demo .nav-icon { height: 40px; width: 40px; color: var(--blue); display: block; margin: 0px auto 12px; }
.copy-field { display: flex; gap: 10px; margin: 10px 0px; }
.copy-field input { min-width: 0px; }
.copy-field button { flex-shrink: 0; }
.account-grid { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 24px; }
.account-grid .card { padding: 28px; }
.session-row { display: flex; gap: 14px; align-items: center; padding: 17px 0px; border-top: 1px solid var(--line); font-size: 14px; }
.session-row small { display: block; font-size: 12px; color: var(--muted); margin-top: 7px; }
.session-row .quiet { margin-left: auto; }
.totp-display { font-size: 29px; letter-spacing: 6px; font-weight: 650; margin: 25px 0px; color: var(--blue); font-variant-numeric: tabular-nums; }
.faq-layout { display: grid; grid-template-columns: 240px minmax(0px, 1fr); gap: 24px; }
.faq-sidebar a, .terms-nav a { display: block; padding: 13px 15px; text-decoration: none; font-size: 14px; border-radius: 7px; color: var(--muted); }
.faq-sidebar a:first-child { color: var(--blue); background: rgb(237, 249, 255); }
.faq-group + .faq-group { margin-top: 24px; }
.faq-group h2 { margin-bottom: 14px; }
.faq-group details { border-top: 1px solid var(--line); padding: 18px 0px; }
.faq-group summary { font-size: 15px; font-weight: 600; cursor: pointer; line-height: 1.7; }
.faq-group details p { margin-top: 14px; color: var(--muted); font-size: 14px; line-height: 1.9; }
.terms-nav { align-self: start; position: sticky; top: 24px; }
.terms-article section + section { margin-top: 32px; }
.terms-article h2 { font-size: 18px; margin-bottom: 14px; }
.terms-article p, .terms-article li { font-size: 14px; line-height: 1.95; color: var(--muted); }
.terms-article ul { padding-left: 20px; }
.terms-article li { padding: 0px; margin: 8px 0px; }
.terms-article li::before { display: none; }
.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 20px; }
.contact-card { padding: 30px; }
.contact-card .nav-icon { width: 26px; height: 26px; color: var(--blue); margin-bottom: 20px; }
.contact-card h2 { margin-bottom: 12px; }
.contact-card p { font-size: 14px; color: var(--muted); line-height: 1.9; margin-bottom: 22px; }
.api-page { max-width: 960px; margin: 50px auto 80px; text-align: center; }
.api-page > .nav-icon { width: 48px; height: 48px; color: var(--blue); margin-bottom: 22px; }
.api-page h1 { font-size: 30px; margin: 20px 0px; }
.api-page > p { font-size: 15px; color: var(--muted); line-height: 1.9; }
.api-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 35px; text-align: left; }
.api-features .card { padding: 25px; }
.api-features p { font-size: 14px; color: var(--muted); line-height: 1.8; margin-top: 12px; }
.site-footer { background: rgb(12, 33, 52); color: rgb(133, 164, 185); margin-top: 48px; padding: 44px 0px 20px; }
.site-footer .footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 0.7fr; gap: 35px; }
.site-footer .brand { color: rgb(255, 255, 255); font-size: 21px; }
.site-footer p { font-size: 13px; line-height: 1.9; max-width: 270px; margin-top: 16px; }
.site-footer h3 { font-size: 13px; color: rgb(215, 231, 240); margin: 0px 0px 16px; }
.site-footer a:not(.brand), .site-footer button { font-size: 13px; display: block; margin: 11px 0px; color: rgb(137, 170, 190); text-decoration: none; background: none; border: 0px; padding: 0px; }
.site-footer a:hover { color: rgb(84, 197, 240); }
.footer-bottom { margin-top: 35px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.047); display: flex; justify-content: space-between; font-size: 12px; }
.preview-ribbon { font-size: 12px; color: var(--muted); display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-bottom: 14px; }
.preview-ribbon span { padding: 5px 9px; background: rgb(232, 243, 250); border-radius: 5px; color: rgb(89, 131, 153); }
.toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: rgb(21, 57, 78); color: white; border: 1px solid rgba(255, 255, 255, 0.125); box-shadow: rgba(22, 49, 72, 0.15) 0px 6px 30px; border-radius: 10px; padding: 14px 22px; font-size: 14px; max-width: calc(100% - 32px); z-index: 100; text-align: center; }
.modal { width: min(480px, 100% - 28px); border: 1px solid var(--line); border-radius: 18px; padding: 30px; background: var(--surface); color: var(--ink); box-shadow: rgba(11, 33, 60, 0.19) 0px 24px 100px; max-height: 90dvh; overflow-y: auto; }
.modal::backdrop { background: rgba(7, 29, 50, 0.4); backdrop-filter: blur(4px); }
.modal .close { float: right; background: var(--soft); color: var(--muted); width: 30px; height: 30px; border: 0px; border-radius: 50%; font-size: 20px; }
.modal h2 { font-size: 24px; margin-bottom: 12px; }
.modal .sub { font-size: 14px; color: var(--muted); line-height: 1.8; margin-bottom: 25px; }
.modal form { height: auto; }
.modal .primary { min-width: 0px; }
.modal .auth-brand { margin: 0px 0px 25px; }
.modal .auth-switch { text-align: center; font-size: 13px; color: var(--muted); margin-top: 20px; }
.password-wrap { position: relative; }
.password-wrap input { padding-right: 65px; }
.password-wrap button { position: absolute; right: 10px; top: 12px; background: none; border: 0px; color: var(--muted); font-size: 12px; }
.form-error { font-size: 13px; color: rgb(196, 85, 96); line-height: 1.7; margin: 12px 0px; }
.captcha-line { display: flex; gap: 12px; }
.captcha-code { display: flex; align-items: center; justify-content: center; min-width: 100px; background: repeating-linear-gradient(135deg, rgb(237, 248, 255), rgb(237, 248, 255) 5px, rgb(225, 240, 248) 5px, rgb(225, 240, 248) 7px); color: rgb(37, 101, 127); font-size: 23px; letter-spacing: 7px; font-weight: 700; border-radius: 8px; user-select: none; }
.delivery { white-space: pre-wrap; overflow-wrap: anywhere; background: rgb(12, 35, 54); color: rgb(191, 228, 245); font: 13px / 1.9 monospace; padding: 18px; border-radius: 10px; max-height: 260px; overflow: auto; margin: 20px 0px; }
.home-hero { position: relative; overflow: hidden; border-radius: 18px; min-height: 470px; background: rgb(12, 39, 62); display: flex; align-items: center; padding: 55px; color: white; }
.home-hero video { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; opacity: 0.62; }
.home-hero::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgba(9, 36, 54, 0.79), transparent); }
.home-hero .hero-copy { position: relative; z-index: 1; max-width: 570px; }
.home-hero h1 { font-size: clamp(32px, 4vw, 57px); line-height: 1.25; letter-spacing: -1.6px; }
.home-hero p { font-size: 16px; line-height: 1.9; color: rgb(182, 217, 234); margin: 22px 0px 30px; }
.home-hero .primary { display: inline-block; text-decoration: none; }
.home-services { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px; margin: 24px 0px; }
.home-service { text-decoration: none; color: var(--ink); padding: 28px; transition: transform 0.2s, border-color 0.2s; }
.home-service:hover { transform: translateY(-3px); border-color: rgb(143, 218, 243); }
.home-service .nav-icon { width: 27px; height: 27px; color: var(--blue); margin-bottom: 23px; }
.home-service h2 { margin-bottom: 12px; }
.home-service p { font-size: 14px; line-height: 1.9; color: var(--muted); }
.home-service .text-button { display: block; margin-top: 22px; }
.settings-toggles { display: flex; align-items: center; gap: 10px; }
.settings-toggles input { width: 18px; height: 18px; }
.settings-toggles label { margin: 0px; font-size: 13px; }
.security-badge { width: 45px; height: 45px; border-radius: 12px; background: rgb(237, 249, 255); color: var(--blue); display: grid; place-items: center; margin-bottom: 18px; }
.security-badge .nav-icon { height: 26px; width: 26px; }
.plain-link { border: 0px; background: none; color: var(--blue); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; padding: 0px; }
.language-menu .selected { background: rgb(234, 248, 255); color: rgb(0, 143, 190); }
body.dark { --surface: #10283a; --soft: #142f43; --ink: #e1edf5; --muted: #92aabd; --line: #244156; --shadow: none; background: rgb(9, 29, 44); color: var(--ink); }
body.dark input, body.dark select { background: var(--surface); color: var(--ink); border-color: var(--line); }
body.dark .brand { color: rgb(233, 245, 252); }
body.dark .balance b { color: rgb(233, 245, 252); }
body.dark .description, body.dark th { background: var(--soft); color: var(--muted); }
body.dark .description { border-color: var(--line); }
body.dark td { border-color: var(--line); }
body.dark .choice.selected, body.dark .select-row.selected, body.dark .chip.selected, body.dark .header-nav .current { background: rgb(13, 61, 83); color: rgb(112, 215, 245); }
body.dark .pagination button { background: var(--surface); border-color: var(--line); color: var(--ink); }
body.dark .pagination button.selected { background: rgb(11, 74, 96); }
body.dark .soft-box, body.dark .body-copy { color: var(--muted); }
body.dark .brand span { color: rgb(55, 188, 238); }
body.dark li b, body.dark .body-copy h3 { color: var(--ink); }
body.dark .status { background: rgb(18, 63, 58); color: rgb(124, 214, 175); }
body.dark .status.pending { background: rgb(20, 61, 85); color: rgb(117, 207, 240); }
body.dark .status.cancelled { background: rgb(36, 62, 80); color: rgb(169, 186, 197); }
body.dark .demo, body.dark .preview-ribbon span { background: rgb(21, 60, 80); color: rgb(154, 188, 205); }
#page-root form { height: auto; }
.page-grid > .card:has(> form) { display: flex; flex-direction: column; }
.page-grid > .card > form { flex: 1 1 0%; }
.stack > .stretch { height: auto; }
.soft-box.info-line { padding: 14px 16px; }
.market-grid .soft-box .info-line { padding: 8px 0px; }
.market-grid .totp-display { font-size: 26px; letter-spacing: 4px; }
.description { overflow-wrap: anywhere; }
.order-card, .padded, .card, .page-grid > * { min-width: 0px; }
#service-root .orders { scroll-margin-top: 20px; }
.number-panel { overflow-wrap: anywhere; }
.modal .brand { width: max-content; max-width: 100%; }
.home-hero video { pointer-events: none; }
.mobile-account-links { display: none; }
.preview-ribbon { line-height: 1.5; }
.market-grid .choice { padding: 15px; }
.market-grid .choice strong { margin-top: 8px; }
.market-grid .choice-grid { margin-bottom: 17px; }
.market-grid .body-copy h3 { margin-top: 20px; }
@media (min-width: 701px) and (max-height: 850px) {
  .preview-ribbon { margin-bottom: 8px; font-size: 11px; }
  main { padding-top: 15px; }
  .header-nav a { padding-top: 8px; padding-bottom: 8px; }
  .market-grid .section-heading { margin-bottom: 15px; }
  .market-grid .choice { padding: 11px; }
  .market-grid .choice small { display: none; }
  .market-grid .soft-box { padding: 8px 12px; }
  .market-grid .info-line { padding: 5px 0px !important; }
  .market-grid .totp-display { margin: 16px 0px; }
  .market-grid .body-copy { font-size: 13px; line-height: 1.7; }
  .market-grid .body-copy h3 { margin-top: 14px; }
  .market-grid .padded { padding: 20px; }
  .market-grid .field { margin-bottom: 12px; }
  .market-grid .choice-grid { margin-bottom: 13px; }
  .market-grid .checkout { margin-top: 8px; }
  .market-grid .section-heading p { margin-top: 5px; }
  .market-grid .market-tools .body-copy { margin-top: 8px !important; }
  #service-root .order-card .field { margin-bottom: 8px; }
  #service-root .intro { margin-top: 5px; }
  #service-root ol { margin: 14px 0px; }
  #service-root li { margin-bottom: 12px; }
  #service-root .notice { padding: 20px; }
  #service-root .contact { padding: 15px; }
  #service-root aside { gap: 16px; }
  #service-root .note { padding-top: 12px; }
  #service-root input, #service-root select { height: 37px; }
  #service-root .form-heading { margin-bottom: 10px; }
  #service-root .order-card { padding-top: 16px; padding-bottom: 16px; }
}
@media (max-width: 700px) {
  .mobile-account-links { display: flex; gap: 12px; border-top: 1px solid var(--line); padding-top: 8px; margin-top: 5px; }
  .preview-ribbon { font-size: 11px; }
  .market-grid .market-tools { height: auto; }
}
.number-panel, .membership-hero { background: radial-gradient(at 100% 0px, rgb(228, 247, 252) 0px, transparent 65%), rgb(255, 255, 255); border: 1px solid rgb(220, 234, 241); color: rgb(37, 67, 89); box-shadow: var(--shadow); }
.number-panel { justify-content: flex-start; padding: 30px; }
.number-panel .empty-symbol { background: rgb(222, 244, 250); border-color: rgb(222, 244, 250); color: rgb(0, 155, 189); margin-bottom: 23px; }
.number-panel .muted, .membership-hero p { color: rgb(107, 133, 152); }
.number-eyebrow { color: rgb(0, 150, 183); font-size: 12px; font-weight: 650; letter-spacing: 1px; }
.number-panel h2 { font-size: 28px; line-height: 1.4; margin: 12px 0px 16px; }
.number-features { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 27px 0px; }
.number-features > div { border-top: 1px solid rgb(204, 231, 241); padding-top: 12px; }
.number-features strong, .number-guidance strong { font-size: 14px; font-weight: 600; color: rgb(41, 75, 97); }
.number-features p, .number-guidance p { font-size: 13px; color: rgb(113, 139, 159); line-height: 1.8; margin-top: 7px; }
.number-guidance { background: rgb(243, 248, 251); padding: 15px 17px; border-radius: 10px; margin-top: auto; }
.number-panel .soft-box { background: rgb(243, 249, 252); border-color: rgb(219, 234, 242); color: rgb(52, 87, 110); }
.number-panel .quiet { background: rgb(255, 255, 255); border-color: rgb(207, 228, 239); color: rgb(22, 143, 180); }
.number-panel .quiet:hover { background: rgb(234, 248, 252); border-color: rgb(113, 207, 233); }
.number-panel .sms-code { color: rgb(0, 155, 194); }
.membership-hero .member-mark { color: rgb(32, 158, 191); font-size: clamp(24px, 3vw, 42px); letter-spacing: -1px; }
.membership-hero .pill { background: rgb(219, 242, 249); color: rgb(19, 135, 168); }
.membership-hero h1 { color: rgb(37, 67, 89); }
.membership-hero p { color: rgb(107, 133, 152); }
@media (max-width: 700px) {
  .number-panel { padding: 24px 20px; }
  .number-panel h2 { font-size: 25px; }
  .number-features { gap: 18px 15px; margin: 22px 0px; }
  .number-features strong { font-size: 13px; }
  .number-guidance { padding: 14px; }
  .membership-hero { padding: 25px; }
}
@media (min-width: 701px) and (max-height: 850px) {
  .top { height: 62px; }
  .header-nav { min-height: 49px; padding-block: 5px; }
  .padded { padding: 23px; }
  .picker-list { max-height: 170px; }
}
@media (max-width: 1200px) {
  .market-grid { grid-template-columns: minmax(190px, 23fr) minmax(0px, 77fr); }
  .market-grid > .market-notice { grid-column: 1 / -1; }
  .header-nav a { padding: 10px; font-size: 13px; }
  .account { gap: 10px; }
  .padded { padding: 23px; }
  .member-plans { grid-template-columns: repeat(2, 1fr); }
  .choice { padding: 13px; }
  .order-list th, .order-list td { padding-left: 18px; padding-right: 18px; }
}
@media (max-width: 900px) {
  .main-left, .main-right { grid-template-columns: minmax(210px, 30fr) minmax(0px, 70fr); }
  .main-left { grid-template-columns: minmax(0px, 65fr) minmax(210px, 35fr); }
  .two-col { grid-template-columns: 1fr; }
  .number-panel { min-height: 280px; }
  .site-footer .footer-grid { grid-template-columns: 1fr 1fr; }
  .account-grid { grid-template-columns: 1fr; }
  .home-services { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .wrap { width: calc(100% - 28px); }
  .top { height: 66px; }
  .account { gap: 8px; }
  .account .demo, .account .account-link, .account .small-primary { display: none; }
  .account .avatar { display: none; }
  .mobile-menu { display: block; }
  .header-nav { display: none; flex-direction: column; align-items: stretch; gap: 3px; padding-bottom: 15px; }
  .header-nav.open { display: flex; }
  .header-nav a { font-size: 14px; }
  .header-nav a .nav-icon { width: 19px; height: 19px; }
  .page-grid, .market-grid, .main-right, .main-left, .faq-layout { display: flex; flex-direction: column; gap: 18px; }
  .market-grid > .market-tools { order: 2; }
  .market-grid > .market-notice { order: 3; }
  .main-right > .side-notice { order: 2; }
  .padded { padding: 22px 18px; }
  .mini-stats { grid-template-columns: 1fr; gap: 12px; margin-bottom: 18px; }
  .stat { padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 15px; flex-wrap: wrap; }
  .stat strong { margin: 0px; font-size: 24px; }
  .stat small { width: 100%; margin-top: 0px; }
  .choice-grid { gap: 8px; }
  .choice { padding: 12px 9px; }
  .choice strong { font-size: 12px; }
  .choice small { font-size: 11px; }
  .inline-fields { grid-template-columns: 1fr; gap: 0px; }
  .order-tools { padding: 0px 18px 18px; flex-wrap: wrap; }
  .order-tools input { max-width: none; }
  .order-tools select { width: 100%; }
  .order-list { margin-top: 18px; }
  .member-plans { grid-template-columns: 1fr; }
  .membership-hero { padding: 25px; }
  .membership-hero .member-mark { display: none; }
  .contact-grid { grid-template-columns: 1fr; }
  .terms-nav { position: static; }
  .api-page { margin: 24px auto 40px; }
  .api-page h1 { font-size: 25px; }
  .api-features { grid-template-columns: 1fr; }
  .site-footer { margin-top: 32px; padding-top: 30px; }
  .site-footer .footer-grid { gap: 28px 18px; }
  .site-footer .footer-grid > div:first-child { grid-column: 1 / -1; }
  .footer-bottom { gap: 20px; font-size: 11px; }
  .number-panel { padding: 25px; }
  .number-panel h2 { font-size: 25px; }
  .home-hero { min-height: 390px; padding: 28px; }
  .home-services { grid-template-columns: 1fr; }
  .home-hero h1 { font-size: 35px; }
  .preview-ribbon { justify-content: flex-start; }
  .contact-card { padding: 24px; }
  .account-grid .card { padding: 22px 18px; }
  .modal { padding: 24px; }
  .section-heading { margin-bottom: 20px; }
  .select-row { padding: 15px; gap: 11px; }
  .select-row .row-price { font-size: 13px; }
  .session-row { flex-wrap: wrap; }
  .session-row .quiet { margin-left: 0px; }
}
@media (min-width: 1001px) and (max-height: 800px) {
  .top { height: 54px; }
  .header-nav { min-height: 44px; }
  .preview-ribbon { display: none; }
  main { padding-top: 18px; }
  #service-root .form-heading { margin-bottom: 10px; }
  #service-root .field { margin-bottom: 8px; }
  #service-root .hint { margin-top: 4px; }
  #service-root .intro { line-height: 1.55; }
  #service-root li p { line-height: 1.55; }
  #service-root .contact p { margin: 5px 0px; }
  .market-grid .padded { padding: 18px; }
  .market-grid .section-heading { margin-bottom: 12px; }
  .market-grid .choice { padding: 10px; }
  .market-grid .choice .nav-icon { width: 18px; height: 18px; }
  .market-grid .soft-box { padding: 6px 12px; }
  .market-grid .totp-display { margin: 12px 0px; }
  .market-grid .field { margin-bottom: 10px; }
  .market-grid .note { padding-top: 12px; }
  .market-grid .choice-grid { margin-bottom: 11px; }
  .market-grid .simulation-note { margin-top: 6px; }
  .main-right .split-rule { margin: 16px 0px; }
}
body { background: radial-gradient(at 96% 2%, rgba(223, 243, 252, 0.5) 0px, transparent 47%) fixed, radial-gradient(at 0% 95%, rgba(226, 242, 250, 0.5) 0px, transparent 44%), linear-gradient(135deg, rgb(248, 251, 253) 0%, rgb(240, 247, 251) 54%, rgb(247, 251, 253) 100%); }
body > header { background: transparent; border-bottom: 0px; box-shadow: none; }
.header-nav a { color: rgb(86, 117, 139); }
.header-nav a:hover { background: rgba(255, 255, 255, 0.5); }
.header-nav a.current { background: rgba(226, 245, 255, 0.72); border-color: rgb(168, 225, 245); }
.account .icon-button, .account .language-button { background: rgba(255, 255, 255, 0.44); border-color: rgb(213, 231, 240); }
.card { border-color: rgb(220, 233, 241); box-shadow: rgba(27, 90, 125, 0.016) 0px 5px 25px; }
.site-footer { background: transparent; color: rgb(104, 134, 155); margin-top: 36px; padding: 36px 0px 24px; border: 0px; }
.site-footer .brand { color: rgb(25, 59, 81); }
.site-footer h3 { color: rgb(41, 78, 101); font-weight: 650; }
.site-footer a:not(.brand), .site-footer button { color: rgb(98, 130, 152); }
.site-footer a:not(.brand):hover, .site-footer button:hover { color: rgb(0, 143, 189); }
.site-footer p { color: rgb(120, 145, 163); }
.footer-bottom { border-top: 1px solid rgba(201, 223, 235, 0.44); color: rgb(123, 148, 165); margin-top: 30px; padding-top: 20px; }
body.dark { background: radial-gradient(at 95% 0px, rgba(21, 61, 82, 0.5) 0px, transparent 50%) fixed, linear-gradient(135deg, rgb(11, 32, 47), rgb(16, 43, 60)); }
body.dark > header, body.dark .site-footer { background: transparent; }
.dark .header-nav a { color: rgb(160, 187, 205); }
.dark .header-nav a:hover { background: rgba(255, 255, 255, 0.03); }
.dark .account .icon-button, .dark .account .language-button { background: rgb(21, 52, 73); border-color: rgb(44, 77, 98); }
.dark .card { border-color: var(--line); }
.dark .site-footer .brand { color: rgb(220, 238, 249); }
.dark .site-footer h3 { color: rgb(193, 220, 233); }
.dark .site-footer a:not(.brand), .dark .site-footer button, .dark .site-footer p { color: rgb(145, 173, 191); }
.dark .footer-bottom { color: rgb(130, 157, 173); border-color: rgba(106, 159, 179, 0.157); }
@media (max-width: 700px) {
  .site-footer { margin-top: 24px; padding-top: 26px; }
  .header-nav.open { background: rgba(255, 255, 255, 0.333); border-radius: 12px; }
  .dark .header-nav.open { background: rgba(20, 48, 68, 0.5); }
}
:root { --surface: #f7fcff; --soft: #edf6fc; --line: #d4e6f1; --shadow: 0 12px 36px -20px #357da438,0 2px 7px #32719804; }
body { background: radial-gradient(at 8% 8%, rgba(255, 255, 255, 0.93) 0px, transparent 38%) fixed, radial-gradient(at 94% 16%, rgba(183, 228, 246, 0.467) 0px, transparent 46%), radial-gradient(at 4% 82%, rgba(198, 222, 251, 0.44) 0px, transparent 44%), radial-gradient(at 79% 94%, rgba(195, 238, 240, 0.45) 0px, transparent 43%), linear-gradient(130deg, rgb(238, 247, 252) 0%, rgb(231, 242, 250) 45%, rgb(241, 250, 255) 100%); }
.card { background: linear-gradient(130deg, rgba(255, 255, 255, 0.86) 0%, rgba(245, 251, 255, 0.81) 62%, rgba(237, 247, 252, 0.81) 100%); border: 1px solid rgba(255, 255, 255, 0.85); box-shadow: var(--shadow),inset 0 0 0 1px #87b5d018; backdrop-filter: blur(12px); }
.order-card { background: linear-gradient(120deg, rgba(255, 255, 255, 0.92), rgba(246, 251, 255, 0.875) 62%, rgba(239, 249, 255, 0.863)); }
.notice, .market-notice, .side-notice { background: linear-gradient(145deg, rgba(248, 253, 255, 0.875), rgba(234, 245, 252, 0.84)); }
.contact { background: linear-gradient(120deg, rgba(255, 255, 255, 0.85), rgba(234, 247, 251, 0.85)); }
input, select, textarea { background: rgba(255, 255, 255, 0.72); border-color: rgb(203, 223, 234); box-shadow: rgba(37, 92, 125, 0.01) 0px 1px 2px; transition: border-color 0.18s, box-shadow 0.18s, background 0.18s; }
input:hover, select:hover, textarea:hover { border-color: rgb(163, 202, 221); }
input:focus, select:focus, textarea:focus { background: rgb(255, 255, 255); border-color: rgb(42, 173, 214); box-shadow: rgba(0, 158, 213, 0.07) 0px 0px 0px 3px; }
.description, .soft-box { background: linear-gradient(120deg, rgba(234, 244, 251, 0.737), rgba(237, 249, 252, 0.667)); border-color: rgba(205, 229, 240, 0.5); color: rgb(82, 114, 134); }
.description p { color: rgb(82, 114, 134); }
.note, .split-rule, .checkout { border-color: rgba(199, 222, 236, 0.5); }
.split-rule { background: rgba(199, 222, 236, 0.5); }
.choice, .select-row { background: rgba(250, 253, 255, 0.7); border-color: rgb(206, 227, 239); }
.choice.selected, .select-row.selected { background: linear-gradient(125deg, rgb(226, 245, 255), rgb(234, 250, 255)); border-color: rgb(55, 182, 220); box-shadow: rgba(55, 182, 220, 0.19) 0px 0px 0px 1px, rgba(27, 158, 210, 0.04) 0px 4px 12px; }
.segment { background: rgba(220, 236, 245, 0.5); }
.segment button.selected { background: rgba(250, 255, 255, 0.95); box-shadow: rgba(59, 125, 153, 0.125) 0px 2px 8px; }
.primary { background: linear-gradient(110deg, rgb(0, 155, 209), rgb(0, 169, 214)); box-shadow: rgba(0, 157, 213, 0.27) 0px 5px 14px -4px, rgba(255, 255, 255, 0.14) 0px 1px 0px inset; }
.primary:hover { background: linear-gradient(110deg, rgb(0, 141, 188), rgb(0, 158, 201)); }
.orders, .order-list, .comparison { background: linear-gradient(125deg, rgba(255, 255, 255, 0.87), rgba(244, 250, 255, 0.87)); }
th { background: rgba(234, 244, 251, 0.58); color: rgb(97, 127, 148); }
td { border-color: rgba(216, 232, 242, 0.5); }
.order-list tbody tr:hover, .orders tbody tr:hover { background: rgba(231, 245, 252, 0.44); }
.pagination { border-color: rgba(205, 226, 238, 0.52); }
.pagination button, .quiet { background: rgba(250, 255, 255, 0.72); border-color: rgb(205, 226, 238); }
.pagination button.selected { background: rgb(223, 244, 255); border-color: rgb(139, 212, 238); }
.number-panel, .membership-hero { background: radial-gradient(at 100% 0px, rgba(200, 239, 250, 0.52), transparent 65%), linear-gradient(130deg, rgba(255, 255, 255, 0.867), rgba(240, 250, 255, 0.855)); border-color: rgba(255, 255, 255, 0.855); box-shadow: var(--shadow),inset 0 0 0 1px #87b5d018; }
.number-guidance { background: rgba(233, 244, 251, 0.66); }
.number-panel .soft-box { background: rgba(237, 248, 252, 0.74); border-color: rgb(204, 229, 239); }
.number-panel .quiet { background: rgba(255, 255, 255, 0.72); }
.header-nav a.current { background: linear-gradient(120deg, rgba(221, 243, 255, 0.86), rgba(234, 250, 255, 0.79)); border-color: rgb(155, 218, 240); box-shadow: rgba(255, 255, 255, 0.6) 0px 1px 0px inset; }
.account .icon-button, .account .language-button { background: rgba(250, 255, 255, 0.627); }
.preview-ribbon span { background: rgba(217, 237, 247, 0.48); }
.site-footer { color: rgb(88, 124, 147); }
.site-footer a:not(.brand), .site-footer button { color: rgb(84, 118, 142); }
.site-footer p { color: rgb(106, 135, 156); }
.footer-bottom { border-color: rgba(184, 213, 231, 0.36); }
body.dark { --surface: #142f42; --soft: #18394e; --line: #30536a; --shadow: 0 12px 36px -20px #0005; background: radial-gradient(at 95% 8%, rgba(25, 86, 117, 0.376), transparent 48%) fixed, radial-gradient(at 4% 88%, rgba(36, 72, 103, 0.396), transparent 45%), linear-gradient(135deg, rgb(16, 40, 56), rgb(16, 47, 65)); }
body.dark .card { background: linear-gradient(135deg, rgba(23, 53, 74, 0.92), rgba(18, 48, 68, 0.9)); border-color: rgba(87, 134, 160, 0.208); box-shadow: var(--shadow),inset 0 1px 0 #bddfff08; }
body.dark .order-card, body.dark .notice, body.dark .contact { background: linear-gradient(135deg, rgba(23, 56, 75, 0.925), rgba(20, 51, 72, 0.91)); }
body.dark input, body.dark select, body.dark textarea { background: rgba(16, 43, 61, 0.75); color: var(--ink); border-color: rgb(52, 87, 108); }
body.dark input:focus, body.dark select:focus, body.dark textarea:focus { background: rgb(21, 54, 74); border-color: rgb(70, 186, 220); }
body.dark .description, body.dark .soft-box { background: rgba(23, 61, 82, 0.49); color: rgb(162, 189, 205); border-color: rgba(80, 122, 146, 0.18); }
body.dark .description p { color: rgb(162, 189, 205); }
body.dark th { background: rgba(27, 65, 87, 0.5); color: rgb(166, 194, 211); }
body.dark td { border-color: rgba(82, 124, 146, 0.15); }
body.dark tbody tr:hover { background: rgba(40, 81, 105, 0.208); }
body.dark .choice, body.dark .select-row { background: rgba(21, 52, 73, 0.66); border-color: rgba(66, 103, 125, 0.44); }
body.dark .choice.selected, body.dark .select-row.selected { background: linear-gradient(120deg, rgb(23, 77, 102), rgb(20, 67, 88)); border-color: rgb(57, 169, 206); }
body.dark .segment { background: rgba(13, 41, 59, 0.533); }
body.dark .segment button.selected { background: rgb(37, 78, 100); }
body.dark .quiet { background: rgb(21, 55, 76); border-color: rgb(60, 99, 122); color: rgb(191, 218, 233); }
body.dark .number-panel, body.dark .membership-hero { background: radial-gradient(at 100% 0px, rgba(200, 239, 250, 0.52), transparent 65%), linear-gradient(130deg, rgb(249, 253, 255), rgb(234, 247, 252)); color: rgb(37, 67, 89); }
body.dark .number-panel .quiet { background: rgb(250, 255, 255); color: rgb(22, 143, 180); border-color: rgb(207, 228, 239); }
body.dark .number-panel .soft-box { background: rgb(230, 244, 250); color: rgb(52, 87, 110); border-color: rgb(219, 234, 242); }
@media (prefers-reduced-transparency: reduce) {
  .card { backdrop-filter: none; background: rgb(245, 251, 255); }
  body.dark .card { background: rgb(22, 54, 74); }
}
@media (max-width: 700px) {
  .card { backdrop-filter: none; }
  .header-nav.open { background: rgba(247, 252, 255, 0.79); border: 1px solid rgba(255, 255, 255, 0.7); }
  .dark .header-nav.open { background: rgba(23, 56, 75, 0.918); border-color: rgb(48, 83, 106); }
}
.card, .order-card, .notice, .market-notice, .side-notice, .contact, .orders, .order-list, .comparison { border-color: transparent; box-shadow: none; background: linear-gradient(125deg, rgba(255, 255, 255, 0.25) 0%, rgba(246, 251, 255, 0.14) 52%, rgba(234, 247, 252, 0.03) 100%); backdrop-filter: none; }
.order-card { background: linear-gradient(120deg, rgba(255, 255, 255, 0.333) 0%, rgba(247, 252, 255, 0.17) 52%, rgba(238, 249, 255, 0.04) 100%); }
.notice, .market-notice, .side-notice { background: linear-gradient(145deg, rgba(250, 255, 255, 0.19), rgba(231, 244, 252, 0.063)); }
.contact { background: linear-gradient(120deg, rgba(255, 255, 255, 0.22), rgba(237, 249, 252, 0.03)); }
.orders, .order-list, .comparison { background: linear-gradient(120deg, rgba(255, 255, 255, 0.196), rgba(244, 251, 255, 0.07)); }
.orders th, .order-list th, .comparison th { background: rgba(228, 242, 251, 0.208); }
.orders td, .order-list td, .comparison td { border-color: rgba(153, 187, 208, 0.12); }
.orders .pagination, .order-list .pagination { border-color: rgba(158, 195, 214, 0.15); }
.orders tbody tr:hover, .order-list tbody tr:hover { background: rgba(255, 255, 255, 0.196); }
.number-panel, .membership-hero { border-color: transparent; box-shadow: none; background: radial-gradient(at 100% 0px, rgba(200, 239, 250, 0.22), transparent 65%), linear-gradient(130deg, rgba(255, 255, 255, 0.27), rgba(240, 250, 255, 0.07)); }
.description, .soft-box { background: linear-gradient(120deg, rgba(230, 242, 250, 0.314), rgba(238, 250, 255, 0.125)); border-color: rgba(185, 216, 229, 0.18); }
.note, .checkout { border-color: rgba(165, 201, 221, 0.19); }
.split-rule { background: rgba(165, 201, 221, 0.19); }
body.dark .card, body.dark .order-card, body.dark .notice, body.dark .contact, body.dark .orders, body.dark .order-list, body.dark .comparison { background: linear-gradient(125deg, rgba(42, 82, 105, 0.29), rgba(23, 61, 78, 0.125)); border-color: transparent; box-shadow: none; }
body.dark .orders th, body.dark .order-list th, body.dark .comparison th { background: rgba(40, 77, 97, 0.19); }
body.dark .orders td, body.dark .order-list td { border-color: rgba(118, 148, 166, 0.1); }
body.dark .number-panel, body.dark .membership-hero { border-color: transparent; box-shadow: none; }
@media (prefers-reduced-transparency: reduce) {
  .card, .order-card, .notice, .contact, .orders, .order-list, .comparison { background: rgb(240, 247, 252); }
  body.dark .card { background: rgb(24, 57, 75); }
}
body { background-color: rgb(237, 246, 252); background-image: radial-gradient(at 4% 6%, rgb(255, 255, 255) 0px, transparent 48%), radial-gradient(at 96% 12%, rgba(145, 217, 237, 0.4) 0px, transparent 45%), radial-gradient(at 3% 94%, rgba(169, 191, 234, 0.333) 0px, transparent 45%), radial-gradient(at 83% 93%, rgba(159, 227, 223, 0.333) 0px, transparent 48%), linear-gradient(118deg, transparent 30%, rgba(255, 255, 255, 0.5) 43%, transparent 55%), linear-gradient(155deg, rgb(244, 250, 255) 0%, rgb(229, 241, 250) 48%, rgb(238, 251, 252) 100%); background-size: cover; background-attachment: fixed; color-scheme: light; }
body.dark { --surface: #17334b; --soft: #1b3e54; --ink: #e3f1fa; --muted: #adc4d5; --line: #45677c; background-color: rgb(17, 42, 64); background-image: radial-gradient(at 96% 8%, rgba(34, 124, 141, 0.4) 0px, transparent 48%), radial-gradient(at 2% 92%, rgba(81, 102, 155, 0.333) 0px, transparent 48%), radial-gradient(at 88% 96%, rgba(32, 142, 134, 0.25) 0px, transparent 48%), linear-gradient(118deg, transparent 30%, rgba(119, 150, 192, 0.08) 43%, transparent 55%), linear-gradient(155deg, rgb(25, 45, 73) 0%, rgb(19, 46, 67) 48%, rgb(18, 58, 72) 100%); background-attachment: fixed; color-scheme: dark; }
.card, .order-card, .notice, .market-notice, .side-notice, .contact, .orders, .order-list, .comparison, .number-panel, .membership-hero { background: linear-gradient(120deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.07) 65%, rgba(231, 250, 255, 0.03)); border-color: transparent; box-shadow: none; }
body.dark .card, body.dark .order-card, body.dark .notice, body.dark .market-notice, body.dark .side-notice, body.dark .contact, body.dark .orders, body.dark .order-list, body.dark .comparison, body.dark .number-panel, body.dark .membership-hero { background: linear-gradient(120deg, rgba(165, 201, 224, 0.05), rgba(130, 185, 207, 0.02) 65%, rgba(117, 219, 195, 0.02)); border-color: transparent; box-shadow: none; color: var(--ink); }
body.dark input, body.dark select, body.dark textarea { background: rgba(16, 46, 66, 0.4); color: rgb(227, 241, 250); border-color: rgba(113, 149, 172, 0.29); box-shadow: none; }
body.dark input:focus, body.dark select:focus, body.dark textarea:focus { background: rgb(22, 60, 81); border-color: rgb(81, 194, 223); box-shadow: rgba(81, 194, 223, 0.082) 0px 0px 0px 3px; }
body.dark input::placeholder, body.dark textarea::placeholder { color: rgb(147, 175, 194); }
body.dark .intro, body.dark li p, body.dark .note, body.dark .hint, body.dark .total-label, body.dark .price span, body.dark .number-panel .muted, body.dark .membership-hero p { color: rgb(173, 196, 213); }
body.dark .membership-hero h1, body.dark .number-panel h2, body.dark .number-panel strong { color: rgb(227, 241, 250); }
body.dark .number-panel .soft-box, body.dark .number-panel .quiet { background: rgba(82, 140, 165, 0.1); color: rgb(193, 222, 235); border-color: rgba(125, 172, 191, 0.145); }
body.dark .number-panel p { color: rgb(173, 196, 213); }
body.dark .description, body.dark .soft-box { background: linear-gradient(120deg, rgba(110, 162, 186, 0.08), rgba(110, 162, 186, 0.024)); border-color: rgba(131, 176, 197, 0.1); color: rgb(187, 208, 223); }
body.dark .description p { color: rgb(187, 208, 223); }
body.dark .orders th, body.dark .order-list th, body.dark .comparison th { background: rgba(128, 182, 208, 0.04); color: rgb(173, 196, 213); }
body.dark .orders tbody tr:hover, body.dark .order-list tbody tr:hover { background: rgba(166, 213, 230, 0.035); }
body.dark .note, body.dark .checkout { border-color: rgba(131, 176, 197, 0.125); }
body.dark .icon-button, body.dark .language-button { background: rgba(124, 169, 193, 0.063); color: rgb(212, 232, 245); border-color: rgba(119, 158, 181, 0.17); }
body.dark .primary, body.dark .small-primary { background: linear-gradient(110deg, rgb(8, 127, 169), rgb(7, 151, 173)); color: rgb(255, 255, 255); }
@media (prefers-reduced-transparency: reduce) {
  .card, .orders, .order-list { background: rgb(237, 246, 252); }
  body.dark .card, body.dark .orders, body.dark .order-list { background: rgb(23, 51, 75); }
}
body.dark .number-guidance { background: linear-gradient(120deg, rgba(110, 162, 186, 0.094), rgba(110, 162, 186, 0.03)); }
body.dark .number-features > div { border-color: rgba(131, 176, 197, 0.17); }
body.dark .service-option.selected { background: rgba(35, 112, 139, 0.27); color: rgb(129, 222, 243); }
body.dark select option { background: rgb(23, 51, 75); color: rgb(227, 241, 250); }
body { background-color: rgb(244, 241, 233); background-image: linear-gradient(rgba(251, 250, 244, 0.19), rgba(251, 250, 244, 0.19)), url("assets/ink-mountains-day-night.png"); background-size: 100% 100%, 200% 100%; background-position: center center, left center; background-repeat: no-repeat; background-attachment: fixed; }
body.dark { background-color: rgb(38, 62, 88); background-image: linear-gradient(rgba(18, 42, 68, 0.19), rgba(18, 42, 68, 0.19)), url("assets/ink-mountains-day-night.png"); background-size: 100% 100%, 200% 100%; background-position: center center, right center; background-repeat: no-repeat; background-attachment: fixed; }
.card, .order-card, .notice, .market-notice, .side-notice, .contact, .orders, .order-list, .comparison, .number-panel, .membership-hero { background: linear-gradient(120deg, rgba(255, 254, 249, 0.46), rgba(255, 253, 246, 0.22) 70%, rgba(255, 253, 246, 0.094)); border-color: transparent; box-shadow: none; }
body.dark .card, body.dark .order-card, body.dark .notice, body.dark .market-notice, body.dark .side-notice, body.dark .contact, body.dark .orders, body.dark .order-list, body.dark .comparison, body.dark .number-panel, body.dark .membership-hero { background: linear-gradient(120deg, rgba(20, 44, 72, 0.46), rgba(20, 44, 72, 0.314) 70%, rgba(20, 44, 72, 0.19)); }
body:not(.dark) input, body:not(.dark) select, body:not(.dark) textarea { background: rgba(255, 254, 250, 0.77); border-color: rgba(169, 186, 199, 0.36); }
body:not(.dark) .description, body:not(.dark) .soft-box { background: rgba(249, 248, 240, 0.376); border-color: rgba(172, 186, 195, 0.2); }
body:not(.dark) .orders th, body:not(.dark) .order-list th { background: rgba(235, 236, 227, 0.24); }
@media (max-width: 700px) {
  body, body.dark { background-size: 100% 100%, auto 100vh; background-position: center center, left top; }
  body.dark { background-position: center center, right top; }
}
@media (prefers-reduced-transparency: reduce) {
  .card, .orders, .order-list { background: rgb(244, 241, 233); }
  body.dark .card, body.dark .orders, body.dark .order-list { background: rgb(38, 62, 88); }
}
body { background-color: rgb(220, 228, 228); background-image: linear-gradient(rgba(243, 248, 246, 0.3), rgba(243, 248, 246, 0.3)), url("assets/sea-mist-day-night.png"); background-size: 100% 100%, 200% 100%; background-position: center center, left center; }
body.dark { background-color: rgb(24, 43, 61); background-image: linear-gradient(rgba(16, 36, 56, 0.145), rgba(16, 36, 56, 0.145)), url("assets/sea-mist-day-night.png"); background-size: 100% 100%, 200% 100%; background-position: center center, right center; }
.card, .order-card, .notice, .market-notice, .side-notice, .contact, .orders, .order-list, .comparison, .number-panel, .membership-hero { background: linear-gradient(120deg, rgba(250, 255, 255, 0.396), rgba(247, 255, 255, 0.19) 70%, rgba(247, 255, 255, 0.094)); }
body.dark .card, body.dark .order-card, body.dark .notice, body.dark .market-notice, body.dark .side-notice, body.dark .contact, body.dark .orders, body.dark .order-list, body.dark .comparison, body.dark .number-panel, body.dark .membership-hero { background: linear-gradient(120deg, rgba(24, 51, 71, 0.376), rgba(24, 51, 71, 0.22) 70%, rgba(24, 51, 71, 0.125)); }
@media (max-width: 700px) {
  body, body.dark { background-size: 100% 100%, auto 100vh; background-position: center center, left top; }
  body.dark { background-position: center center, right top; }
}
#totp-form .totp-key-wrap { position: relative; }
#totp-form .totp-key-wrap input { padding-right: 68px; width: 100%; }
#totp-form #totp-clear { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); margin: 0px; padding: 5px; font-size: 12px; min-height: 30px; background: transparent; border: 0px; }
#totp-form .totp-code-row { display: flex; align-items: center; gap: 12px; justify-content: space-between; }
#totp-form .totp-display { font-variant-numeric: tabular-nums; letter-spacing: 2px; white-space: nowrap; font-size: 26px; }
#totp-form #totp-copy { margin: 0px; padding: 6px 0px; white-space: nowrap; font-size: 12px; }
#totp-form #totp-copy:disabled { opacity: 0.4; cursor: default; }
.invite-users { margin-top: 24px; scroll-margin-top: 24px; min-width: 0px; }
.invite-users table { width: 100%; }
.invite-users .pagination { padding: 20px 0px 0px; }
.invite-users .table-wrap { overflow-x: auto; }
.invite-layout { align-items: start; }
.invite-layout > .invite-summary { grid-area: 1 / 1; }
.invite-layout > .card { grid-area: 1 / 2; }
.invite-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 20px; }
@media (max-width: 760px) {
  .invite-layout { grid-template-columns: 1fr; }
  .invite-layout > .invite-summary, .invite-layout > .card { grid-area: auto; }
  .invite-layout > .invite-summary { order: -1; }
  .invite-stat-grid { gap: 12px; }
  .invite-stat-grid .stat { padding: 20px; }
}
@media (min-width: 761px) {
  .invite-layout { align-items: stretch; }
  .invite-layout > .invite-summary { height: 100%; min-height: 0px; }
  .invite-layout > .invite-summary > .card { flex: 0 0 auto; }
  .invite-layout .invite-stat-grid { flex: 1 1 0%; align-items: stretch; }
  .invite-layout .invite-stat-grid > .stat { display: flex; flex-direction: column; justify-content: center; }
}
.invite-stat-grid { grid-template-columns: minmax(0px, 1fr); grid-template-rows: repeat(2, minmax(0px, 1fr)); }
.invite-layout .invite-stat-grid > .stat { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 28px; }
.invite-layout .invite-stat-grid > .stat > span { flex: 0 0 auto; }
.invite-layout .invite-stat-grid > .stat > strong { margin: 0px; white-space: nowrap; }
#service-root .workspace, .market-grid { grid-template-columns: minmax(300px, 28fr) minmax(0px, 72fr); gap: 24px; align-items: stretch; }
.market-grid .market-tools { gap: 20px; }
.market-grid .market-tools > .stretch { flex: 0 0 auto; }
.market-grid .market-notice { flex: 1 1 0%; grid-column: auto; }
@media (max-width: 1000px) {
  #service-root .workspace, .market-grid { grid-template-columns: minmax(260px, 32fr) minmax(0px, 68fr); gap: 20px; }
}
@media (max-width: 760px) {
  #service-root .workspace, .market-grid { grid-template-columns: minmax(0px, 1fr); gap: 20px; }
  .market-grid .market-notice { flex: 0 0 auto; }
}
@media (min-width: 1201px) {
  #service-root .workspace { grid-template-columns: clamp(280px, 23%, 360px) minmax(0px, 1fr); }
  .market-grid { grid-template-columns: clamp(280px, 23%, 360px) minmax(0px, 1fr) clamp(260px, 22%, 340px); }
  .market-grid > .market-notice { grid-column: auto; }
  .market-grid .market-tools > .stretch { flex: 1 1 0%; }
}
@media (min-width: 761px) and (max-width: 1200px) {
  #service-root .workspace, .market-grid { grid-template-columns: minmax(260px, 28fr) minmax(0px, 72fr); }
  .market-grid > .market-notice { grid-column: 1 / -1; }
  .market-grid .market-tools > .stretch { flex: 1 1 0%; }
}
#number-services, #number-countries { display: flex; flex-direction: column; gap: 6px; max-height: 402px; overflow-y: auto; }
#number-services > button, #number-countries > button { min-height: 45px; flex: 0 0 45px; }
#number-services > button span { min-width: 0px; overflow-wrap: anywhere; }
#number-services small { white-space: nowrap; }
.operator-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.operator-heading label { margin: 0px; }
.operator-buy { margin-top: 20px; }
[data-number-deadline] { font-variant-numeric: tabular-nums; white-space: nowrap; }
#number-operators .operator-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid transparent; border-radius: 7px; color: var(--ink); font-size: 14px; min-width: 0px; }
#number-operators .operator-row.selected { background: rgba(0, 158, 213, 0.063); border-color: rgba(0, 158, 213, 0.22); }
#number-operators .operator-actions { display: flex; align-items: center; gap: 14px; white-space: nowrap; }
#number-operators .operator-actions small { color: var(--muted); font-size: 12px; }
#number-operators .operator-actions button { width: auto; margin: 0px; padding: 4px 0px; border: 0px; background: none; color: var(--blue); font-size: 12px; }
#current-number.number-active { justify-content: flex-start; padding: 30px; gap: 0px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); }
.number-order-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.number-order-heading h2 { font-size: 26px; margin: 12px 0px 6px; }
.number-order-heading .pill { white-space: nowrap; }
.number-order-meta { display: flex; justify-content: space-between; gap: 16px; margin: 26px 0px; font-size: 12px; color: var(--muted); }
.number-phone-box { text-align: center; background: var(--soft); border-radius: 14px; padding: 26px 16px; }
.number-phone-box > .muted, .number-sms-box > .muted { font-size: 12px; }
.number-phone-value { display: block; font-size: clamp(24px, 2.4vw, 36px); letter-spacing: 1px; margin: 18px 0px; overflow-wrap: anywhere; }
.number-active .quiet { background: var(--surface); color: var(--ink); border-color: var(--line); }
.number-sms-box { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; border: 1px dashed var(--line); border-radius: 14px; margin-top: 16px; padding: 24px 16px; }
.number-waiting { font-size: 19px; color: var(--muted); }
.number-time { font-size: 12px; color: var(--muted); text-align: center; margin: 22px 0px; }
.number-time strong { margin-left: 10px; color: var(--ink); font-variant-numeric: tabular-nums; }
.number-order-actions { display: flex; justify-content: center; gap: 10px; }
.number-active .danger { color: rgb(196, 92, 103); border-color: rgba(217, 140, 150, 0.247); }
.number-order-actions button:disabled { opacity: 0.4; cursor: default; }
.number-demo-sms { align-self: center; margin-top: 14px; font-size: 12px; }
.number-active .muted { color: var(--muted); }
@media (max-width: 700px) {
  #current-number.number-active { padding: 22px; }
  .number-phone-value { font-size: 26px; }
}
.number-copy-actions { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.operator-subheading { margin: 14px 0px 0px; font-size: 12px; color: var(--muted); }
.virtual-workspace { grid-template-columns: repeat(2, minmax(0px, 1fr)); align-items: stretch; }
.virtual-workspace > .virtual-picker-panel, .virtual-workspace > #current-number { height: 720px; min-height: 0px; box-sizing: border-box; }
.virtual-picker-panel { overflow: hidden; }
.virtual-picker-panel > .inline-fields { height: 100%; min-height: 0px; grid-template-columns: repeat(2, minmax(0px, 1fr)); }
.virtual-picker-panel .field { display: flex; flex-direction: column; min-height: 0px; margin-bottom: 0px; }
.virtual-picker-panel .field > label, .virtual-picker-panel .field > input, .virtual-picker-panel .operator-heading { flex-shrink: 0; }
.virtual-picker-panel #number-services, .virtual-picker-panel #number-countries, .virtual-picker-panel #number-operators { flex: 1 1 0%; min-height: 0px; max-height: none; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; align-content: start; }
.virtual-workspace > #current-number { overflow-y: auto; overscroll-behavior: contain; }
@media (max-width: 900px) {
  .virtual-workspace { grid-template-columns: minmax(0px, 1fr); }
  .virtual-workspace > .virtual-picker-panel { height: 620px; }
  .virtual-workspace > #current-number { height: auto; min-height: 500px; }
}
@media (max-width: 480px) {
  .virtual-picker-panel { padding: 20px; }
  .virtual-picker-panel > .inline-fields { gap: 12px; }
  .virtual-picker-panel #number-services > button, .virtual-picker-panel #number-countries > button { min-height: 56px; flex-basis: 56px; padding: 8px; gap: 4px; }
  .virtual-picker-panel #number-services > button { flex-wrap: wrap; }
  .virtual-picker-panel #number-services small { font-size: 10px; }
}
.virtual-workspace .number-panel:not(.number-active) .number-features { flex: 1 1 0%; min-height: 220px; margin: 30px 0px; gap: 18px 26px; grid-template-rows: repeat(2, minmax(0px, 1fr)); }
.virtual-workspace .number-panel:not(.number-active) .number-features > div { display: flex; flex-direction: column; justify-content: center; padding: 20px 0px; }
.virtual-workspace .number-panel:not(.number-active) .number-features p { margin-top: 12px; line-height: 1.9; }
.virtual-workspace .number-panel:not(.number-active) .number-guidance { margin-top: 0px; padding: 20px; }
@media (max-width: 900px) {
  .virtual-workspace .number-panel:not(.number-active) .number-features { flex: 0 0 auto; min-height: 240px; margin: 24px 0px; }
}
.password-wrap button[data-password] { top: 50%; transform: translateY(-50%); right: 10px; width: 32px; height: 32px; display: grid; place-items: center; padding: 0px; border-radius: 6px; cursor: pointer; }
.password-wrap button[data-password]:hover { color: var(--ink); background: var(--soft); }
.password-wrap button[data-password]:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.number-phone-value .number-dialing-code { font-size: 0.65em; color: var(--muted); font-weight: 500; margin-right: 0.4em; }
tr[data-number-row] { cursor: pointer; }
tr[data-number-row]:hover { background: var(--soft); }
.session-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.session-policy { font-size: 12px; color: var(--muted); line-height: 1.7; margin: 0px 0px 18px; max-width: 310px; }
.session-info { flex: 1 1 0%; min-width: 0px; }
.session-title { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.session-details { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 12px; line-height: 1.8; color: var(--muted); margin-top: 8px; overflow-wrap: anywhere; }
.session-row .account-session-action { flex-shrink: 0; margin-left: auto; }