.app-tutorial{padding:35px;background:#f6faf8;border:1px solid var(--line);border-radius:20px}.app-tutorial-heading{display:flex;justify-content:space-between;align-items:center;gap:28px;margin-bottom:32px}.app-tutorial-heading h2{margin:12px 0 16px}.app-tutorial-heading p{font-size:14px;margin:0}.sum-badge{display:flex;gap:12px;align-items:center;background:white;border-radius:14px;padding:18px;font-size:12px;white-space:nowrap}.sum-badge b{font-size:28px;color:var(--teal)}.sum-badge i{font-style:normal;color:#92aaa4}.sum-badge strong{color:var(--pink);font-size:23px}.sunday-demo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:65px;max-width:870px;margin:auto}.app-figure{margin:0;min-width:0}.app-figure figcaption{font-size:11px;color:var(--muted);line-height:1.8;margin:16px auto 0;max-width:350px}.app-screen{max-width:350px;width:100%;margin:auto;border:6px solid #173b3d;border-radius:30px;overflow:hidden;background:#f3f3f3;box-shadow:0 12px 28px #123a3c12;color:#111;font-family:Arial,'Microsoft JhengHei',sans-serif;line-height:1.5}.app-status{height:29px;background:#050505;color:white;display:flex;align-items:center;justify-content:space-between;font-size:10px;padding:4px 19px}.app-topbar{background:#050505;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:12px 16px 17px;font-size:12px}.app-topbar b{font-size:20px;font-weight:500}.app-topbar>span:first-child{font-size:33px;line-height:.7}.app-topbar>span{min-width:28px}.app-body{padding:18px 13px 14px}.delivery-preview{display:flex;align-items:center;gap:12px;background:#fff;border-radius:17px;padding:15px;margin-bottom:27px;box-shadow:0 6px 16px #123a3c0c;font-size:14px}.delivery-preview>span{font-size:28px;color:var(--teal)}.delivery-preview small{display:block;font-size:10px;color:#379b9d;margin-top:4px}.app-points-row{display:flex;gap:7px;align-items:center;position:relative;padding:14px 9px;border:2px solid #b8d6cc;border-radius:12px;margin:17px 0 23px;background:white;font-size:13px}.point-mark{display:inline-grid;place-items:center;flex-shrink:0;width:21px;height:21px;border-radius:50%;background:#f9c44c;border:2px solid #ffe39a;box-shadow:1px 1px 0 #d89b23;color:white;font-size:15px;font-weight:bold}.app-points-row>div{flex:1}.app-points-row small{display:block;font-size:10px;color:#657573;font-weight:400}.app-points-row strong{white-space:nowrap;font-size:18px}.app-points-row strong small{display:inline;font-size:11px;color:#111}.app-callout{position:absolute;right:8px;top:-13px;padding:1px 8px;color:#fff;background:var(--teal);font-size:10px;border-radius:20px}.app-points-row.bonus{border-color:#ec82af;background:#fff5f9}.bonus .app-callout{background:var(--pink)}.app-subtotal{display:flex;justify-content:space-between;padding:17px 1px;border-top:1px solid #d9dfdd;font-size:13px}.points-total{padding:16px;background:#e3f3ef;border-radius:12px;text-align:center;color:var(--teal);margin:6px 0 12px}.points-total>span{font-size:11px;display:block}.points-total>strong{font-size:35px;display:block;line-height:1.4}.points-total strong small{font-size:14px}.points-total>small{font-size:10px}.app-checkout{display:flex;align-items:stretch;background:white;font-size:10px}.app-checkout>span:first-child{flex:1;padding:15px 9px}.app-checkout b{display:block;font-size:15px}.app-checkout>span:last-child{width:42%;display:grid;place-items:center;background:#00ccce;color:#063337;border-top-left-radius:22px;font-size:17px}.app-explainer h3{font-size:27px;margin:14px 0 28px}.point-breakdown>div{display:flex;gap:15px;align-items:start;margin-bottom:21px}.breakdown-number{font-size:24px;color:var(--teal);line-height:1.4}.point-breakdown b{font-size:15px}.point-breakdown p{font-size:13px;margin-top:5px}.point-breakdown p strong{color:var(--teal)}.point-breakdown .breakdown-total{border-top:1px solid #c7dcd4;padding-top:18px;justify-content:space-between;align-items:center}.breakdown-total>strong{font-size:25px;color:var(--pink)}.thursday-tutorial{background:#fff9fb;border-color:#f0dfe6}.app-demo-label{font-size:11px;border:1px solid #e2c4d1;border-radius:25px;padding:7px 14px;color:#8c526a;white-space:nowrap}.thursday-demo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:55px;max-width:810px;margin:auto}.step-title{display:flex;gap:15px;margin-bottom:24px;align-items:start;min-height:78px}.step-title>span{font-size:29px;color:var(--pink);line-height:1.4}.step-title h3{font-size:18px;margin:0 0 6px}.step-title p{font-size:12px;margin:0}.entry-screen,.redeem-screen{min-height:650px}.checkout-card{background:#fff;box-shadow:0 5px 12px #0000000c;border-radius:17px;padding:17px 13px;margin-bottom:17px}.mock-card-line{display:flex;align-items:center;gap:10px;font-size:13px}.mock-card-line>b{flex:1;font-weight:500}.mock-card-line>span:last-child:not(.mock-icon){font-size:23px}.mock-icon{font-size:23px;color:#007e85}.mock-muted{display:block;color:#8b9290;font-size:11px;margin-top:13px}.mock-placeholder{color:#c4c6c6;font-size:12px;margin-top:12px;border-bottom:1px solid #ccc;padding-bottom:6px}.mock-balance-input{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #222;padding-bottom:7px;margin-top:35px;font-size:12px}.mock-balance-input span{background:black;color:white;font-size:11px;border-radius:6px;padding:5px 8px}.points-entry{border:2px solid var(--pink);position:relative;background:#fff9fc;margin-top:27px}.entry-hint{position:absolute;right:12px;top:-14px;background:var(--pink);color:#fff;border-radius:20px;padding:3px 9px;font-size:10px}.points-entry .mock-card-line{padding:9px 0}.muted-card{opacity:.55}.sheet-backdrop{height:57px;background:#aaa;padding:15px;color:#666;font-size:11px}.sheet-backdrop>div{background:#ccc;border-radius:12px;padding:9px}.points-sheet{background:white;position:relative;border-radius:19px 19px 0 0;margin-top:-10px;padding:15px 12px 0}.sheet-heading{text-align:center;font-weight:bold;font-size:19px;position:relative;margin-bottom:17px}.sheet-heading>span{position:absolute;right:3px;font-size:28px;line-height:1}.available-points{display:flex;gap:7px;background:#e6f9f9;border-radius:12px;padding:10px;align-items:center;text-align:center;font-size:12px}.available-points>div{flex:1}.available-points>span{font-size:25px}.available-points strong{display:block;background:white;border-radius:10px;padding:14px 2px;margin-top:6px;color:#009da8;font-size:21px;white-space:nowrap}.available-points .point-mark{font-size:12px;width:19px;height:19px}.mock-input{display:flex;gap:9px;align-items:center;margin:16px 0 7px;font-size:18px}.mock-input>div{border:1px solid #ccc;border-radius:10px;display:flex;justify-content:space-between;padding:9px 12px;flex:1}.mock-input strong{font-weight:500}.mock-input>div>span{color:#898989}.sheet-help{font-size:10px;line-height:1.6;color:#777;margin:0}.sheet-help b{color:#009da8}.system-tip{margin:19px 0 15px;border:2px solid var(--pink);border-radius:10px;padding:10px;background:#fff8fb}.system-tip>span{display:inline-block;font-size:10px;color:var(--pink);font-weight:bold;margin-bottom:5px}.system-tip p{font-size:12px;color:#5d6462;margin:0}.order-discount{display:flex;align-items:center;justify-content:space-between;padding:14px 0 16px;border-top:1px dashed #d7dedb}.order-discount>span{font-size:12px}.order-discount small{display:block;font-size:9px;color:#7e8a86;margin-top:4px}.order-discount strong{font-size:27px;color:var(--pink)}.sheet-buttons{margin:0 -12px;display:flex;font-size:13px;text-align:center;align-items:center}.sheet-buttons>span{width:50%;padding:18px 0}.sheet-buttons>span:last-child{background:black;color:white;border-top-left-radius:25px}.discount-equation{margin-top:32px;background:white;border:1px solid #eddce3;border-radius:16px;display:flex;align-items:center;justify-content:center;gap:30px;padding:24px}.discount-equation>div{text-align:center}.discount-equation small,.discount-equation span{font-size:11px;color:var(--muted);display:block}.discount-equation strong{font-size:29px;display:block;color:var(--teal)}.discount-equation i{font-style:normal;color:#a2b4ae;font-size:23px}.discount-equation .discount-result strong{color:var(--pink)}
@media(max-width:900px){.app-tutorial{padding:28px}.app-tutorial-heading{display:block}.sum-badge{display:inline-flex;margin-top:23px}.sunday-demo-grid{gap:28px}.app-demo-label{display:inline-block;margin-top:16px}.thursday-demo-grid{gap:25px}.app-explainer h3{font-size:23px}.breakdown-total>strong{font-size:22px}.app-points-row{font-size:11px}.app-points-row strong{font-size:16px}.discount-equation{gap:18px}}
@media(max-width:600px){.app-tutorial{padding:25px 18px;border-radius:18px}.app-tutorial-heading h2{font-size:25px}.app-tutorial-heading p{font-size:13px}.app-tutorial-heading p br{display:none}.sum-badge{gap:9px;padding:12px;font-size:10px}.sum-badge b{font-size:23px}.sum-badge strong{font-size:19px}.sunday-demo-grid{grid-template-columns:1fr;gap:30px}.app-screen{max-width:320px;border-width:5px;border-radius:25px}.app-explainer h3 br{display:none}.app-explainer h3{font-size:23px}.point-breakdown>div{margin-bottom:14px}.app-points-row{font-size:12px}.app-points-row strong{font-size:17px}.app-points-row small{font-size:9px}.app-tutorial .fine{font-size:11px}.thursday-demo-grid{grid-template-columns:1fr;gap:35px}.entry-screen,.redeem-screen{min-height:620px}.step-title{margin-bottom:18px;min-height:0}.step-title h3{font-size:17px}.app-figure figcaption{font-size:10px}.discount-equation{gap:7px;padding:18px 8px;margin-top:25px}.discount-equation small,.discount-equation span{font-size:9px}.discount-equation strong{font-size:23px}.discount-equation i{font-size:17px}.available-points{font-size:11px}.sheet-help{font-size:10px}}