:root{background:#f5fbfc}.eyebrow{color:#159ca9}.user .content,button:not(.quiet){background:#159ca9}.content strong{color:#0c8794}.user .content strong{color:#fff}.welcome strong{color:#0c8794}.companion-note{color:#5d8a90}.profile-avatar{width:34px;height:34px;object-fit:cover;border:1px solid #a7dbe0;border-radius:50%;background:#e8f8fa}.menu-wrap{position:relative}.menu-button{padding:8px 12px}.menu-popup{position:absolute;z-index:3;top:calc(100% + 7px);right:0;display:grid;min-width:132px;padding:5px;border:1px solid #cbdde0;border-radius:12px;background:#fff;box-shadow:0 10px 28px #173b4222}.menu-popup[hidden]{display:none!important}.menu-popup button{padding:9px 10px;border-radius:8px;text-align:left;background:transparent;color:#20535a}.menu-popup button:hover{background:#eaf7f8}.attachment-chip{align-items:flex-start}.attachment-info{display:grid;gap:3px;min-width:0}.attachment-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-text-preview{display:-webkit-box;max-width:340px;overflow:hidden;color:#60777a;font-size:.72rem;line-height:1.35;white-space:pre-wrap;-webkit-box-orient:vertical;-webkit-line-clamp:3}
:root { --miku-accent:#159ca9; --miku-ink:#173b42; --miku-muted:#68858b; }
.login-page{background:radial-gradient(ellipse at 20% 10%,#dff5f6,transparent 60%),#f5fbfc;color:var(--miku-ink)}
.login-card{width:min(420px,100%);padding:40px 34px 28px;border:1px solid #d9ecef;border-radius:24px;box-shadow:0 20px 70px #20535a12}
.login-avatar{display:block;object-fit:cover;border-radius:50%;border:3px solid #e1f4f6;margin:0 0 24px}
.login-card h1{font-size:1.75rem;letter-spacing:-.045em}
.login-card>p:not(.eyebrow){color:var(--miku-muted);margin-bottom:30px}
.login-card label{font-size:.82rem;font-weight:600;margin-bottom:2px}
.login-card input{width:100%;min-width:0;padding:14px;background:#f9fcfd;border-color:#cbdde0;transition:border-color .15s,box-shadow .15s}
.login-card input:focus{outline:0;border-color:var(--miku-accent);box-shadow:0 0 0 3px #159ca91a}
.login-card button{padding:14px;margin-top:6px;background:var(--miku-accent)}
.login-card button:hover:not(:disabled){background:#108895}
.login-card button:focus-visible{outline:3px solid #7ed1da;outline-offset:3px}
.login-footnote{display:block;text-align:center;color:var(--miku-muted);font-size:.75rem;margin-top:18px}
@media(max-width:480px){.login-page{padding:20px}.login-card{padding:30px 24px}}
.date-divider{display:flex;align-items:center;gap:12px;margin:10px 0 23px;color:#779096;font-size:.72rem;font-weight:700;letter-spacing:.01em}.date-divider span{height:1px;flex:1;background:#d9e8ea}.date-divider time{white-space:nowrap}
.menu-button{width:36px;height:36px;padding:0!important;display:grid;place-items:center;border-color:#cbdde0!important;color:#20535a!important;font-size:1.15rem;line-height:1;letter-spacing:0}.menu-button:focus-visible,.menu-popup button:focus-visible{outline:3px solid #7ed1da;outline-offset:2px}.menu-popup button{min-height:40px}
button,.attach{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
@media(max-width:600px){
  .shell{width:100%;height:100dvh;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  header{align-items:center;padding:4px 2px 13px}.eyebrow{margin:0;font-size:.68rem;letter-spacing:.13em}.menu-button{width:40px;height:40px;font-size:1.25rem}.menu-popup{top:calc(100% + 8px);min-width:154px;padding:6px;border-radius:14px}.menu-popup button{padding:10px 12px;font-size:.92rem}
  #chat{padding:18px 0 14px;scroll-padding-bottom:12px}.welcome{padding:10px 4px;gap:7px}.message{max-width:90%;margin-bottom:18px;gap:5px}.content{padding:11px 13px;line-height:1.58;border-radius:15px}.profile-avatar{width:30px;height:30px}.date-divider{margin:7px 2px 19px;gap:9px;font-size:.7rem}
  #composer{border-radius:17px;padding:7px 8px 7px 11px;box-shadow:0 8px 22px #173b4210}.compose-row{gap:7px}.attach{min-width:34px;min-height:42px;justify-content:center;padding:8px 3px;font-size:1.05rem}.attach span{display:none}textarea{min-height:42px;padding:10px 0;font-size:16px;line-height:1.4}#send{min-width:62px;min-height:42px;padding:9px 11px;font-size:.88rem;border-radius:12px}.hint{margin:6px 0 0;font-size:.68rem;line-height:1.35}.attachment-list{padding-bottom:6px;max-height:124px;overflow:auto}.attachment-text-preview{max-width:min(240px,68vw)}.scroll-bottom{bottom:calc(105px + env(safe-area-inset-bottom));font-size:.76rem;padding:9px 12px}
}
@media(max-width:360px){.shell{padding-left:9px;padding-right:9px}.message{max-width:94%}#send{min-width:54px;padding:9px 8px}.hint{font-size:.63rem}}
