*{box-sizing:border-box}.wx-demo-editor{margin:0;background:#eef1f5;color:#203047;font:14px/1.55 Inter,Arial,sans-serif}.wx-demo-editor button,.wx-demo-editor input,.wx-demo-editor textarea,.wx-demo-editor select{font:inherit}.wx-demo-editor button,.wx-demo-editor a{-webkit-tap-highlight-color:transparent}.wx-demo-editor button{cursor:pointer}.wx-demo-top{height:76px;background:#fff;display:flex;align-items:center;gap:30px;padding:10px 28px;border-bottom:1px solid #e3e8ef}.wx-demo-wordmark{font-weight:900;font-size:31px;letter-spacing:-1.5px;color:#142943;text-decoration:none}.wx-demo-wordmark span{color:#3aaa89;margin-left:3px}.wx-demo-top>div{display:flex;flex-direction:column;min-width:0}.wx-demo-top strong{font-size:14px}.wx-demo-top small{color:#738195;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wx-demo-create{margin-left:auto;background:#14372f;color:#fff;text-decoration:none;padding:12px 20px;border-radius:10px;font-size:12px;font-weight:700;white-space:nowrap}.wx-demo-notice{display:flex;gap:11px;align-items:center;background:#e6f4ed;padding:11px 28px;color:#225344;border-bottom:1px solid #d4e9df;font-size:12px}.wx-demo-dot{width:8px;height:8px;background:#239868;border-radius:50%;flex-shrink:0}.wx-demo-notice p{margin:0;flex:1}.wx-demo-notice button{border:1px solid #bdd9cb;background:#fff9;color:inherit;padding:6px 11px;border-radius:7px;white-space:nowrap}.wx-demo-notice a{font-weight:650;color:inherit;white-space:nowrap}.wx-demo-workspace{display:grid;grid-template-columns:340px minmax(0,1fr);height:calc(100dvh - 126px);min-height:450px}.wx-demo-controls{overflow:auto;padding:22px;background:#fff;border-right:1px solid #dce3eb;scrollbar-width:thin}.wx-demo-modes{display:grid;grid-template-columns:1fr 1fr;gap:6px}.wx-demo-modes button{background:#f3f6f9;border:1px solid #e2e7ee;border-radius:9px;padding:10px 4px;font-size:12px;font-weight:650;color:#526478;min-height:42px}.wx-demo-modes button[aria-pressed=true]{background:#203b50;border-color:#203b50;color:#fff}.wx-demo-guide{padding:23px 0 12px}.wx-demo-kicker{font-size:9px;letter-spacing:1.6px;font-weight:750;color:#38846d}.wx-demo-guide h1{font-size:25px;line-height:1.2;letter-spacing:-.6px;margin:9px 0 11px}.wx-demo-guide p,.wx-demo-hint{font-size:11px;color:#738195;line-height:1.65}.wx-demo-panel{padding:20px 0;border-top:1px solid #e6eaf0}.wx-demo-panel h2{font-size:13px;letter-spacing:-.15px;margin:0 0 15px}.wx-demo-panel h3{font-size:12px;margin:18px 0 12px}.wx-demo-panel label{display:grid;gap:7px;font-size:11px;font-weight:600;color:#56677b;margin-bottom:14px}.wx-demo-panel input:not([type=checkbox]):not([type=range]):not([type=color]),.wx-demo-panel textarea,.wx-demo-panel select{width:100%;border:1px solid #d9e0e9;border-radius:8px;background:#f8fafc;padding:9px 10px;color:#24384e;font-size:12px;min-height:40px}.wx-demo-panel textarea{resize:vertical}.wx-demo-panel input:disabled,.wx-demo-panel textarea:disabled,.wx-demo-panel select:disabled{opacity:.45}.wx-demo-panel input[type=color]{width:100%;height:37px;padding:3px;border:1px solid #d9e0e9;background:white;border-radius:8px;cursor:pointer}.wx-demo-panel input[type=range]{width:100%;accent-color:#328367;min-height:32px}.wx-demo-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.wx-demo-panel .wx-demo-check{display:flex;align-items:center;gap:8px;font-weight:500}.wx-demo-check input{width:17px;height:17px;accent-color:#328367}.wx-demo-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;max-height:230px;overflow:auto}.wx-demo-gallery button{display:block;aspect-ratio:1;border:1px solid #dfe5ec;padding:3px;background:#f7f8fa;border-radius:8px;overflow:hidden}.wx-demo-gallery img{width:100%;height:100%;object-fit:cover;border-radius:5px}.wx-demo-gallery button:hover{border-color:#328367}.wx-demo-preview{min-width:0;display:flex;flex-direction:column;overflow:hidden}.wx-demo-preview-bar{height:62px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 24px;border-bottom:1px solid #dce3eb;background:#f8fafc}.wx-demo-preview-bar>span{font-size:11px;color:#6d7e90}.wx-demo-preview-bar>div{display:flex;gap:5px;flex-shrink:0}.wx-demo-preview-bar button{border:1px solid #dae1e9;background:#fff;color:#526478;padding:7px 11px;border-radius:7px;font-size:11px}.wx-demo-preview-bar button[aria-pressed=true]{background:#203b50;border-color:#203b50;color:#fff}.wx-demo-preview-bar [data-demo-view-controls]{display:none}.wx-demo-preview-stage{flex:1;min-height:0;overflow:auto;padding:22px;display:flex;justify-content:center;align-items:flex-start}.wx-demo-preview-stage iframe{display:block;border:0;background:white;width:100%;height:100%;min-height:400px;border-radius:12px;box-shadow:0 12px 45px #12283b16;transition:width .2s;flex-shrink:0}.wx-demo-preview-stage.is-mobile iframe{width:390px;max-width:100%}.wx-demo-rich-toolbar{display:flex;gap:4px;flex-wrap:wrap;padding:7px;border:1px solid #dae1e9;border-bottom:0;border-radius:8px 8px 0 0;background:#f5f8fb}.wx-demo-rich-toolbar button{border:0;border-radius:4px;background:white;width:29px;height:29px;color:#23394e}.wx-demo-rich{border:1px solid #dae1e9;border-radius:0 0 8px 8px;padding:12px;min-height:190px;font-size:13px;outline-offset:3px}.wx-demo-rich p{margin:0 0 10px}.wx-demo-end-note{font-size:10px;color:#7c899a;margin:10px 0 20px}.wx-demo-editor [hidden]{display:none!important}.wx-demo-editor :focus-visible{outline:3px solid #56ad92;outline-offset:3px}
.wx-demo-launch{position:fixed;z-index:700;right:22px;bottom:22px;display:flex;gap:9px;align-items:center;background:#142e28!important;color:white!important;padding:13px 18px;border:1px solid #ffffff50;border-radius:40px;font:650 12px/1.3 Inter,Arial,sans-serif;text-decoration:none!important;box-shadow:0 6px 25px #0d221b35}.wx-demo-launch svg{width:18px;height:18px}.wx-demo-launch:hover{transform:translateY(-2px)}
@media(max-width:1000px){.wx-demo-workspace{grid-template-columns:300px minmax(0,1fr)}.wx-demo-controls{padding:17px}.wx-demo-preview-bar{padding:10px 14px}.wx-demo-preview-bar>span{max-width:140px}.wx-demo-preview-stage{padding:12px}}@media(max-width:760px){.wx-demo-top{height:67px;padding:10px 14px;gap:16px}.wx-demo-top strong{font-size:12px}.wx-demo-top small{max-width:130px;font-size:9px}.wx-demo-wordmark{font-size:25px}.wx-demo-create{font-size:10px;padding:10px}.wx-demo-notice{padding:9px 14px;gap:8px;font-size:10px}.wx-demo-notice a{display:none}.wx-demo-notice button{font-size:9px;padding:5px 7px}.wx-demo-workspace{display:block;height:calc(100dvh - 120px);min-height:500px;position:relative;overflow:hidden}.wx-demo-controls{width:min(330px,100%);height:100%;position:absolute;inset:0 auto 0 0;z-index:3;box-shadow:15px 0 35px #10233820;padding-bottom:80px}.wx-demo-preview{height:100%;width:100%}.wx-demo-preview-bar{justify-content:flex-end;height:55px;position:relative;z-index:4}.wx-demo-preview-bar>span{display:none}.wx-demo-preview-bar [data-demo-view-controls]{display:block;background:#e5f2ec;color:#285b49}.wx-demo-preview-stage{padding:8px}.wx-demo-mobile-preview .wx-demo-controls{display:none}.wx-demo-controls .wx-demo-guide{padding-top:18px}.wx-demo-launch{right:12px;bottom:14px;font-size:11px;padding:11px 14px}.wx-demo-top>div{flex:1}.wx-demo-notice p{line-height:1.5}}@media(prefers-reduced-motion:reduce){.wx-demo-preview-stage iframe,.wx-demo-launch{transition:none}}
@media(max-width:760px){.wx-demo-controls{top:55px;height:calc(100% - 55px)}}

/* The same canvas on every device, with separate full-width mobile panes. */
.wx-demo-editor{height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.wx-demo-top,.wx-demo-notice{flex-shrink:0}
.wx-demo-workspace{flex:1;min-height:0;height:auto;grid-template-rows:auto minmax(0,1fr);overflow:hidden}
.wx-demo-controls{grid-column:1;grid-row:1 / 3;min-height:0}
.wx-demo-preview-bar{grid-column:2;grid-row:1;height:auto;min-height:62px}
.wx-demo-preview{grid-column:2;grid-row:2;min-height:0}
.wx-demo-preview-stage{position:relative;overflow:hidden;display:block}
.wx-demo-preview-stage iframe{position:absolute;min-height:0;margin:0;max-width:none;transform-origin:0 0;transition:none}
.wx-demo-preview-bar .wx-demo-view-switch{display:none}
.wx-demo-devices button{min-height:40px}
@media(max-width:760px){
 .wx-demo-top{height:64px;gap:12px;padding:8px 12px}.wx-demo-top>div{flex:1}.wx-demo-top small{max-width:120px}.wx-demo-create{padding:10px 8px;font-size:10px}
 .wx-demo-notice{padding:8px 12px}.wx-demo-notice p{font-size:10px}.wx-demo-notice button{min-height:36px}
 .wx-demo-workspace{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);min-height:0;height:auto}
 .wx-demo-preview-bar{grid-column:1;grid-row:1;position:static;z-index:auto;min-height:64px;gap:8px;padding:8px 12px;justify-content:space-between;flex-wrap:wrap}
 .wx-demo-preview-bar>span{display:none}.wx-demo-preview-bar .wx-demo-view-switch{display:flex;gap:0;border:1px solid #d4e0da;border-radius:10px;padding:3px;background:#e8f0ec}
 .wx-demo-view-switch button{border:0;background:transparent;min-height:38px;padding:7px 10px;font-size:11px;border-radius:7px}
 .wx-demo-view-switch button[aria-pressed=true]{background:white;color:#173f31;box-shadow:0 2px 5px #1a40251a}
 .wx-demo-devices{gap:4px!important}.wx-demo-devices button{padding:7px 8px;font-size:10px}
 .wx-demo-controls{position:static;inset:auto;width:100%;height:auto;min-height:0;grid-column:1;grid-row:2;z-index:auto;box-shadow:none;border:0;padding:18px 18px 40px;overscroll-behavior:contain}
 .wx-demo-preview{grid-column:1;grid-row:2;height:auto;width:100%;min-height:0}
 .wx-demo-editor[data-demo-view=preview] .wx-demo-controls{display:none}
 .wx-demo-editor[data-demo-view=edit] .wx-demo-preview{display:none}
 .wx-demo-preview-stage{padding:8px}.wx-demo-preview-stage iframe{border-radius:8px}
 .wx-demo-panel input:not([type=range]):not([type=color]),.wx-demo-panel textarea,.wx-demo-panel select,.wx-demo-rich{font-size:16px}
 .wx-demo-modes button{min-height:44px}.wx-demo-guide p,.wx-demo-hint{font-size:12px}
}
@media(max-width:350px){.wx-demo-preview-bar{padding:7px 8px;gap:5px}.wx-demo-view-switch button{padding:7px 8px;font-size:10px}.wx-demo-devices button{padding:7px 6px}.wx-demo-top small{max-width:90px}.wx-demo-wordmark{font-size:23px}.wx-demo-top{gap:8px}.wx-demo-create{font-size:9px}}
