:root{--rpx:calc(min(100vw,600px)/750);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#29231f;background:#eee8e2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0;line-height:1.5}button:disabled{cursor:not-allowed;opacity:.55}input,textarea{min-width:0;max-width:100%}input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid #e45b00;outline-offset:3px}button{color:inherit}textarea{resize:vertical}img{max-width:100%}a{color:#ff6a00}.web-shell{max-width:600px;margin:auto;background:#f6f4f1;min-height:100dvh;box-shadow:0 0 60px #153b3814;padding-bottom:90px}.web-page{overflow-x:clip;min-height:calc(100dvh - 130px)}.web-page .page{min-height:0;max-width:100%}.web-page span{white-space:pre-wrap}:where(.web-page) button{display:block;background:#f2f2f2;padding:0;border:0}.web-page .btn{display:flex;align-items:center;justify-content:center}.web-page canvas{touch-action:none;display:block}.web-page input:not([type=checkbox]),.web-page textarea{appearance:none;line-height:1.5}.web-page input[type=checkbox]{accent-color:#ff6a00;width:23px;height:23px;flex:none;cursor:pointer}.web-switch{appearance:none!important;width:43px!important;height:26px!important;border-radius:20px;background:#bac8c2;position:relative;transition:background .15s}.web-switch:checked{background:#ff6a00}.web-switch:before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;background:white;left:3px;top:3px;transition:transform .15s}.web-switch:checked:before{transform:translateX(17px)}.web-page [data-scroll]{overflow-x:auto;overscroll-behavior-x:contain}.web-picker{position:relative;min-width:0}.web-picker-control{position:absolute;inset:0;width:100%;height:100%;opacity:.01;cursor:pointer;font-size:16px}.web-picker:focus-within{outline:3px solid #e45b00;outline-offset:2px;border-radius:8px}.web-topbar{display:flex;align-items:center;justify-content:space-between;gap:6px;position:sticky;top:0;z-index:30;background:#f6f4f1f5;backdrop-filter:blur(12px);border-bottom:1px solid #eadfd5;padding:5px 10px;padding-top:calc(5px + env(safe-area-inset-top));min-height:62px}.web-topbar>div{text-align:center;min-width:0;flex:1}.web-topbar strong{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.web-topbar small{display:block;color:#7d746d;font-size:11px;margin-top:2px}.web-topbar .web-button{font-size:13px;min-width:52px;padding:9px 5px;width:auto;margin:0}.web-bottom{position:fixed;z-index:30;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,600px);display:flex;gap:8px;padding:9px 15px calc(9px + env(safe-area-inset-bottom));border-top:1px solid #eadfd5;background:#fff}.web-bottom .web-button{flex:1;font-size:13px;margin:0;min-height:44px;padding:8px 4px}.web-button{display:block;width:100%;border-radius:10px;min-height:46px;padding:12px 16px;font-weight:600;font-size:15px;text-align:center;border:1px solid transparent;margin-top:12px}.web-button.primary{color:#fff;background:#ff6a00}.web-button.secondary{background:#fff0e4;color:#ff6a00}.web-button.quiet{background:transparent;color:#75685e}.web-actions-row{display:flex;gap:10px;align-items:center}.web-actions-row>.web-button{flex:1}.web-entry{padding:40px 28px 20px}.web-wordmark{display:flex;align-items:center;gap:10px;font-weight:700;font-size:23px;letter-spacing:2px;margin-bottom:42px}.web-eyebrow{font-size:12px;font-weight:650;letter-spacing:2px;color:#a64b12;margin:20px 0 14px}.web-entry h1{font-size:clamp(29px,7.5vw,40px);line-height:1.4;letter-spacing:-1px;font-weight:700;margin:12px 0 16px}.web-lead{font-size:14px;line-height:1.85;color:#7d746d;margin:0 0 24px}.web-entry-card,.web-panel{padding:24px;background:white;border:1px solid #eadfd5;border-radius:18px;margin:24px 0}.web-entry h2,.web-manage h2,.web-dialog h2{font-size:18px;margin:0 0 18px;line-height:1.5}.web-field{display:block;margin:18px 0}.web-field>span{display:block;font-size:13px;color:#75685e;margin-bottom:8px}.web-field input,.web-field textarea,.web-field select,.web-dialog input{display:block;width:100%;padding:13px 12px;border:1px solid #d8c6b6;border-radius:9px;min-height:46px;background:#faf7f3;color:#29231f;font-size:16px}.web-field textarea{font-size:13px;word-break:break-all}.web-small{font-size:12px;color:#7d746d;line-height:1.8;overflow-wrap:anywhere}.web-error{color:#b3342b;font-size:14px;line-height:1.7}.web-entry-notes{display:flex;justify-content:space-between;gap:8px;margin:28px 0 22px;font-size:12px;color:#ff6a00}.web-entry-notes span:before{content:'✓ ';font-weight:700}.web-manage{padding:20px 24px}.web-manage h1{font-size:28px}.web-group h3{margin:0}.web-invite-qr{display:block;width:240px;max-width:100%;margin:0 auto}.web-floating{max-width:300px;margin:0 auto;background:#fff0e4;color:#ff6a00}.web-overlay{position:fixed;inset:0;z-index:100;background:#102d296b;display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(2px)}.web-dialog{background:white;border-radius:18px;max-width:440px;width:100%;padding:24px;max-height:85dvh;overflow:auto;box-shadow:0 16px 80px #0002}.web-dialog p{font-size:14px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere;color:#75685e}.web-dialog>.web-button{margin-top:10px}.web-toast{position:fixed;z-index:150;left:50%;bottom:110px;transform:translateX(-50%);max-width:calc(100vw - 48px);width:max-content;white-space:pre-wrap;background:#173c36;color:#fff;padding:13px 18px;border-radius:12px;font-size:14px;box-shadow:0 8px 32px #173c3633;pointer-events:none}.web-loading{position:fixed;z-index:90;top:50%;left:50%;transform:translate(-50%,-50%);background:#173c36ed;color:white;padding:20px;border-radius:12px}.web-image-view{position:fixed;inset:0;background:#102320f5;z-index:110;padding:20px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px}.web-image-view>img{max-height:72dvh;object-fit:contain}.web-image-view .web-button{width:auto;margin:0}.web-image-view .web-actions-row{overflow:auto;max-width:100%}.boot{padding:100px 24px;text-align:center;color:#7d746d}[data-host=false] .demo-reset-zone,[data-host=false] .demo-page .error-state button:last-child:not(:first-child){display:none}.web-page .save-progress{left:max(14px,calc((100vw - 572px)/2));right:max(14px,calc((100vw - 572px)/2));bottom:90px}.web-page .sticky-actions{bottom:78px}.web-page button.role-tab{background:transparent}.web-page button.role-tab.active{background:var(--brand);color:white}@media(min-width:800px){.web-shell{margin-top:24px;margin-bottom:24px;border-radius:22px;overflow:clip;min-height:calc(100dvh - 48px)}.web-entry{padding:45px}.web-topbar{top:0}}@media(max-width:350px){.web-entry{padding:26px 18px}.web-entry-card,.web-panel{padding:18px}.web-entry-notes{font-size:11px}.web-manage{padding:18px}.web-overlay{padding:16px}}

.web-bottom{display:block}.web-nav-actions,.web-customer-tabs{display:flex;gap:8px}.web-customer-tabs{padding-bottom:8px;margin-bottom:7px;border-bottom:1px solid #e4ece8}.has-customer-tabs{padding-bottom:145px}.has-customer-tabs .sticky-actions{bottom:136px}

/* Match the original orange navigation and customer tab bar. Demo controls remain separate. */
.web-shell:has(.web-page:not([data-page="pages/demo/index"])) .web-topbar{background:#ff6a00;color:white;border-bottom-color:#ff6a00}
.web-shell:has(.web-page:not([data-page="pages/demo/index"])) .web-topbar small,.web-shell:has(.web-page:not([data-page="pages/demo/index"])) .web-topbar .web-button{color:white}
.web-customer-tabs .web-button{background:transparent;color:#7b827d;font-weight:400}
.web-customer-tabs .web-button.secondary{color:#ff6a00}
.web-page .hero-title{line-height:1.4}

.web-entry{padding-top:56px}.web-entry .web-wordmark{justify-content:center;margin-bottom:32px}.web-entry-card h1{font-size:24px;line-height:1.4;letter-spacing:0;margin:0 0 24px}.web-entry .web-entry-card{margin-top:0}.demo-feature-list{margin-top:16px}