.chat{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;min-height:0;min-width:0;overflow:visible;pointer-events:none}
.chat-header{display:flex;align-items:center;gap:10px;flex:none;padding:8px 10px 8px 14px;border:1px solid var(--border);border-radius:20px;background:rgba(28,43,45,.4);backdrop-filter:blur(14px);pointer-events:auto}
.chat-status{min-width:0}.chat-header strong{font-size:14px}.chat-header span{font-size:11px;line-height:1.35;color:var(--muted)}
.status-dot{width:7px;height:7px;flex:0 0 7px;background:#b6ccba;border-radius:50%}
.messages{margin-top:auto;flex:0 1 auto;max-height:58%;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:10px;padding:18px 4px 14px;scrollbar-width:thin;scrollbar-color:rgba(225,229,215,.4) transparent;overscroll-behavior:contain;pointer-events:auto}
.message{max-width:87%;flex:none;min-width:0}.ari-message{align-self:flex-start}.user-message{align-self:flex-end}
.bubble{padding:11px 14px;border:1px solid var(--border);border-radius:17px 17px 17px 5px;background:rgba(29,47,51,.58);backdrop-filter:blur(12px);color:var(--text);font-size:14px;line-height:1.55;overflow-wrap:anywhere;box-shadow:0 3px 15px rgba(16,25,26,.07)}
.user-message .bubble{background:rgba(107,103,80,.56);border-radius:17px 17px 5px 17px;border-color:rgba(226,209,175,.33)}
.messages:empty{padding:0}.message-paragraph{margin:0}.message-paragraph+.message-paragraph{margin-top:10px}.message-section{font-size:13px;font-weight:600;color:var(--gold);margin:12px 0 7px}.message-quote{margin:8px 0;padding:5px 10px;border-left:2px solid var(--gold-soft);color:var(--muted)}.message-list{margin:8px 0;padding-left:20px}.message-list li{margin:5px 0}.message-spacer{height:8px}
.emoji-only{background:transparent!important;border:0!important;padding:4px 6px!important;font-size:32px;backdrop-filter:none;box-shadow:none}
.ari-sticker{display:block;max-width:min(140px,32vw)!important;width:140px!important;height:auto}.sticker-message{max-width:none}
#typing-indicator .bubble{font-size:12px;color:var(--muted);padding:8px 12px}
.chat-input{display:flex;align-items:flex-end;gap:8px;flex:none;padding:8px;border:1px solid var(--border);border-radius:22px;background:rgba(30,45,47,.56);backdrop-filter:blur(18px);pointer-events:auto;box-shadow:0 6px 25px rgba(18,28,29,.1)}
.chat-input textarea{width:0;flex:1;min-height:42px;max-height:112px;padding:11px 4px;border:0;outline:none;color:var(--text);background:transparent;resize:none;overflow-y:auto;font-size:14px;line-height:20px}.chat-input textarea::placeholder{color:#d0d4ce}.chat-input:focus-within{border-color:var(--gold)}
.send-button{width:42px;height:42px;flex:0 0 42px;border:0;border-radius:15px;background:var(--gold);color:#2d3a38;font-size:19px}
.emoji-wrapper{position:relative;flex:none}.emoji-button{width:42px;height:42px;border:0;border-radius:14px;background:transparent;font-size:20px}
.emoji-panel{position:absolute;bottom:54px;left:0;width:210px;padding:9px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;border:1px solid var(--border);border-radius:16px;background:rgba(29,44,47,.94);backdrop-filter:blur(18px);z-index:8}.emoji-panel button{height:40px;border:0;border-radius:9px;background:transparent;font-size:21px}.emoji-panel button:hover{background:rgba(255,255,255,.1)}.hidden{display:none!important}
/* ---------- Ari auth ---------- */

.chat-header {
    position: relative;
}

.chat-status {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.auth-button {
    margin-left: auto;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.06);
    color: inherit;
    border-radius: 999px;
    padding: 7px 13px;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
    transition: .2s ease;
}

.auth-button:hover {
    background: rgba(255,255,255,.12);
}

.auth-button.authenticated {
    cursor: default;
    opacity: .8;
}

.auth-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.auth-modal.hidden {
    display: none;
}

.auth-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.66);
    backdrop-filter: blur(8px);
}

.auth-card {
    position: relative;
    z-index: 1;
    width: min(100%, 390px);
    padding: 28px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 24px;
    background: rgba(18,18,22,.96);
    box-shadow: 0 25px 80px rgba(0,0,0,.45);
}

.auth-close {
    position: absolute;
    top: 10px;
    right: 14px;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,.65);
    font-size: 28px;
    cursor: pointer;
}

.auth-title {
    padding-right: 25px;
    font-size: 21px;
    font-weight: 700;
    margin-bottom: 7px;
}

.auth-subtitle {
    font-size: 14px;
    line-height: 1.45;
    opacity: .65;
    margin-bottom: 22px;
}

.auth-input {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    background: rgba(255,255,255,.06);
    color: #fff;
    padding: 13px 15px;
    outline: none;
    font: inherit;
    margin-bottom: 11px;
}

.auth-input:focus {
    border-color: rgba(255,255,255,.35);
}

.auth-code-input {
    text-align: center;
    letter-spacing: .35em;
    font-size: 22px;
    font-weight: 600;
}

.auth-primary,
.auth-secondary {
    box-sizing: border-box;
    width: 100%;
    border-radius: 14px;
    padding: 12px 14px;
    font: inherit;
    cursor: pointer;
}

.auth-primary {
    border: 0;
    background: #fff;
    color: #111;
    font-weight: 600;
}

.auth-primary:disabled {
    opacity: .55;
    cursor: wait;
}

.auth-secondary {
    margin-top: 8px;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,.6);
}

.auth-code-hint {
    font-size: 13px;
    line-height: 1.45;
    opacity: .72;
    margin-bottom: 13px;
}

.auth-message {
    min-height: 20px;
    margin-top: 12px;
    font-size: 13px;
    opacity: .65;
    text-align: center;
}

.auth-message.error {
    opacity: 1;
}

body.auth-open {
    overflow: hidden;
}

@media (max-width: 600px) {
    .auth-card {
        padding: 24px 20px;
        border-radius: 20px;
    }

    .auth-button {
        padding: 6px 10px;
        font-size: 12px;
    }
}


.auth-backdrop{background:rgba(15,22,24,.45)}
.auth-card{background:rgba(31,40,43,.92);border-color:var(--border);max-height:calc(100dvh - 32px);overflow-y:auto}
.auth-subtitle,.auth-code-hint,.auth-message{opacity:1;color:var(--muted)}
.auth-primary{background:var(--gold);color:#253332}
.auth-message.error{color:#ffbbae}
.auth-button{min-height:40px;margin-left:auto;white-space:nowrap}

@media(max-width:600px){.scene-layer{background:#49382b}.scene-layer img{position:absolute;bottom:0;height:calc(100% - 110px);object-position:43% center;mask-image:linear-gradient(to bottom,transparent,#000 12%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 12%)}}