:root{--yellow:#ffd400;--ink:#11110f;--paper:#f4f2ed;--muted:#8f8b83;--line:#d8d4cb;--green:#d5dfcf;--eng:'Manrope',sans-serif;--tc:'Noto Sans TC',sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:var(--tc);background:var(--paper)}button,input{font:inherit}.auth-page{min-height:100vh;overflow:hidden;background:var(--paper)}.auth-brand{display:flex;align-items:center;gap:8px;font:800 25px/1 var(--eng);letter-spacing:-1.8px}.auth-brand em{font-style:normal;font-weight:400}.auth-brand>span{width:35px;height:35px;background:var(--yellow);border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 19px/1 var(--eng);letter-spacing:-4px}.auth-brand>span i{font-style:normal;transform:translateX(-3px)}.auth-brand>span b{font-size:23px;transform:translate(1px,-1px)}.auth-page>.auth-brand{position:absolute;top:35px;left:clamp(24px,5vw,76px);z-index:2}.auth-layout{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr}.auth-copy{background:var(--ink);color:white;padding:clamp(130px,17vh,185px) clamp(32px,11vw,170px);position:relative;overflow:hidden}.kicker{font:700 9px/1 var(--eng);letter-spacing:1.7px;margin:0;color:inherit}.auth-copy .kicker{color:var(--yellow)}.auth-copy h1{font-size:clamp(45px,5vw,75px);line-height:1.25;letter-spacing:-.09em;margin:30px 0 24px}.auth-copy h1 span{background:linear-gradient(transparent 65%,var(--yellow) 65%);color:white}.auth-copy h1 i,.chat-empty h1 i{font:800 .7em var(--eng);font-style:normal;color:var(--yellow)}.auth-copy>p:not(.kicker){max-width:350px;color:#c7c4bd;line-height:2;font-size:14px}.auth-shape{position:absolute;width:350px;height:350px;border-radius:50%;right:-80px;bottom:-87px;background:var(--yellow);color:var(--ink);display:flex;align-items:center;justify-content:center;font:800 104px/1 var(--eng);letter-spacing:-12px;transform:rotate(-15deg)}.auth-shape small{font:700 9px/1.5 var(--eng);letter-spacing:1.3px;margin-left:18px}.login-card{align-self:center;justify-self:center;width:min(100% - 48px,410px);padding:10px 0}.login-card .kicker{color:#747069}.login-card h2{font-size:35px;letter-spacing:-.07em;margin:20px 0 3px}.login-card>p:not(.kicker){font-size:13px;color:#716e68;margin:0 0 33px}.login-card form{display:grid;gap:18px}.login-card label{display:grid;gap:7px;font-size:12px;font-weight:700}.login-card input{border:0;border-bottom:1px solid var(--ink);background:transparent;padding:10px 0;outline:0;font-size:15px}.login-card input:focus{border-bottom:2px solid var(--yellow)}.login-card form button{margin-top:8px;border:0;background:var(--ink);color:white;padding:15px 17px;text-align:left;font-weight:700;cursor:pointer}.login-card form button span{float:right;font-size:18px}.form-error{margin:0 0 15px;padding:10px 12px;background:#f7d8d2;color:#8b2418;font-size:12px}.demo-accounts{margin-top:30px;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:4px;color:#67635c;font:11px/1.6 var(--eng)}.demo-accounts b{color:var(--ink);font-size:10px;letter-spacing:1px}.portal-page{height:100vh;overflow:hidden}.portal-header{height:72px;border-bottom:1px solid var(--line);padding:0 30px;display:flex;align-items:center;justify-content:space-between;background:var(--paper)}.portal-header .auth-brand{font-size:21px}.portal-header .auth-brand>span{width:29px;height:29px;font-size:16px}.portal-head-actions{display:flex;align-items:center;gap:18px}.head-role{font-size:11px;font-weight:700;background:var(--yellow);padding:5px 8px}.logout{border:0;background:transparent;padding:0;cursor:pointer;font-size:12px;font-weight:700}.logout span{font-size:16px;margin-left:4px}.portal-shell{height:calc(100vh - 72px);display:grid;grid-template-columns:315px 1fr}.sidebar{border-right:1px solid var(--line);background:#eeece6;padding:28px 17px;display:flex;flex-direction:column;min-height:0}.profile{display:flex;align-items:center;gap:11px;padding:0 8px 27px;border-bottom:1px solid var(--line)}.avatar{width:43px;height:43px;flex:none;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font:800 18px var(--eng)}.profile small{display:block;font:700 8px var(--eng);letter-spacing:1px;color:var(--muted)}.profile b{display:block;font-size:14px;margin:2px 0}.profile span{font-size:10px;color:#66625c}.side-title{padding:21px 8px 10px;display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:700}.side-title small{font:700 10px var(--eng);color:#8b867e}.contact-list{overflow:auto;min-height:0;flex:1}.loading{font-size:11px;color:#87837c;padding:8px}.contact{display:flex;align-items:center;gap:10px;padding:11px 8px;margin:2px 0;cursor:pointer;border-left:3px solid transparent;transition:background .2s}.contact:hover,.contact.active{background:#fff;border-left-color:var(--yellow)}.contact .avatar{width:35px;height:35px;font-size:14px}.contact-info{min-width:0;flex:1}.contact-info b{display:block;font-size:12px}.contact-info span{display:block;font-size:10px;color:#77726b;margin-top:1px}.contact-role{font:700 8px var(--eng);letter-spacing:.4px;color:#77726b}.admin-button{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:transparent;padding:15px 8px;text-align:left;font-size:11px;font-weight:700;cursor:pointer;margin-top:12px}.admin-button span{color:#555}.admin-button i{font:700 16px var(--eng);font-style:normal;float:right}.back-link{font-size:11px;font-weight:700;padding:17px 8px 0}.back-link span{font-size:15px;margin-right:5px}.chat-area{min-width:0;background:#faf9f6;position:relative}.chat-empty{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.empty-mark{width:104px;height:104px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;flex-direction:column;font:800 38px/.75 var(--eng);letter-spacing:-4px;margin-bottom:25px}.empty-mark i{font-style:normal;font-size:22px;letter-spacing:0}.chat-empty .kicker{color:#7c776f}.chat-empty h1{font-size:clamp(34px,4vw,55px);line-height:1.2;letter-spacing:-.09em;margin:17px 0 12px}.chat-empty>p:not(.kicker){font-size:13px;color:#77726b;margin:0}.chat-room{height:100%;display:flex;flex-direction:column}.is-hidden{display:none!important}.room-header{height:75px;flex:none;border-bottom:1px solid var(--line);padding:0 32px;display:flex;align-items:center;gap:10px;background:var(--paper)}.avatar-small{width:37px;height:37px;font-size:15px}.room-header b{display:block;font-size:13px}.room-header span{display:block;font-size:10px;color:#77726b}.room-status{margin-left:auto;font-size:10px;color:#77726b}.room-status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7d9b6c;margin-right:4px}.messages{flex:1;overflow:auto;padding:31px clamp(20px,5vw,75px);display:flex;flex-direction:column;gap:14px}.message{display:flex;max-width:min(78%,520px);gap:8px;align-items:flex-end}.message.mine{align-self:flex-end;flex-direction:row-reverse}.message .bubble{background:#e8e5de;border-radius:3px 14px 14px 14px;padding:10px 13px;font-size:13px;line-height:1.7;word-break:break-word}.message.mine .bubble{background:var(--yellow);border-radius:14px 3px 14px 14px}.message time{font:500 8px var(--eng);color:#908b83;white-space:nowrap}.message img{display:block;max-width:min(100%,300px);border-radius:7px;margin-top:4px}.message .bubble:empty{display:none}.message .bubble:has(img){padding:4px}.message-date{text-align:center;font:600 9px var(--eng);color:#938f87;letter-spacing:.6px;margin:4px 0}.composer{padding:16px clamp(20px,4vw,55px);display:flex;align-items:center;gap:9px;background:var(--paper);border-top:1px solid var(--line);position:relative}.composer input[type=text],.composer>input{min-width:0;flex:1;border:0;background:white;border-radius:5px;padding:12px 14px;outline:0;font-size:13px}.composer>button{width:42px;height:42px;border:0;background:var(--ink);color:white;border-radius:50%;font-size:20px;cursor:pointer}.image-upload{width:36px;height:36px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;cursor:pointer;font:400 25px var(--eng)}.image-upload input{display:none}.image-selected{position:absolute;bottom:69px;left:clamp(20px,4vw,55px);padding:7px 10px;background:var(--yellow);font-size:10px;box-shadow:0 3px 10px #0002}.admin-drawer{position:fixed;z-index:10;inset:0;background:rgba(17,17,15,.3);padding:48px;display:grid;place-items:center}.drawer-panel{width:min(960px,100%);max-height:100%;overflow:auto;background:var(--paper);padding:34px}.drawer-panel header{display:flex;justify-content:space-between;align-items:flex-start}.drawer-panel header .kicker{color:#827e76}.drawer-panel h2{font-size:30px;letter-spacing:-.07em;margin:12px 0 0}.drawer-panel header button{border:0;background:var(--ink);color:white;border-radius:50%;width:32px;height:32px;font-size:22px;cursor:pointer}.drawer-intro{font-size:12px;color:#6d6962;line-height:1.8;max-width:560px;margin:22px 0}.user-manager{border-top:1px solid var(--line)}.user-row{display:grid;grid-template-columns:1.15fr .9fr 1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.user-name b{display:block;font-size:13px}.user-name span{font:10px var(--eng);color:#77726b}.user-row select{width:100%;border:1px solid var(--line);background:white;padding:8px;font-size:11px}.user-row button{border:0;background:var(--ink);color:white;padding:9px 12px;font-size:11px;font-weight:700;cursor:pointer}.admin-note{font-size:12px;padding:16px 0;color:#777}.toast{position:fixed;z-index:20;right:22px;bottom:22px;background:var(--ink);color:white;padding:12px 15px;font-size:12px;box-shadow:0 8px 30px #0003}@media(max-width:720px){.auth-layout{grid-template-columns:1fr}.auth-copy{min-height:40vh;padding:130px 28px 48px}.auth-copy h1{font-size:44px}.auth-shape{width:180px;height:180px;right:-40px;bottom:-40px;font-size:55px}.auth-shape small{font-size:6px}.login-card{padding:52px 0}.portal-page{height:auto;min-height:100vh;overflow:auto}.portal-header{padding:0 18px;height:62px}.portal-shell{height:calc(100vh - 62px);grid-template-columns:100px 1fr}.sidebar{padding:18px 8px}.profile{padding:0 0 16px;justify-content:center}.profile>div:last-child,.side-title span,.side-title small,.contact-info,.contact-role,.admin-button,.back-link{display:none}.contact{justify-content:center;padding:9px 0;border-left:0;border-bottom:3px solid transparent}.contact:hover,.contact.active{border-left-color:transparent;border-bottom-color:var(--yellow)}.room-header{padding:0 17px}.room-status{display:none}.messages{padding:22px 15px}.message{max-width:90%}.composer{padding:12px 14px}.admin-drawer{padding:16px}.drawer-panel{padding:23px}.user-row{grid-template-columns:1fr 1fr;gap:7px}.user-name{grid-column:span 2}.user-row button{grid-column:span 2}.head-role{display:none}}
