:root{--brand:#177E96;--brand-2:#2F89A6;--brand-3:#52C5D3;--grad:linear-gradient(135deg,#2F89A6,#52C5D3);--bg:#F4F8FA;--panel:#FFFFFF;--text:#1F2A33;--sub:#5B6B79;--border:#E1EBF0;--pending:#C98A2B;--pending-bg:#FFF6E8;--ok:#248F62;--ok-bg:#E7F4EE;--revise:#8A7FD6;--revise-bg:#F0EEFA;--pub:#177E96;--pub-bg:#E9F4F7;--danger:#C75546}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font:16px/1.6 -apple-system,Noto Sans TC,Microsoft JhengHei,sans-serif;padding-bottom:env(safe-area-inset-bottom)}#root{max-width:640px;margin:0 auto;min-height:100vh}a{color:var(--brand)}button{font:inherit;cursor:pointer}.btn{border:none;border-radius:10px;padding:12px 18px;font-weight:600;min-height:46px}.btn-primary{background:var(--brand);color:#fff}.btn-primary:active{background:var(--brand-2)}.btn-ghost{background:transparent;color:var(--brand);border:1px solid var(--border)}.btn:disabled{opacity:.5}.btn-block{width:100%}.topbar{position:sticky;top:0;z-index:10;background:var(--panel);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top))}.topbar .brand-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.topbar .title{font-weight:700;font-size:1.05rem}.topbar .spacer{flex:1}.topbar .who{font-size:.8rem;color:var(--sub)}.tabs{display:flex;background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:9}.tabs button{flex:1;background:none;border:none;padding:14px 0;font-weight:600;color:var(--sub);border-bottom:2px solid transparent}.tabs button.active{color:var(--brand);border-bottom-color:var(--brand)}.content{padding:16px}.group-title{font-size:.85rem;font-weight:700;color:var(--sub);margin:20px 4px 8px;display:flex;align-items:center;gap:6px}.group-title:first-child{margin-top:4px}.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden;margin-bottom:14px}.card img{width:100%;display:block;background:#eef4f6}.card-body{padding:14px}.badge{display:inline-block;font-size:.72rem;font-weight:700;padding:3px 10px;border-radius:99px;margin-bottom:8px}.badge.pending{background:var(--pending-bg);color:var(--pending)}.badge.revise{background:var(--revise-bg);color:var(--revise)}.badge.ok{background:var(--ok-bg);color:var(--ok)}.badge.pub{background:var(--pub-bg);color:var(--pub)}.card .date{font-size:.8rem;color:var(--sub);margin-bottom:6px}.card .copy{white-space:pre-wrap;font-size:.95rem;margin:8px 0}.card .copy.ig{border-top:1px dashed var(--border);padding-top:8px;margin-top:8px}.copy-label{font-size:.72rem;font-weight:700;color:var(--sub)}.card-actions{display:flex;gap:10px;margin-top:12px}.card-actions .btn{flex:1}.confirmed-note{font-size:.82rem;color:var(--ok);margin-top:8px}.pub-links{display:flex;gap:10px;margin-top:10px}.pub-links a{font-size:.85rem;text-decoration:none;padding:8px 14px;border:1px solid var(--border);border-radius:8px}.comments{margin-top:12px;border-top:1px solid var(--border);padding-top:12px}.comment{margin-bottom:8px;font-size:.9rem}.comment .who{font-weight:700;font-size:.78rem}.comment.internal .who{color:var(--brand)}.comment.client{text-align:right}.comment.client .bubble{background:var(--brand);color:#fff;display:inline-block;padding:8px 12px;border-radius:12px 12px 2px;text-align:left}.comment.internal .bubble{background:var(--bg);display:inline-block;padding:8px 12px;border-radius:12px 12px 12px 2px}.comment-form{display:flex;gap:8px;margin-top:10px}.comment-form textarea{flex:1;border:1px solid var(--border);border-radius:10px;padding:10px;font:inherit;resize:vertical;min-height:44px}.empty{text-align:center;color:var(--sub);padding:56px 20px}.empty .icon{font-size:2.4rem;margin-bottom:10px}.login-wrap{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:32px 24px;background:var(--grad);color:#fff}.login-card{background:var(--panel);color:var(--text);border-radius:18px;padding:28px 22px;max-width:400px;margin:0 auto;width:100%}.login-card h1{font-size:1.3rem;margin:0 0 4px}.login-card .subtitle{color:var(--sub);font-size:.9rem;margin-bottom:20px}.login-brand{text-align:center;color:#fff;margin-bottom:24px}.login-brand .name{font-size:1.6rem;font-weight:700;letter-spacing:.05em}.field{margin-bottom:14px}.field label{display:block;font-size:.85rem;font-weight:600;margin-bottom:5px}.field input{width:100%;border:1px solid var(--border);border-radius:10px;padding:12px;font:inherit}.login-divider{text-align:center;color:var(--sub);font-size:.82rem;margin:18px 0;position:relative}.login-divider:before,.login-divider:after{content:"";position:absolute;top:50%;width:40%;height:1px;background:var(--border)}.login-divider:before{left:0}.login-divider:after{right:0}.err{background:#fdecea;color:var(--danger);border-radius:8px;padding:10px 12px;font-size:.88rem;margin-bottom:12px}.hint{background:var(--pending-bg);color:var(--pending);border-radius:8px;padding:10px 12px;font-size:.82rem;margin-bottom:12px}.footer-note{text-align:center;color:#fff;opacity:.85;font-size:.78rem;margin-top:20px}.report-item{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between}.report-item .period{font-weight:600}.report-item .sub{font-size:.8rem;color:var(--sub)}.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%);background:#1f2a33;color:#fff;padding:12px 20px;border-radius:99px;font-size:.9rem;z-index:100;box-shadow:0 4px 16px #0003}.spinner{width:28px;height:28px;border:3px solid var(--border);border-top-color:var(--brand);border-radius:50%;animation:spin .8s linear infinite;margin:56px auto}@keyframes spin{to{transform:rotate(360deg)}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;padding:24px;z-index:50}.dialog{background:var(--panel);border-radius:16px;padding:24px;max-width:360px;width:100%}.dialog h3{margin:0 0 8px}.dialog p{color:var(--sub);font-size:.92rem;margin:0 0 20px}.dialog-actions{display:flex;gap:10px}.dialog-actions .btn{flex:1}
