.client-area .page{max-width:1240px;padding:32px 40px 80px}.client-area .kpi-grid{grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}.client-area .kpi-card{gap:10px;padding:18px 18px 16px}.client-area .kpi-card .value{font-size:28px;line-height:32px}.auth-screen{background:var(--bg);background-image:radial-gradient(circle at 18% 22%, color-mix(in oklab, var(--accent-500) 6%, transparent), transparent 38%), radial-gradient(circle at 82% 78%, color-mix(in oklab, var(--accent-600) 5%, transparent), transparent 40%);place-items:center;min-height:100vh;padding:32px;display:grid}.auth-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-xl);width:420px;max-width:100%;box-shadow:var(--shadow-md);padding:32px}.auth-brand{font-family:var(--font-mono);color:var(--fg);align-items:center;gap:10px;margin-bottom:28px;font-size:13px;font-weight:500;display:flex}.auth-brand .mark{background:linear-gradient(180deg, var(--accent-500), var(--accent-700));border-radius:5px;width:22px;height:22px}.auth-card h1{letter-spacing:-.02em;margin-bottom:6px;font-size:22px;line-height:28px}.auth-card .lead{color:var(--fg-muted);margin-bottom:24px;font-size:13px;line-height:1.5}.auth-card .lead strong{color:var(--fg);font-weight:500}.auth-card form{flex-direction:column;gap:16px;display:flex}.auth-card form>button{margin-top:4px}.auth-footer{color:var(--fg-subtle);text-align:center;margin-top:24px;font-size:12px}.pwd-strength{gap:4px;margin-top:6px;display:flex}.pwd-strength .bar{background:var(--bg-muted);border-radius:2px;flex:1;height:3px}.pwd-strength .bar.active.weak{background:var(--danger)}.pwd-strength .bar.active.medium{background:var(--warning)}.pwd-strength .bar.active.strong{background:var(--success)}.pwd-meta{color:var(--fg-subtle);justify-content:space-between;margin-top:4px;font-size:11px;display:flex}.welcome-shell{background:var(--bg);flex-direction:column;min-height:100vh;padding:32px 24px 80px;display:flex}.welcome-bar{justify-content:space-between;align-items:center;margin-bottom:48px;display:flex}.welcome-content{width:100%;max-width:800px;margin:24px auto 0}.welcome-content h1{letter-spacing:-.025em;margin-bottom:10px;font-size:32px;line-height:38px}.welcome-content .lead{color:var(--fg-muted);max-width:540px;margin-bottom:36px;font-size:15px;line-height:24px}.timeline{grid-template-columns:repeat(4,1fr);gap:0;margin:32px 0 28px;display:grid;position:relative}.timeline-step{padding:0 12px 0 0;position:relative}.timeline-step:not(:last-child):after{content:"";background:var(--border);height:1px;position:absolute;top:13px;left:28px;right:-12px}.timeline-step.done:not(:last-child):after{background:var(--success)}.timeline-step .node{border-radius:var(--r-full);background:var(--bg-muted);border:1px solid var(--border-strong);width:26px;height:26px;color:var(--fg-subtle);place-items:center;margin-bottom:12px;font-size:12px;font-weight:500;display:grid}.timeline-step.done .node{background:var(--success);border-color:var(--success);color:#fff}.timeline-step.current .node{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 0 0 4px var(--accent-soft)}.timeline-step .lbl{color:var(--fg-subtle);font-size:13px;font-weight:500}.timeline-step.done .lbl,.timeline-step.current .lbl{color:var(--fg)}.timeline-step .sub{color:var(--fg-subtle);margin-top:2px;font-size:11px}.qr-grid{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:24px;display:grid}.qr-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-lg);align-items:center;gap:16px;padding:20px;display:flex}.qr-card .qr{border-radius:var(--r-sm);border:1px solid var(--border);background:#fff;flex-shrink:0;width:92px;height:92px;padding:6px}.qr-card .qr svg{width:100%;height:100%;display:block}.qr-card .meta{flex:1;min-width:0}.qr-card .meta .platf{color:var(--fg-subtle);text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:500}.qr-card .meta .nm{color:var(--fg);margin-top:2px;font-size:16px;font-weight:600}.qr-card .meta .ver{color:var(--fg-muted);font-size:12px;font-family:var(--font-mono);margin-top:4px}.qr-card .meta .link{color:var(--accent);align-items:center;gap:4px;margin-top:10px;font-size:12px;display:inline-flex}.banner{border-radius:var(--r-lg);border:1px solid;align-items:center;gap:12px;margin-bottom:20px;padding:12px 16px;font-size:13px;display:flex}.banner .icon{flex-shrink:0;font-size:18px}.banner .body{flex:1;min-width:0}.banner .ttl{color:var(--fg);font-weight:500}.banner .msg{color:var(--fg-muted);margin-top:2px}.banner .actions{align-items:center;gap:8px;display:flex}.banner.info{background:var(--info-soft);border-color:var(--info-border)}.banner.info .icon{color:var(--info)}.banner.warning{background:var(--warning-soft);border-color:var(--warning-border)}.banner.warning .icon{color:var(--warning)}.banner.danger{background:var(--danger-soft);border-color:var(--danger-border)}.banner.danger .icon{color:var(--danger)}.banner.danger .ttl{color:var(--danger-fg)}.mini-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:13px}.mini-table th,.mini-table td{text-align:left;border-bottom:1px solid var(--border-muted);white-space:nowrap;vertical-align:middle;height:40px;padding:0 16px}.mini-table tbody tr:last-child td{border-bottom:0}.mini-table th{color:var(--fg-subtle);background:var(--bg-subtle);letter-spacing:.02em;text-transform:uppercase;height:32px;font-size:11px;font-weight:500}.mini-table tbody tr:hover{background:var(--bg-hover);cursor:pointer}.mini-table td.num{text-align:right}.mini-table td .ord{font-family:var(--font-mono);color:var(--accent);align-items:center;gap:4px;font-size:12px;display:inline-flex}.mini-table td .ord i{opacity:.6;font-size:12px}.invoice-card .breakdown{flex-direction:column;gap:6px;font-size:13px;display:flex}.invoice-card .breakdown .row{justify-content:space-between;align-items:center;display:flex}.invoice-card .breakdown .row .l{color:var(--fg-muted)}.invoice-card .breakdown .row .v{color:var(--fg);font-variant-numeric:tabular-nums}.invoice-card .breakdown .row.discount .v{color:var(--success-600)}[data-theme=dark] .invoice-card .breakdown .row.discount .v{color:var(--success-500)}.invoice-card .total{border-top:1px solid var(--border-muted);justify-content:space-between;align-items:baseline;margin-top:10px;padding-top:10px;display:flex}.invoice-card .total .l{font-size:13px;font-weight:500}.invoice-card .total .v{font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:20px;font-weight:600}.drawer-backdrop{background:var(--bg-overlay);z-index:60;opacity:0;pointer-events:none;transition:opacity var(--motion-base);position:fixed;inset:0}.drawer-backdrop.open{opacity:1;pointer-events:auto}.side-drawer{background:var(--bg-elevated);border-left:1px solid var(--border);width:480px;max-width:100vw;box-shadow:var(--shadow-lg);z-index:61;transition:transform var(--motion-base);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;right:0;transform:translate(100%)}.side-drawer.open{transform:translate(0)}.drawer-head{border-bottom:1px solid var(--border-muted);align-items:center;gap:12px;padding:16px 20px;display:flex}.drawer-head .title-wrap{flex:1;min-width:0}.drawer-head h3{align-items:center;gap:8px;font-size:16px;display:flex}.drawer-head h3 a{font-family:var(--font-mono);font-size:14px}.drawer-head .sub{color:var(--fg-muted);margin-top:2px;font-size:12px}.drawer-body{flex-direction:column;flex:1;gap:20px;padding:20px;display:flex;overflow-y:auto}.drawer-section .h{letter-spacing:.04em;text-transform:uppercase;color:var(--fg-subtle);margin-bottom:8px;font-size:11px;font-weight:500}.drawer-section .body{background:var(--bg-subtle);border:1px solid var(--border-muted);border-radius:var(--r-md);padding:12px 14px;font-size:13px}.drawer-section .kv{grid-template-columns:130px 1fr;gap:6px 12px;font-size:13px;display:grid}.drawer-section .kv dt{color:var(--fg-muted);font-weight:400}.drawer-section .kv dd{color:var(--fg);font-variant-numeric:tabular-nums;margin:0}.drawer-section .kv dd.mono{font-family:var(--font-mono);color:var(--fg-muted);font-size:12px}.drawer-foot{border-top:1px solid var(--border-muted);background:var(--bg-subtle);justify-content:flex-end;align-items:center;gap:8px;padding:14px 20px;display:flex}.attribution-pill{border-radius:var(--r-sm);background:var(--accent-soft);color:var(--accent-fg-on-soft);border:1px solid var(--accent-border);align-items:center;gap:6px;padding:4px 8px;font-size:11px;font-weight:500;display:inline-flex}.platform-chip{border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-muted);color:var(--fg-muted);align-items:center;gap:4px;padding:1px 6px;font-size:11px;font-weight:500;display:inline-flex}.platform-chip.ios i,.platform-chip.android i{color:var(--fg)}.config-page{grid-template-columns:240px 1fr;gap:32px;display:grid}.config-anchors{flex-direction:column;gap:2px;height:fit-content;font-size:13px;display:flex;position:sticky;top:24px}.config-anchors a{color:var(--fg-muted);border-radius:var(--r-md);border-left:2px solid #0000;align-items:center;gap:8px;padding:6px 10px;text-decoration:none;display:flex}.config-anchors a:hover{background:var(--bg-hover);color:var(--fg);text-decoration:none}.config-anchors a.active{background:var(--bg-active);color:var(--fg);border-left-color:var(--accent);font-weight:500}.config-sec{scroll-margin-top:24px}.config-sec+.config-sec{margin-top:28px}.config-sec .sec-head{margin-bottom:14px}.config-sec .sec-head h2{font-size:18px;line-height:24px}.config-sec .sec-head p{color:var(--fg-muted);margin:4px 0 0;font-size:13px}.config-sec .sec-body{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-lg);grid-template-columns:1fr 240px;gap:20px;padding:20px;display:grid}.config-sec .sec-body.no-preview{grid-template-columns:1fr}.config-sec .sec-form{flex-direction:column;gap:14px;display:flex}.config-sec .sec-foot{border-top:1px solid var(--border-muted);grid-column:1/-1;justify-content:flex-end;gap:8px;margin-top:8px;padding-top:14px;display:flex}.config-sec .lock-pill{color:var(--fg-subtle);align-items:center;gap:4px;margin-left:8px;font-size:11px;font-weight:400;display:inline-flex}.color-presets{gap:8px;display:flex}.color-preset{border-radius:var(--r-sm);border:1px solid var(--border-strong);cursor:pointer;width:28px;height:28px;position:relative}.color-preset.active{box-shadow:0 0 0 2px var(--bg-elevated), 0 0 0 4px var(--accent)}.phone{aspect-ratio:220/440;border:8px solid var(--neutral-900);background:#fff;border-radius:28px;width:220px;margin:0 auto;position:relative;overflow:hidden}[data-theme=dark] .phone{border-color:#050505}.phone .notch{background:var(--neutral-900);z-index:2;border-radius:0 0 14px 14px;width:80px;height:18px;position:absolute;top:0;left:50%;transform:translate(-50%)}[data-theme=dark] .phone .notch{background:#050505}.phone .screen{background:#f7f7f8;flex-direction:column;font-family:-apple-system,system-ui,sans-serif;font-size:11px;display:flex;position:absolute;inset:0}.phone .status-bar{color:#18181b;justify-content:space-between;align-items:center;height:20px;padding:4px 16px 0;font-size:10px;font-weight:600;display:flex}.phone .promo-banner{background:var(--accent-600);color:#fff;border-radius:8px;justify-content:space-between;align-items:center;margin:26px 8px 6px;padding:8px 10px;font-size:10px;font-weight:500;display:flex}.phone .promo-banner i{opacity:.8;font-size:10px}.phone .web{background:#fff;border:1px solid #e4e4e7;border-radius:6px;flex:1;margin:4px 8px 8px;font-size:9px;position:relative;overflow:hidden}.phone .web-hero{background:linear-gradient(135deg,#f4f4f5,#e4e4e7);height:70px}.phone .web-block{background:#e4e4e7;border-radius:2px;height:8px;margin:8px 8px 0}.phone .web-block.s{width:60%}.phone .web-block.m{width:80%}.phone .web-grid{grid-template-columns:1fr 1fr;gap:4px;margin:10px 8px;display:grid}.phone .web-tile{aspect-ratio:1;background:#f4f4f5;border-radius:4px}.phone .coupon-fab{background:var(--accent-600);color:#fff;border-radius:999px;align-items:center;gap:4px;height:28px;padding:0 10px;font-size:9px;font-weight:600;display:flex;position:absolute;bottom:12px;right:8px;box-shadow:0 6px 16px -4px #0000004d}.phone .coupon-fab i{font-size:10px}.phone.with-push .screen{background:#0b0b0c}.phone .push-notif{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:3;background:#28282ae6;border-radius:12px;gap:8px;padding:8px 10px;display:flex;position:absolute;top:26px;left:8px;right:8px;box-shadow:0 6px 16px #00000040}.phone .push-notif .app-ico{background:linear-gradient(135deg, var(--accent-400), var(--accent-700));border-radius:5px;flex-shrink:0;width:22px;height:22px}.phone .push-notif .pn-body{color:#fff;flex:1;min-width:0}.phone .push-notif .pn-meta{color:#fff9;justify-content:space-between;font-size:8px;display:flex}.phone .push-notif .pn-title{text-overflow:ellipsis;white-space:nowrap;margin-top:1px;font-size:10px;font-weight:600;overflow:hidden}.phone .push-notif .pn-msg{color:#ffffffe6;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:1px;font-size:10px;display:-webkit-box;overflow:hidden}.phone .lock-time{text-align:center;color:#ffffffd9;font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-size:36px;font-weight:300;position:absolute;top:50%;left:0;right:0;transform:translateY(-100%)}.phone .lock-date{text-align:center;color:#fff9;margin-top:-50px;font-size:11px;position:absolute;top:50%;left:0;right:0}.push-composer{grid-template-columns:1fr 280px;gap:24px;display:grid}.push-composer .form{flex-direction:column;gap:16px;display:flex}.push-composer .preview-pane{flex-direction:column;align-items:center;gap:12px;height:fit-content;display:flex;position:sticky;top:24px}.push-composer .preview-pane .meta{color:var(--fg-subtle);text-align:center;font-size:11px}.char-counter{color:var(--fg-subtle);font-variant-numeric:tabular-nums;margin-left:6px;font-size:11px}.char-counter.over{color:var(--danger)}.campaign-list{flex-direction:column;display:flex}.campaign-row{border-bottom:1px solid var(--border-muted);cursor:pointer;transition:background var(--motion-fast);grid-template-columns:1.5fr 1fr 1fr 1.2fr auto;align-items:center;gap:16px;padding:14px 16px;display:grid}.campaign-row:last-child{border-bottom:0}.campaign-row:hover{background:var(--bg-hover)}.campaign-row .nm .ttl{color:var(--fg);font-size:13px;font-weight:500}.campaign-row .nm .sub{color:var(--fg-subtle);margin-top:2px;font-size:11px}.campaign-row .stat{color:var(--fg-muted);flex-direction:column;font-size:12px;display:flex}.campaign-row .stat .val{color:var(--fg);font-variant-numeric:tabular-nums;font-size:13px;font-weight:500}.auto-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-lg);grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin-bottom:12px;padding:16px 18px;display:grid}.auto-card .ico{border-radius:var(--r-md);background:var(--accent-soft);width:36px;height:36px;color:var(--accent-fg-on-soft);place-items:center;font-size:18px;display:grid}.auto-card .info .ttl{font-size:14px;font-weight:500}.auto-card .info .sub{color:var(--fg-muted);margin-top:2px;font-size:12px}.auto-card .info .meta{color:var(--fg-subtle);margin-top:6px;font-size:11px}.bill-current{grid-template-columns:1fr 320px;gap:20px;display:grid}.bill-current .summary{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-lg);padding:24px}.bill-current .summary .head{border-bottom:1px solid var(--border-muted);justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;padding-bottom:14px;display:flex}.bill-current .summary .period{color:var(--fg-subtle);letter-spacing:.02em;text-transform:uppercase;margin-bottom:4px;font-size:12px;font-weight:500}.bill-current .summary .ttl{letter-spacing:-.02em;font-size:22px;font-weight:600;line-height:26px}.bill-current .summary .total-card{background:var(--bg-subtle);border-radius:var(--r-md);justify-content:space-between;align-items:baseline;margin-top:18px;padding:16px;display:flex}.bill-current .summary .total-card .l{font-size:13px;font-weight:500}.bill-current .summary .total-card .v{font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-size:28px;font-weight:600}.payment-method{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px}.payment-method .pm-row{align-items:center;gap:12px;padding:10px 0;display:flex}.payment-method .pm-row .ico{border-radius:var(--r-sm);background:var(--bg-muted);width:32px;height:32px;color:var(--fg-muted);place-items:center;font-size:16px;display:grid}.payment-method .pm-row.active .ico{background:var(--accent-soft);color:var(--accent-fg-on-soft)}.payment-method .pm-row.active:after{content:"";background:var(--accent);border-radius:50%;width:6px;height:6px;margin-left:auto}.payment-method .pm-row .info .ttl{font-size:13px;font-weight:500}.payment-method .pm-row .info .sub{color:var(--fg-subtle);font-size:11px}.bill-history .table tr.late td{background:color-mix(in oklab, var(--danger-soft) 50%, transparent)}.support-grid{grid-template-columns:1fr 280px;gap:24px;display:grid}.ticket-list .ticket-row{border-bottom:1px solid var(--border-muted);cursor:pointer;color:inherit;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:14px 16px;text-decoration:none;display:grid}.ticket-list .ticket-row:last-child{border-bottom:0}.ticket-list .ticket-row:hover{background:var(--bg-hover)}.ticket-list .ticket-row .nm{font-size:13px;font-weight:500}.ticket-list .ticket-row .meta{color:var(--fg-subtle);align-items:center;gap:8px;margin-top:3px;font-size:11px;display:flex}.ticket-list .ticket-row .meta .cat{font-family:var(--font-mono)}.ticket-thread .msg{border-bottom:1px solid var(--border-muted);gap:12px;padding:16px 0;display:flex}.ticket-thread .msg:last-child{border-bottom:0}.ticket-thread .msg .avatar-sm{border-radius:var(--r-full);background:var(--bg-muted);width:28px;height:28px;color:var(--fg-muted);flex-shrink:0;place-items:center;font-size:11px;font-weight:600;display:grid}.ticket-thread .msg.team .avatar-sm{background:linear-gradient(135deg, var(--accent-400), var(--accent-700));color:#fff}.ticket-thread .msg .who{justify-content:space-between;align-items:baseline;margin-bottom:4px;font-size:12px;display:flex}.ticket-thread .msg .who .nm{color:var(--fg);font-weight:500}.ticket-thread .msg .who .t{color:var(--fg-subtle);font-size:11px}.ticket-thread .msg .body-text{color:var(--fg);font-size:13px;line-height:1.55}.ticket-thread .msg .body-text p{margin:0 0 6px}.ticket-thread .reply-box{margin-top:16px}.ticket-thread .reply-box .textarea{min-height:96px}.ticket-thread .reply-foot{justify-content:space-between;align-items:center;margin-top:10px;display:flex}.support-aside .help-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px;font-size:13px}.support-aside .help-card+.help-card{margin-top:12px}.support-aside .help-card .ttl{margin-bottom:12px;font-size:13px;font-weight:600}.support-aside .help-card .row{color:var(--fg);align-items:center;gap:10px;padding:8px 0;display:flex}.support-aside .help-card .row i{color:var(--fg-subtle);font-size:16px}.support-aside .help-card .row .sub{color:var(--fg-subtle);font-size:11px;display:block}.section-h{justify-content:space-between;align-items:center;gap:12px;margin:28px 0 12px;display:flex}.section-h h2{font-size:16px;font-weight:600;line-height:22px}.section-h p{color:var(--fg-muted);margin:0;font-size:12px}.section-h .actions{align-items:center;gap:8px;display:flex}.two-col{grid-template-columns:2fr 1fr;gap:20px;display:grid}.three-col{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}body[data-viewport=mobile] .client-area .page,body[data-viewport=mobile] .welcome-shell{padding:20px 16px 64px}body[data-viewport=mobile] .client-area .kpi-grid{grid-template-columns:1fr;gap:10px}body[data-viewport=mobile] .two-col,body[data-viewport=mobile] .three-col,body[data-viewport=mobile] .bill-current,body[data-viewport=mobile] .support-grid,body[data-viewport=mobile] .config-page,body[data-viewport=mobile] .push-composer{grid-template-columns:1fr}body[data-viewport=mobile] .config-anchors{flex-flow:wrap;position:relative;top:0}body[data-viewport=mobile] .config-sec .sec-body,body[data-viewport=mobile] .qr-grid{grid-template-columns:1fr}body[data-viewport=mobile] .timeline{grid-template-columns:1fr 1fr;gap:16px}body[data-viewport=mobile] .timeline-step:after{display:none}body[data-viewport=mobile] .side-drawer{width:100%}body[data-viewport=tablet] .client-area .kpi-grid{grid-template-columns:repeat(3,1fr)}body[data-viewport=tablet] .config-page{grid-template-columns:200px 1fr}body[data-viewport=tablet] .push-composer,body[data-viewport=tablet] .bill-current{grid-template-columns:1fr}body[data-viewport=tablet] .support-grid{grid-template-columns:1fr 240px}