*,*::before,*::after{box-sizing:border-box}*{color:var(--text)}*::-webkit-scrollbar{display:none}html{position:absolute;width:100%;height:100%;margin:0;padding:0;overscroll-behavior:none}html body{position:absolute;width:100%;height:100%;margin:0;padding:0;overflow:hidden;overscroll-behavior:none;font-family:system-ui;background:var(--surface)}:root{--surface: #fff;--surface-2: #f8f8f8;--surface-3: #f0f0f0;--accent-subtle: #eef;--accent-muted: #ccf;--accent: #aaf;--text: #444;--text-inverse: #fff;--text-subtle: #668;--text-muted: #666;--icon: var(--text);--icon-inverse: var(--text-inverse);--border: #eee;--shadow-color: #ccc;--elevation-1: 0 0 4px var(--shadow-color);--elevation-2: 0 2px 8px var(--shadow-color);--overlay: #808080;--ring: #48f;--success: #096;--success-surface: #cfc;--warning: #a80;--warning-surface: #ffa;--error: #f66;--error-surface: #fcc;--control: #444;--control-muted: #888;--field-bg: color-mix(in srgb, var(--text) 2.5%, transparent);--btn-primary-bg: var(--control);--btn-primary-text: var(--icon-inverse);--btn-primary-border: transparent;--btn-primary-hover: color-mix(in srgb, var(--btn-primary-bg) 86%, #000);--btn-danger-bg: var(--error);--btn-danger-text: var(--icon-inverse);--btn-danger-border: transparent;--btn-danger-hover: color-mix(in srgb, var(--btn-danger-bg) 86%, #000);--btn-ghost-bg: transparent;--btn-ghost-text: var(--text);--btn-ghost-border: var(--border);--btn-ghost-hover: color-mix(in srgb, var(--text) 6%, transparent);--nav-bg: #333;--nav-bg-hover: #222;--nav-active: #222;--nav-bg-title: #111;--nav-text: #ccc;--chart-1: #48f;--chart-2: #f84;--chart-3: #22c55e;--chart-4: #ef4444;--chart-5: #9ca3af;--chart-6: #3b82f6;--chart-7: #f59e0b;--chart-8: #10b981;--radius: 8px;--transition-ui: 256ms;--transition-anim: 1000ms}code{white-space:normal}pre code{white-space:pre}.section-title{font-size:1.5rem;font-weight:700;color:var(--text);padding-bottom:8px;border-bottom:2px solid var(--border);position:relative}.section-title::after{content:"";position:absolute;bottom:-2px;left:0;width:50px;height:2px;background:var(--control)}#app{position:absolute;width:100%;height:100%;display:flex;flex-flow:column;align-items:flex-end;justify-content:center}.root{overflow:hidden;position:absolute;height:100%;width:100%;left:0;top:0}.drawer{overflow:hidden;position:absolute;height:100%;width:100%;max-width:300px;top:0}.column{display:flex;flex-flow:column}.row{display:flex;flex-flow:row}.center{display:flex;align-items:center;justify-content:center}.content-center{display:flex;justify-content:center}.content-end{display:flex;justify-content:flex-end}.content-start{display:flex;justify-content:flex-start}.items-center{display:flex;align-items:center}.items-end{display:flex;align-items:flex-end}.items-start{display:flex;align-items:flex-start}.items-stretch{display:flex;align-items:stretch}.self-start{align-self:flex-start}.self-center{align-self:center}.space-around{display:flex;justify-content:space-around}.space-between{display:flex;justify-content:space-between}.wrap{flex-wrap:wrap}.noscroll{overflow:hidden}.scroll{overflow:auto;scroll-behavior:smooth}.flex{flex:1}.flex2{flex:2}.flex3{flex:3}.flex4{flex:4}.fill{width:100%;height:100%}.fillw{width:100%}.fillh{height:100%}.z1{z-index:1}.z2{z-index:2}.panel{border:none;box-shadow:var(--elevation-1);margin:32px;max-width:1280px;width:100%}.avatar{width:32px;border-radius:50%}.break-all{word-break:break-all}.grid150{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:16px}.grid1x1{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;gap:16px;padding:16px}.grid-fit{width:100%;display:grid;gap:var(--grid-gap, 16px);grid-template-columns:repeat(auto-fit, minmax(min(var(--grid-min, 240px), 100%), 1fr))}.ball32{display:flex;justify-content:center;align-items:center;border-radius:50%;background:var(--accent-muted);width:32px;height:32px}@media screen and (max-width: 480px){.bigger480{display:none}}@media screen and (max-width: 640px){.bigger640{display:none}}@media screen and (max-width: 720px){.bigger720{display:none}}main{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;display:flex;flex-flow:column;align-items:center;justify-content:center;background:var(--surface)}.root main{position:relative;flex:1;height:100%;min-width:0;align-items:stretch;justify-content:flex-start}article{display:flex;flex-flow:column;flex:1;align-items:center;overflow:auto;padding:16px}header{background:var(--surface);border:none;box-shadow:var(--elevation-1);display:flex;align-items:center;font-weight:bold;position:relative}header h1{font-size:18px;margin:0;margin-right:auto}header button{background:rgba(0,0,0,0);border:none;cursor:pointer;padding:16px}footer{align-items:center;background:var(--surface);box-shadow:var(--elevation-1);display:flex;justify-content:center;padding:8px}footer span{font-weight:bold}nav{color:var(--nav-text);background-color:var(--nav-bg);display:flex;flex-flow:column;justify-content:space-between;max-width:300px;width:100%;overflow:auto}nav.drawer{overflow:auto;position:absolute;height:100%;left:0}nav ul{background:var(--nav-bg);display:flex;flex-flow:column;margin:0;padding:0}nav ul li:hover{background:var(--nav-bg-hover)}nav ul li button{border:none;outline:none;cursor:pointer;padding:16px;transition:background var(--transition-ui);color:var(--nav-text);background:rgba(0,0,0,0);text-align:left;font-size:16px;display:flex;flex-flow:row;align-items:center;justify-content:flex-start;white-space:nowrap;width:100%}nav ul li button.selected{background:var(--nav-active)}nav ul li button img{margin:0px 16px 0px 0px}nav ul li button svg{margin:0px 16px 0px 0px}nav ul li.title{background:var(--nav-bg-title)}nav ul li.title h1{color:var(--text-inverse);font-size:20px;margin:0}nav ul li.divider-top{border-top:solid}button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;background:rgba(0,0,0,0);font-weight:bold;transition:all var(--transition-ui);text-align:center}button:disabled{opacity:.6;cursor:not-allowed}button.primary,button.danger,button.ghost{border:solid 1px rgba(0,0,0,0);border-radius:var(--radius);font-size:16px;font-weight:bold;padding:14px;width:100%;max-width:200px;text-transform:uppercase}button.primary>img,button.primary>svg,button.danger>img,button.danger>svg,button.ghost>img,button.ghost>svg{margin-right:8px}button.primary{background:var(--btn-primary-bg);border-color:var(--btn-primary-border);color:var(--btn-primary-text)}button.primary:hover{background:var(--btn-primary-hover)}button.danger{background:var(--btn-danger-bg);border-color:var(--btn-danger-border);color:var(--btn-danger-text)}button.danger:hover{background:var(--btn-danger-hover)}button.ghost{background:var(--btn-ghost-bg);border-color:var(--btn-ghost-border);color:var(--btn-ghost-text)}button.ghost:hover{background:var(--btn-ghost-hover)}.loader{display:block;position:relative;height:24px;width:100%;background:var(--surface);border:none;border-radius:var(--radius);overflow:hidden;align-self:center;margin:auto}.loader::after{content:"";width:40%;height:100%;background:var(--ring);position:absolute;top:0;left:0;animation:loader 2s linear infinite}@keyframes loader{0%{left:0;transform:translateX(-100%)}100%{left:100%;transform:translateX(0%)}}form{background:var(--surface);border-radius:var(--radius);display:flex;flex-flow:column;padding:16px;width:100%}form.basic{padding:0;gap:8px}form.basic label{font-weight:bold}form.basic button{margin-top:16px}form.index{margin:0 auto;max-width:1920px}form.index.mw480{max-width:480px}form.modal{border-radius:0;position:absolute;max-width:720px;max-height:100%;overflow:auto;width:100%;height:100%}form.modal.mw480{max-width:480px}form.modal.mw1080{max-width:1080px}form.modal table{margin-top:0;margin-bottom:16px}input,select,textarea{background:var(--field-bg);border:none;border-radius:var(--radius);box-sizing:border-box;font-size:16px;padding:16px;width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--ring)}.field{display:flex;flex-flow:column}.field label{color:var(--text-muted);font-weight:600;margin-bottom:8px}input{cursor:pointer}input[type=file]{font-size:14px}input[type=button]{background:var(--control);border:none;border-radius:var(--radius);color:var(--icon-inverse);font-size:16px;font-weight:bold;padding:16px;min-width:150px;text-transform:uppercase}input.focus-green:focus{border:solid 1px var(--success);outline:solid 2px var(--success)}select{appearance:base-select;min-width:max-content}select[size]{height:256px;padding:0}select::picker-icon{content:none}select::picker(select){appearance:base-select;background:var(--surface);border:none;border-radius:var(--radius);box-shadow:0 4px 12px color-mix(in srgb, var(--text) 20%, transparent);padding:4px}select option{appearance:base-select;font-size:16px;padding:16px}select option:checked{background:var(--control);color:var(--text-inverse)}textarea{cursor:pointer;height:auto;font-family:system-ui;resize:vertical}table{width:100%;background:var(--surface);border-collapse:separate;border-spacing:0;text-align:left;white-space:nowrap}table caption{position:relative;padding:16px;background:var(--accent-muted);border-radius:var(--radius);color:var(--text);font-weight:bold;overflow:hidden;text-align:start}table caption:has(>button){min-height:54px;padding-right:64px}table caption:has(>button)>button{position:absolute;inset:0 0 0 auto;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,0);border:none;color:var(--icon);cursor:pointer}table caption:has(>button)>button:hover{background:color-mix(in srgb, var(--icon) 10%, transparent)}table tr{cursor:pointer}table th,table td{position:relative;max-width:125px;padding:16px;overflow:hidden;text-overflow:ellipsis}table th.button,table td.button{width:0}table th button,table td button{padding:12px;justify-content:center;border:none;border-radius:var(--radius);color:var(--icon);cursor:pointer}table th button img,table th button svg,table td button img,table td button svg{margin-right:8px}table thead :is(th,td){border-bottom:1px solid var(--border)}table tfoot :is(th,td){border-top:1px solid var(--border)}table:has(label) :is(th,td):first-child{width:25%}table:has(label) label{position:absolute;color:var(--text-subtle);font-weight:bold}table:has(label) :is(input,select,textarea,code){display:block;margin-top:32px}table:has(thead){margin:auto;border-radius:var(--radius)}table:has(thead) td:first-child{border-radius:var(--radius) 0 0 var(--radius)}table:has(thead) td:last-child{border-radius:0 var(--radius) var(--radius) 0}table:has(thead) tbody tr:hover td{background:var(--accent-subtle)}.card{background:var(--surface);border:solid 1px var(--border);border-radius:var(--radius);overflow:hidden}.badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:bold;text-transform:uppercase;white-space:nowrap}.badge.pending{background:var(--accent-muted);color:var(--text-subtle)}.badge.processing{background:var(--accent);color:var(--text-inverse)}.badge.delivered{background:var(--success-surface);color:var(--success)}.badge.failed{background:var(--error-surface);color:var(--error)}.badge.unknown{background:var(--surface-3);color:var(--text)}.switch{display:inline-block;position:relative;width:44px;height:24px}.switch input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0}.switch .slider{position:absolute;inset:0;background:var(--control-muted);border-radius:24px;cursor:pointer;transition:background var(--transition-ui)}.switch .slider::before{content:"";position:absolute;left:3px;bottom:3px;width:18px;height:18px;border-radius:50%;background:var(--text-inverse);transition:transform var(--transition-ui)}.switch input:focus+.slider{outline:2px solid var(--ring)}.switch input:checked+.slider{background:var(--ring)}.switch input:checked+.slider::before{transform:translateX(20px)}.muted{color:var(--text-muted)}.alert{border-radius:var(--radius);padding:16px;line-height:1.75;white-space:normal}.alert.error{background:var(--error-surface);color:var(--text)}.alert.warning{background:var(--warning-surface);color:var(--text)}.alert.success{background:var(--success-surface);color:var(--text)}.icon-button{display:inline-flex;align-items:center;justify-content:center;border:none;background:rgba(0,0,0,0);color:var(--icon);cursor:pointer;padding:16px;transition:background var(--transition-ui)}.icon-button:hover{background:color-mix(in srgb, var(--icon) 5%, transparent)}.editor{border-radius:var(--radius);margin-top:32px;overflow:hidden;height:640px}.editor.screen{height:80vh}.chart{height:260px}.summary-table{width:100%;color:var(--text);border-top:1px solid var(--border)}.summary-table td{padding:16px}.summary-table .label{color:var(--text-muted)}.summary-table .value{text-align:right;font-weight:600}.bg-error{background:var(--error-surface)}.bg-success{background:var(--success-surface)}.bg-warning{background:var(--warning-surface)}.bg-base{background:var(--surface)}.text-error{color:var(--error)}.text-success{color:var(--success)}.text-muted{color:var(--text-muted)}.border-b{border-bottom:solid 1px var(--border)}.br4{border-radius:4px}.br8{border-radius:var(--radius)}.h100{height:100%}.m4{margin:4px}.m8{margin:8px}.m16{margin:16px}.mb8{margin-bottom:8px}.mr8{margin-right:8px}.mr16{margin-right:16px}.mt0{margin-top:0}.mt16{margin-top:16px}.mw32{max-width:32px}.mw128{max-width:128px}.mw480{max-width:480px}.mw640{max-width:640px}.mw50pc{max-width:50%}.mw-none{max-width:none}.p0{padding:0}.p8{padding:8px}.p16{padding:16px}.p18{padding:18px}.p32{padding:32px}.pb0{padding-bottom:0}.pl16{padding-left:16px}.text-center{text-align:center}.text-end{text-align:end}.w0{width:0}.w1{width:1%}.w50{width:50%}.w100{width:100%}.wa{width:auto}.font-title{font-size:2em;font-weight:900}.font-subtitle{font-size:1.5em;font-weight:300}.fw600{font-weight:600}.active{background:var(--accent-subtle)}.disabled{opacity:.5;text-decoration:line-through}.pending{opacity:.72;pointer-events:none}.effect1-enter{opacity:1;transform:scale(1) translate(0%, 100%)}.effect1-enter-active{opacity:1;transform:scale(1) translate(0%, 0%);transition:opacity var(--transition-anim),transform var(--transition-anim)}.effect1-exit{opacity:1;transform:scale(1)}.effect1-exit-active{opacity:0;transform:scale(0);transition:opacity var(--transition-anim),transform var(--transition-anim)}.effect12-enter{transform:translate(100%, 0%)}.effect12-enter-active{transform:translate(0%, 0%);transition:transform var(--transition-anim)}.effect12-exit{transform:translate(0%, 0%)}.effect12-exit-active{transform:translate(-100%, 0%);transition:transform var(--transition-anim)}.effect2-enter{transform:translate(0vw, 100vh)}.effect2-enter-active{transform:translate(0vw, 0vh);transition:transform var(--transition-anim)}.effect2-exit{transform:translate(0vw, 0vh)}.effect2-exit-active{transform:translate(0vw, 100vh);transition:transform var(--transition-anim)}.fade-enter{opacity:0}.fade-enter-active{opacity:1;transition:opacity var(--transition-anim)}.fade-exit{opacity:1}.fade-exit-active{opacity:0;transition:opacity var(--transition-anim);pointer-events:none}.drawer1-enter{transform:translate(-100%, 0%)}.drawer1-enter-active{transform:translate(0%, 0%);transition:transform var(--transition-anim)}.drawer1-exit{transform:translate(0%, 0%)}.drawer1-exit-active{transform:translate(-100%, 0%);transition:transform var(--transition-anim)}.drawer2-enter{transform:translate(100%, 0%)}.drawer2-enter-active{transform:translate(0%, 0%);transition:transform var(--transition-anim)}.drawer2-exit{transform:translate(0%, 0%)}.drawer2-exit-active{transform:translate(100%, 0%);transition:transform var(--transition-anim)}/*# sourceMappingURL=styles.css.map */