:root{font-family:"Noto Sans TC",system-ui,sans-serif;color:#233e38;background:#f5f6f2;font-size:16px;line-height:1.65;--teal:#126b60}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;padding-bottom:100px}header{max-width:680px;margin:auto;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;gap:10px;align-items:center;color:var(--teal);text-decoration:none;font-size:32px}.brand span{font-size:18px;font-weight:700}.brand small{display:block;font-size:11px;font-weight:400;letter-spacing:2px;color:#657b75}#connection{font-size:12px;background:#e7eee8;border-radius:20px;padding:5px 10px}main{max-width:640px;margin:auto;padding:10px 22px 28px}h1{font-size:27px;letter-spacing:-.8px;line-height:1.35;margin:8px 0 24px}h2{font-size:18px;line-height:1.5;margin:0 0 10px}p{margin:8px 0}.eyebrow{color:var(--teal);font-size:12px;letter-spacing:1.4px}.muted,.caption{color:#697973}.caption{font-size:12px;margin-top:20px}.hero{background:#e0eee8;border-radius:22px;padding:24px;margin-bottom:28px}.hero h2{font-size:24px;margin:12px 0}.hero>span{font-size:12px;background:#fff9;padding:5px 10px;border-radius:20px}.hero p{font-size:14px}#freshness{font-size:12px}.hero.high{background:#fbe5df;color:#862e22}.hero.medium{background:#f7edd9;color:#795415}.hero.unknown{background:#e9eceb;color:#59645f}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-heading h2{margin:0}.rooms{display:grid;grid-template-columns:1fr 1fr;gap:12px}.room{background:white;border:1px solid #e5e9e3;border-radius:18px;padding:18px;min-width:0}.room .room-icon{width:42px;height:42px;border-radius:14px;background:#f0f4ef;display:grid;place-items:center;font-size:23px;margin-bottom:18px}.room h3{font-size:16px;margin:0}.room strong{font-size:27px;font-weight:600}.room small{color:#6d7a73;margin-left:4px}.light{font-size:12px;margin-top:12px;border-top:1px solid #edf0eb;padding-top:9px}.ask-card{padding:24px 0;margin-top:12px}.ask-card p{font-size:14px}.primary,button{font:inherit;border:0;cursor:pointer;min-height:48px;border-radius:12px;padding:12px 16px}.primary{display:block;background:var(--teal);color:white;text-decoration:none;text-align:center;font-weight:500;margin-top:16px}button:disabled{opacity:.6}.text-button{background:transparent;color:var(--teal);padding:6px 10px}.secondary{color:var(--teal);background:#e4ece7;width:100%}.card,.person{background:white;border:1px solid #e5e9e3;padding:20px;border-radius:18px;margin-bottom:14px}.person{display:flex;align-items:center;gap:14px}.avatar{width:45px;height:45px;flex-shrink:0;background:#e5eee8;border-radius:50%;display:grid;place-items:center;color:var(--teal);font-size:20px}.person h2{margin:0;font-size:17px}.person p{font-size:14px;color:#697973;margin:2px 0}.steps{padding:0;list-style:none}.steps li{border-left:3px solid #dbe5df;margin-left:8px;padding:4px 0 18px 16px}.steps li.done{border-color:var(--teal)}nav{position:fixed;bottom:0;left:0;right:0;background:#fffffff5;border-top:1px solid #e1e6df;display:flex;justify-content:center;padding:8px 12px calc(8px + env(safe-area-inset-bottom));backdrop-filter:blur(12px)}nav button{max-width:155px;width:25%;background:transparent;font-size:12px;color:#74817a;padding:3px 10px}nav span{display:block;font-size:23px;height:31px;line-height:1.3}nav [aria-current]{color:var(--teal);font-weight:700}input{font:inherit;width:100%;border:1px solid #bacbc1;border-radius:12px;padding:14px;margin:8px 0;font-size:23px;letter-spacing:6px}label{display:block;font-size:14px;margin-top:26px}form button{width:100%}details{margin-top:20px;padding:14px;background:#eaf0e9;border-radius:12px}summary{cursor:pointer}.welcome{margin:20px 0;font-size:60px;color:var(--teal)}#pair-message,#sync-error{color:#943b29}a{color:var(--teal)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #d5a94b;outline-offset:3px}@media(min-width:600px){h1{font-size:32px}.rooms{gap:16px}.room{padding:23px}}
@media(prefers-reduced-motion:no-preference){.page{animation:appear .18s ease-out}@keyframes appear{from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:none}}}


nav button{width:20%;max-width:136px}
.phone-settings{background:#fff;border:1px solid #d5e0d9;border-radius:14px;padding:14px;margin:12px 0}.phone-settings summary{font-weight:700;cursor:pointer}.phone-settings input,.phone-settings select{width:100%;font:inherit;font-size:16px;margin:8px 0 12px;padding:9px;min-height:44px;letter-spacing:normal}.phone-settings input[type=range]{padding:0}.phone-settings label{display:block}.grant-choice{display:flex!important;align-items:center;gap:10px;margin:12px 0}.grant-choice input{width:22px!important;height:22px;min-height:22px;margin:0;letter-spacing:normal}.device-grants{padding:16px 0;border-bottom:1px solid #d5e0d9}.device-grants button{margin:6px 8px 6px 0}.voice-toolbar{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.voice-toolbar button{padding:9px 11px;min-height:44px;font-size:14px}.voice-toolbar p{width:100%;margin:0;font-size:13px;color:#3f6158}.light-buttons{display:flex;gap:8px;margin-top:10px}.light-buttons button{flex:1;padding:8px 6px;font-size:15px;min-height:44px;background:#fff;border:1px solid #657e73}.light-buttons .selected{background:#126b60;color:#fff;border-color:#126b60}.light-buttons button:disabled{opacity:.55}#light-status{font-weight:600;color:#245648}#device-name{font-size:16px;letter-spacing:normal;text-align:left}
.chat-messages{border-radius:16px;padding:12px;position:relative;background-position:center;background-size:cover;background-attachment:scroll}.chat-messages .chat-bubble{position:relative;z-index:1}.chat-messages .chat-bubble p{font-size:var(--chat-font,18px);line-height:1.65}.chat-messages.has-photo{min-height:40vh}.has-photo .chat-bubble{background:rgba(255,255,255,.95);box-shadow:0 2px 8px #0002}.has-photo .chat-bubble.user{background:rgba(221,243,234,.97)}.effect-glow{background-color:#e8f0ff;box-shadow:inset 0 0 38px #9edbdb88;animation:phone-glow 8s ease-in-out infinite alternate}.effect-snow:before{content:'';position:absolute;inset:0;border-radius:16px;pointer-events:none;background-image:radial-gradient(circle,#8bbfc5aa 1.5px,transparent 2.5px),radial-gradient(circle,#95a6d080 2px,transparent 3px);background-size:49px 73px,83px 97px;animation:phone-snow 12s linear infinite}.effect-snow{background-color:#f0f4fa}@keyframes phone-glow{to{box-shadow:inset 0 0 56px #c3a2ed66}}@keyframes phone-snow{to{background-position:20px 146px,-20px 194px}}@media(prefers-reduced-motion:reduce){.effect-glow,.effect-snow:before{animation:none}}
.chat-options{display:flex;gap:12px;align-items:center;margin-bottom:12px}.chat-options label{margin:0;font-size:13px}.chat-options select{font:inherit;max-width:55%;padding:10px;border:1px solid #bacbc1;border-radius:10px;background:white}
.chat-scope{font-size:13px}.cloud-choice{font-size:13px;margin:12px 0;padding:12px;background:#fff1d9;border-radius:10px}.cloud-choice input{display:inline-block;width:auto;font-size:16px;letter-spacing:normal;margin-right:8px}
.chat-messages{padding:20px 0;min-height:28vh;overflow-wrap:anywhere}.chat-welcome{color:#697973;padding:18px 0}.chat-bubble{max-width:94%;padding:12px 16px;border-radius:16px;margin:12px 0;background:white;border:1px solid #e1e8e2}.chat-bubble p{white-space:pre-wrap;margin:4px 0}.chat-bubble small{font-size:11px;color:#657b75}.chat-bubble.user{margin-left:auto;background:#e2eee8}.chat-prompts{display:flex;flex-wrap:wrap;gap:6px}.chat-prompts button{font-size:13px;background:white;border:1px solid #d0ded5;min-height:40px;padding:7px 10px}
#chat-form{display:grid;grid-template-columns:minmax(0,1fr) 74px;gap:10px;align-items:end;margin-top:16px}#chat-input{resize:vertical;min-height:56px;max-height:180px;width:100%;font:inherit;font-size:16px;border:1px solid #bacbc1;border-radius:12px;padding:12px;line-height:1.5}#chat-send{margin:0;min-height:56px;padding:12px 8px}#chat-error{color:#943b29;background:#fbe5df;padding:10px;border-radius:8px}#chat-wait{font-size:14px;color:var(--teal);padding:8px 0}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}textarea:focus-visible,select:focus-visible{outline:3px solid #d5a94b;outline-offset:3px}#chat-clear{font-size:13px}
@media(max-width:360px){main{padding-left:14px;padding-right:14px}.chat-options{display:block}.chat-options select{max-width:100%;margin-top:6px}.chat-bubble{max-width:98%}}