@import "https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@300;400;500;600;700&family=Noto+Sans+TC:wght@300;400;500;700&display=swap";
:root{--background:#f4efe4;--foreground:#21201b;--foreground-soft:#4a463d;--green:#33473d;--green-2:#46604f;--brand:#33473d;--brand-dark:#2a3b33;--gold:#a9854f;--gold-soft:#c2a878;--muted:#8f8675;--card:#fffdf8;--line:#e3dac8;--danger:#b3552c}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;height:100%}html,body{max-width:100vw;overflow-x:hidden}body{min-height:100%;color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased;flex-direction:column;font-family:Noto Sans TC,PingFang TC,Microsoft JhengHei,system-ui,sans-serif;line-height:1.6;display:flex}*{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}.device{display:contents}.survey{background:radial-gradient(95% 42% at 50% 0%, #ffffff80, transparent 62%), var(--background);flex-direction:column;width:100%;max-width:480px;height:100dvh;margin:0 auto;display:flex;position:relative;overflow:hidden}@media (min-width:700px){body{background:#2a2723;justify-content:center;align-items:center;padding:28px 0}.device{background:linear-gradient(150deg,#43464c 0%,#1c1d20 42%,#34363b 100%);border-radius:58px;padding:14px;display:block;position:relative;box-shadow:0 44px 90px -26px #000000bf,inset 0 0 0 2px #ffffff0d}.device:after{content:"";z-index:30;background:#000;border-radius:16px;width:98px;height:28px;position:absolute;top:26px;left:50%;transform:translate(-50%)}.device .survey{border-radius:44px;width:360px;height:min(780px,90vh)}.device .survey .brandbar{padding-top:3.7rem}}.brandbar{flex:none;justify-content:center;align-items:center;padding:2.4rem 0 1.2rem;display:flex}.brandbar img{opacity:.95;width:auto;height:36px}h2{letter-spacing:.03em;color:var(--foreground);line-break:strict;text-wrap:pretty;overflow-wrap:break-word;margin-bottom:.6rem;font-family:Noto Serif TC,serif;font-size:1.32rem;font-weight:600;line-height:1.55}.lead{color:var(--foreground);line-break:strict;text-wrap:pretty;overflow-wrap:break-word;margin-bottom:.4rem;font-size:.98rem;line-height:1.65}.step{letter-spacing:.24em;color:var(--gold);text-transform:uppercase;margin-bottom:.85rem;font-size:.7rem;font-weight:500}.muted{color:var(--muted);overflow-wrap:break-word;font-size:.85rem;line-height:1.7}.progress{background:var(--line);border-radius:99px;flex:none;height:4px;margin:0 1.5rem 1.35rem;position:relative}.progress>div{background:linear-gradient(90deg, var(--gold), var(--gold-soft));border-radius:99px;transition:width .45s;position:absolute;top:0;bottom:0;left:0}.progress>div:after{content:"";background:var(--gold-soft);border-radius:50%;width:7px;height:7px;position:absolute;top:50%;right:-2px;transform:translateY(-50%);box-shadow:0 0 8px #ddc28de6}.body{flex-direction:column;flex:auto;min-height:0;display:flex;overflow-y:auto}.card{box-shadow:none;background:0 0;border:none;border-radius:0;flex-direction:column;flex:1 0 auto;margin:0;padding:0 1.5rem 1.6rem;animation:.5s both fadeUp;display:flex}.card>:first-child:not(.banner):not(.done-hero){margin-top:1.2rem}.grow-center{flex-direction:column;flex:auto;justify-content:center;display:flex}.actions{margin-top:auto;padding-top:.6rem}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.banner{background-position:50%;background-size:cover;height:150px;margin:0 -1.5rem 1.4rem;position:relative}.banner:after{content:"";background:linear-gradient(#212a210a,#212a2152);position:absolute;inset:0}.done-hero{background-position:50%;background-size:cover;height:200px;margin:0 -1.5rem 1.5rem;position:relative}.done-hero:after{content:"";background:linear-gradient(#212a211a,#212a215c);position:absolute;inset:0}.cover{text-align:center;background:#8a9d8a url(/brand/photos/exterior-dusk.jpg) 50%/cover no-repeat;flex-direction:column;justify-content:flex-start;align-items:center;animation:.6s both fadeUp;display:flex;position:absolute;inset:0}.cover:before{content:"";background:linear-gradient(#141a166b 0%,#141a161f 38%,#141a16a3 100%);position:absolute;inset:0}.cover-mist{filter:blur(5px);background:radial-gradient(60% 70% at 28% 100%,#ffffff52,#0000 72%),radial-gradient(52% 60% at 78% 100%,#ffffff3d,#0000 72%);height:60%;animation:9s ease-in-out infinite alternate floatMist;position:absolute;bottom:0;left:0;right:0}@keyframes floatMist{0%{transform:translate(-6px)translateY(4px)}to{transform:translate(8px)translateY(-4px)}}.cover .cover-inner{z-index:2;-webkit-backdrop-filter:blur(3px);background:#12181457;border:1px solid #ffffff24;border-radius:20px;flex-direction:column;align-items:center;margin:20vh 1.5rem 0;padding:2rem 2.2rem 2.3rem;display:flex;position:relative}.cover .cover-inner img{filter:drop-shadow(0 4px 18px #0000004d);width:180px;height:auto}.cover .welcome{z-index:2;letter-spacing:.22em;color:#fff;text-shadow:0 1px 8px #0000004d;margin-top:2.1rem;font-family:Noto Serif TC,serif;font-size:1rem;line-height:1.9;position:relative}.cover .welcome:before{content:"";background:var(--gold-soft);opacity:.7;width:28px;height:1px;margin:0 auto 1.4rem;display:block}.cover .cover-cta{z-index:2;position:absolute;bottom:2rem;left:1.5rem;right:1.5rem}.cover .cover-cta .btn-primary{color:var(--green);background:#fdfbf5f5;box-shadow:0 16px 32px -12px #141e1673}.cover .cover-cta .btn-primary:after{border-color:#33473d2e}.cover .hint{color:#ffffffd9;letter-spacing:.15em;margin-top:.9rem;font-size:.7rem}.score-display{text-align:center;flex-direction:column;justify-content:center;align-items:center;height:7rem;margin:.5rem 0 1.6rem;display:flex}.score-display .num{letter-spacing:.02em;color:var(--green);font-family:Noto Serif TC,serif;font-size:5rem;font-weight:400;line-height:1;transition:color .25s}.score-display .num.empty{color:var(--line)}.score-display .desc{letter-spacing:.14em;color:var(--gold);height:1.5rem;margin-top:.75rem;font-family:Noto Serif TC,serif;font-size:.95rem}.score-display .desc.ph{color:var(--muted)}.rail{height:40px;margin:0 .4rem;position:relative}.rail .track{background:var(--line);border-radius:2px;height:2px;position:absolute;top:19px;left:0;right:0}.rail .fill{background:linear-gradient(90deg, var(--gold), var(--gold-soft));border-radius:2px;width:0;height:2px;transition:width .25s;position:absolute;top:19px;left:0;box-shadow:0 0 8px #ddc28d99}.rail .ticks{justify-content:space-between;align-items:center;display:flex;position:absolute;inset:0}.rail .tick{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:28px;height:40px;padding:0;display:flex}.rail .tick:before{content:"";border:1px solid var(--line);background:#fff;border-radius:50%;width:8px;height:8px;transition:all .2s}.rail .tick.filled:before{border-color:var(--gold);background:var(--gold)}.rail .tick.cur:before{background:var(--green);border-color:var(--green);width:18px;height:18px;box-shadow:0 4px 12px -2px #33473d99}.scale-cap{color:var(--muted);opacity:.75;letter-spacing:.04em;justify-content:space-between;margin-top:.5rem;padding:0 2px;font-size:.7rem;display:flex}.opt-list{flex-wrap:wrap;gap:.55rem;margin:.85rem 0;display:flex}.opt-list button{letter-spacing:.02em;border:1px solid var(--line);background:var(--card);color:var(--foreground);border-radius:999px;padding:.7rem 1.15rem;font-size:.95rem;transition:all .2s}.opt-list button.sel{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 8px 18px -10px #5f7d57b3}.opt-grid{grid-template-columns:repeat(3,1fr);gap:.55rem;margin:.85rem 0;display:grid}.opt-grid.cols-2{grid-template-columns:repeat(2,1fr)}.opt-grid.span-last>button:last-child{grid-column:1/-1}.opt-grid button{border:1px solid var(--line);background:var(--card);color:var(--foreground);border-radius:12px;padding:.75rem .4rem;font-size:.9rem;transition:all .2s}.opt-grid button.sel{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 8px 18px -10px #5f7d57b3}textarea,input[type=text],input[type=tel],input[type=date]{border:1px solid var(--line);background:var(--card);width:100%;color:var(--foreground);border-radius:12px;margin-top:.4rem;padding:.75rem .85rem;font-family:inherit;font-size:1rem;transition:border-color .2s,box-shadow .2s}textarea:focus,input[type=text]:focus,input[type=tel]:focus,input[type=date]:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px #c9a86a2e}textarea{resize:vertical;min-height:4.5rem}::placeholder{color:var(--muted)}.field{margin-bottom:1rem}.field label{color:var(--foreground-soft);font-size:.9rem;font-weight:600}.field .err{color:var(--danger);margin-top:.25rem;font-size:.8rem}.check{border:1px solid var(--line);background:var(--card);color:var(--foreground-soft);overflow-wrap:break-word;cursor:pointer;border-radius:12px;align-items:flex-start;gap:.7rem;margin:.7rem 0;padding:.85rem .9rem;font-size:.9rem;line-height:1.55;display:flex}.check input{width:1.2rem;height:1.2rem;accent-color:var(--gold);flex:none;margin-top:.12rem}.check span{flex:1;min-width:0}.hr{background:linear-gradient(90deg, transparent, var(--line) 20%, var(--line) 80%, transparent);height:1px;margin:1rem 0}.btn-primary{letter-spacing:.16em;color:#f3efe6;background:var(--green);cursor:pointer;border:none;border-radius:16px;width:100%;margin-top:.6rem;padding:1rem;font-family:Noto Serif TC,serif;font-size:1rem;font-weight:500;display:block;position:relative;overflow:hidden;box-shadow:0 14px 28px -12px #212a218c}.btn-primary:after{content:"";border:1px solid #f3efe638;border-radius:12px;position:absolute;inset:5px}.btn-primary:disabled{opacity:.35}.btn-ghost{letter-spacing:.1em;width:100%;color:var(--muted);cursor:pointer;background:0 0;border:none;margin-top:.5rem;padding:.7rem;font-size:.85rem;display:block}.notice{color:var(--foreground-soft);padding-left:1rem;font-size:.9rem}.notice li{margin-bottom:.4rem}.err{color:var(--danger);font-size:.85rem}.veil{z-index:60;pointer-events:none;opacity:0;background:radial-gradient(120% 100%,#f4efe48c,#f4efe426);transition:opacity .5s;position:absolute;inset:0}.veil.on{opacity:1;pointer-events:auto}.veil .cloud{filter:blur(22px);background:radial-gradient(closest-side,#fffffff2,#fff0);border-radius:50%;position:absolute}.veil .c1{width:280px;height:200px;animation:5s linear infinite drift1;top:18%;left:-120px}.veil .c2{width:340px;height:240px;animation:6.5s linear infinite drift2;top:40%;right:-160px}.veil .c3{width:240px;height:170px;animation:5.5s linear infinite drift3;bottom:-60px;left:10%}@keyframes drift1{0%{transform:translate(0)}to{transform:translate(120px)}}@keyframes drift2{0%{transform:translate(0)}to{transform:translate(-130px)}}@keyframes drift3{0%{transform:translate(0)}to{transform:translate(90px)}}.hp-field{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}
