:root{--red:#c92f3d;--ink:#20232a;--muted:#818a9b;--rose:#fcf2f4;--border:#eedfe3;--shadow:0 22px 70px #35162214}*{box-sizing:border-box}body{margin:0;background:#f8f7f8;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #e49424;outline-offset:3px}button{border:0}.toolbar{height:84px;border-bottom:1px solid #e8e5e8;display:flex;align-items:center;justify-content:space-between;padding:0 4%;background:#ffffffeb;gap:20px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-weight:750;font-size:18px}.brand-mark{background:var(--red);color:white;border-radius:11px;padding:8px;font-size:20px}.brand small{display:block;color:#92929b;font-size:8px;letter-spacing:2px;margin-top:4px}nav{display:flex;background:#f1eef0;border-radius:10px;padding:4px;gap:5px}nav button,.phone-tabs button{padding:10px 25px;background:transparent;color:#7c7380;border-radius:7px;font-weight:650}nav button.selected,.phone-tabs button.selected{background:white;color:var(--red);box-shadow:0 2px 10px #34132c10}.tools{display:flex;gap:8px}.tools button{background:white;border:1px solid #e8e2e6;padding:10px 14px;border-radius:8px;color:#635864}.tools button:first-child{color:var(--red);background:#fff8f9;border-color:#efcdd4}main{max-width:1550px;padding:32px 36px 0;margin:auto}.view-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.eyebrow{color:var(--red);font-size:10px;letter-spacing:2px;font-weight:750;margin:0 0 9px}h1{font-size:28px;letter-spacing:.02em;margin:0;font-weight:700}.subtitle{font-size:12px;color:#757681;text-align:right;line-height:1.9}.subtitle span{display:block;color:#a29da6;font-size:11px}.device{position:relative;overflow:hidden;isolation:isolate;box-shadow:var(--shadow);background:#f8f5f6;container-type:inline-size}.device>.reference{position:absolute;max-width:none;height:auto;user-select:none;pointer-events:none;z-index:0}.tablet{width:min(100%,1240px);aspect-ratio:1380/936;border-radius:3.6% / 5.4%;margin:auto}.phone{width:100%;aspect-ratio:394/808;border-radius:15% / 7.4%}.patch{position:absolute;pointer-events:none;z-index:1}.hotspot{position:absolute;z-index:3;background:transparent;border-radius:6px;padding:0;transition:background .15s,box-shadow .15s;color:transparent}.hotspot:hover{background:#d8344810;box-shadow:inset 0 0 0 1.5px #d8344860}.hotspot:focus-visible{outline-offset:1px}.hotspot[aria-checked]{border-radius:4px}.hotspot.is-highlighted{z-index:12;box-shadow:0 0 0 4px #ee4663,0 0 0 9999px #1e102b45;background:#ffecf025}.state-label{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;background:#fcf2f4;color:#a72435;font-size:1.1cqw;font-weight:650;border-radius:8px;pointer-events:none}.phone .state-label{font-size:3.2cqw}.checkbox-state{position:absolute;z-index:2;width:5%;height:2.5%;background:white;border:1.5px solid #ef9ba8;border-radius:5px;pointer-events:none;color:white;display:grid;place-items:center;font-size:3.5cqw}.checkbox-state.checked{background:var(--red);border-color:var(--red)}.phones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1130px;margin:auto;gap:7%}.phone-column h2{font-size:20px;letter-spacing:.03em;font-weight:700;margin:0 0 20px;color:#932033}.phone-column h2 i{font-size:23px;margin-right:10px;font-weight:800}.phone-tabs{display:none}footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 0;color:#99929d;font-size:11px}footer span:first-child{white-space:nowrap;color:#766e7d}footer button{background:transparent;color:#938594;font-size:11px;white-space:nowrap}.live-dot{display:inline-block;width:6px;height:6px;background:#d74d61;border-radius:50%;margin-right:7px}dialog{border:1px solid #eee2e7;border-radius:22px;width:min(540px,calc(100vw - 28px));padding:28px;box-shadow:0 30px 100px #24152b33;max-height:90dvh;color:var(--ink)}dialog::backdrop{background:#20162275;backdrop-filter:blur(4px)}dialog[open]{animation:appear .22s ease}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;padding-bottom:20px}.dialog-head h2{font-size:23px;margin:0;line-height:1.5}.icon-button{background:#f5f0f3;color:#8e7f8a;border-radius:50%;width:32px;height:32px;flex-shrink:0;font-size:25px;line-height:1}.copy{color:#716979;font-size:14px;line-height:1.8}.info-card{padding:16px;background:#faf6f8;border:1px solid #f0e6ec;border-radius:12px;margin-bottom:12px}.info-card h3{margin:0 0 7px;font-size:15px}.info-card p{margin:0;color:#7c7480;line-height:1.7;font-size:13px}.pill{display:inline-block;font-size:11px;border-radius:6px;padding:5px 9px;font-weight:650}.pill.red{background:#fbe2e8;color:#b72840}.pill.amber{background:#fff0c8;color:#b67419}.pill.green{background:#dff2e6;color:#38865a}.row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0}.primary,.secondary{padding:12px 18px;border-radius:10px;font-weight:650;font-size:14px}.primary{background:linear-gradient(110deg,#dd6273,#c52b3a);color:white;box-shadow:0 5px 16px #bd2a3a20}.secondary{background:#f8edf0;color:#a32d40}.actions{display:flex;gap:10px;margin-top:21px}.actions>*{flex:1}.field-label{display:block;margin:14px 0 8px;color:#6d6370;font-size:13px}input,textarea,select{width:100%;padding:12px;border:1px solid #e6dce3;border-radius:9px;background:white;color:#302c33;outline:none}textarea{min-height:100px;resize:vertical;line-height:1.7}.status-note{font-size:11px;color:#9b8c97;line-height:1.7;margin:13px 0 0}.choice{display:flex;align-items:center;gap:11px;border:1px solid #e9dfe6;padding:12px;border-radius:9px;margin:9px 0;font-size:14px;cursor:pointer}.choice input{width:auto;accent-color:var(--red)}.amount{font-size:25px;color:#a9293c;font-weight:750}.chat{max-height:250px;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:5px 0 12px}.message{max-width:92%;padding:13px 15px;line-height:1.8;border-radius:12px;background:#f7f0f4;font-size:13px;white-space:pre-wrap}.message.user{align-self:flex-end;background:#ce3b50;color:white}.quick-questions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.quick-questions button{border:1px solid #efd8e1;background:white;color:#a83249;border-radius:16px;font-size:11px;padding:7px 10px}.graph{width:100%;height:160px}.tour-dot{position:absolute;z-index:13;background:var(--red);color:white;border:3px solid white;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;box-shadow:0 3px 12px #4d122b33}.toast{position:fixed;z-index:100;bottom:28px;left:50%;transform:translate(-50%,15px);background:#24212bec;color:white;box-shadow:0 8px 30px #24142725;padding:14px 22px;border-radius:12px;font-size:13px;opacity:0;pointer-events:none;transition:.25s;max-width:90vw;line-height:1.6}.toast.show{opacity:1;transform:translate(-50%,0)}#tourShade{position:fixed;inset:0;pointer-events:none;z-index:10}#tip{position:fixed;z-index:30;background:white;border:1px solid #f0dce2;padding:22px 24px;width:310px;border-radius:16px;box-shadow:0 15px 70px #3a182a35;animation:appear .24s ease}#tipCount{font-size:10px;letter-spacing:1px;color:var(--red);font-weight:750;margin:0 0 9px}#tip h3{margin:0 0 9px;font-size:17px}#tipBody{line-height:1.8;color:#7c7180;font-size:13px;margin:0}#closeTip{position:absolute;right:9px;top:6px;background:none;color:#b8a8b3;font-size:23px}.tip-actions{display:flex;justify-content:space-between;margin-top:15px}.tip-actions button{padding:8px 12px;border-radius:7px;background:#f8ebef;color:#b6354c;font-size:12px}.tip-actions button:first-child{background:white;color:#9c8c98}.saved-note{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 1%}.progress-points{display:flex;justify-content:space-between;gap:5px}.progress-points button{flex:1;padding:13px 5px;border-radius:9px;background:#f5f1f4;color:#958597;font-size:13px}.progress-points button.active{background:#cb374b;color:white}.share-url{font-size:11px;overflow-wrap:anywhere;color:#8b7b88;line-height:1.7}.parts{position:relative;overflow:hidden;border-radius:12px;height:140px;background:#fbe9ee}.parts img{position:absolute;width:580%;max-width:none;left:-165%;top:-213%}.readonly-label{font-size:10px;color:#9a8b96}.timeline-entry{padding:12px 0;border-bottom:1px solid #eee3e9;font-size:13px;color:#766a7a}.timeline-entry b{display:block;color:#343039;margin-bottom:5px}@keyframes appear{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@media(min-width:1550px){.tablet{max-width:1150px}}@media(max-width:800px){.toolbar{height:auto;min-height:78px;flex-wrap:wrap;padding:15px 20px;gap:13px}.brand{font-size:15px}.brand small{font-size:7px}.tools button{padding:8px;font-size:11px}nav{order:3;width:100%;justify-content:center}nav button{flex:1;font-size:13px;padding:8px}main{padding:25px 17px 0}.view-heading{margin-bottom:22px}h1{font-size:23px}.subtitle{display:none}.phone-tabs{display:flex;background:#ede8ec;padding:4px;border-radius:10px;margin-bottom:25px;gap:3px}.phone-tabs button{flex:1;padding:8px 2px;font-size:11px}.phones{display:block;max-width:360px}.phone-column:not(.mobile-active){display:none}.phone-column h2{display:none}.tablet{min-width:0}.tablet .hotspot{border-radius:2px}footer{font-size:10px;flex-wrap:wrap;gap:10px}footer span:nth-child(2){order:3;width:100%;font-size:10px}#tip{width:min(320px,calc(100vw - 28px))}dialog{padding:21px}.view-heading .eyebrow{font-size:9px}.dialog-head h2{font-size:20px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}[hidden]{display:none!important}
.phone::after{content:"";position:absolute;inset:0;border:2.6cqw solid #17191f;border-radius:inherit;pointer-events:none;z-index:5}.dynamic-timeline{position:absolute;z-index:2;display:flex;justify-content:space-between;background:white;pointer-events:none}.timeline-stop{display:flex;flex-direction:column;align-items:center;gap:8px;color:#a7adba;flex:1;font-size:1cqw;position:relative}.timeline-stop:before{content:"";position:absolute;left:0;right:0;top:16%;height:2px;background:#e4e7ec;z-index:-1}.timeline-stop b{display:grid;place-items:center;background:white;border:2px solid #e4e7ec;border-radius:50%;width:2cqw;height:2cqw;color:#a7adba}.timeline-stop.done b{border-color:#ca3043;background:#ca3043;color:white}.phone .timeline-stop{font-size:3cqw}.phone .timeline-stop b{width:7cqw;height:7cqw}.parts{height:auto;aspect-ratio:300/134}.parts img{width:682.6667%;left:-199.6667%;top:-382.09%}
/* A reference image extends beyond its frame; clip without creating a scroll container. */
.device{overflow:clip}
.tablet .patch{border-radius:50%}
.tablet .patch:nth-of-type(1),.tablet .patch:nth-of-type(3),.tablet .patch:nth-of-type(5){background:#f7f4f5!important;border-radius:0}.tablet .patch:nth-of-type(1)::before,.tablet .patch:nth-of-type(3)::before,.tablet .patch:nth-of-type(5)::before{content:"";position:absolute;left:0;top:25%;right:30%;bottom:0;background:white;border-top-right-radius:35%}
