/* XiXChat Web R — interaction and visual refresh */
:root{
  --bg:#eef5ff;--surface:rgba(255,255,255,.86);--surface-solid:#fff;--surface-2:#f0f5fc;
  --surface-hover:#e8f1ff;--line:rgba(40,74,118,.11);--text:#12233e;--muted:#6c7d95;
  --blue:#1677ff;--cyan:#18bde5;--indigo:#6558ff;--shadow:0 28px 80px rgba(47,86,133,.14);
  --small-shadow:0 10px 34px rgba(47,86,133,.09);--radius-xl:32px;--radius-lg:24px;
}
html[data-theme="dark"]{--bg:#07111f;--surface:rgba(13,27,45,.88);--surface-solid:#0e1c2e;--surface-2:#142840;--surface-hover:#19344f;--line:rgba(191,218,255,.11);--text:#f2f7ff;--muted:#91a5bd;--shadow:0 30px 90px rgba(0,0,0,.42);--small-shadow:0 12px 34px rgba(0,0,0,.26)}
@media(prefers-color-scheme:dark){html[data-theme="system"]{--bg:#07111f;--surface:rgba(13,27,45,.88);--surface-solid:#0e1c2e;--surface-2:#142840;--surface-hover:#19344f;--line:rgba(191,218,255,.11);--text:#f2f7ff;--muted:#91a5bd;--shadow:0 30px 90px rgba(0,0,0,.42);--small-shadow:0 12px 34px rgba(0,0,0,.26)}}
html,body{width:100%;height:100%;overscroll-behavior:none}body{background:radial-gradient(circle at 7% 4%,rgba(34,186,255,.12),transparent 27%),radial-gradient(circle at 93% 96%,rgba(101,88,255,.11),transparent 30%),var(--bg)}
button,.list-row,.nav-button,.icon-button{-webkit-tap-highlight-color:transparent}.button{min-height:42px;border:1px solid transparent;letter-spacing:.01em}.button:not(.primary):not(.danger){border-color:var(--line)}.button.primary{box-shadow:0 13px 32px rgba(22,119,255,.24)}
.input,.textarea,.select{min-height:48px;border-radius:16px;background:color-mix(in srgb,var(--surface-solid) 94%,var(--blue) 6%);font-size:16px}.secret-input{font-family:ui-rounded,"SF Pro Rounded",system-ui,sans-serif;letter-spacing:.02em;caret-color:var(--blue)}
.card{border-color:color-mix(in srgb,var(--line) 75%,white 25%);box-shadow:0 14px 40px rgba(44,83,128,.075);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.page-inner>.card:hover{border-color:rgba(22,119,255,.17);box-shadow:0 18px 48px rgba(44,83,128,.1)}
.auth-shell{min-height:min(660px,calc(100dvh - 32px));border:1px solid rgba(255,255,255,.55);box-shadow:0 40px 120px rgba(36,77,127,.2)}.auth-art{isolation:isolate;background:linear-gradient(145deg,#0f7bff 0%,#386fff 45%,#6859ff 100%)}.auth-art:before{content:"";position:absolute;width:360px;height:360px;right:-150px;top:-130px;border-radius:50%;background:rgba(255,255,255,.16);filter:blur(2px);z-index:-1}.auth-art:after{z-index:-1;pointer-events:none}.auth-art>div,.auth-art>small{position:relative;z-index:1}.auth-main{overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.auth-main>.brand-logo{display:none}.auth-submit{width:100%;margin-top:14px;min-height:50px;border-radius:17px}.auth-divider{display:flex;align-items:center;gap:12px;margin:19px 0;color:var(--muted);font-size:12px}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}.qr-login-button{width:100%;padding:12px;text-align:left;justify-content:flex-start;background:linear-gradient(135deg,rgba(22,119,255,.08),rgba(24,189,229,.06));border-color:rgba(22,119,255,.13)!important}.qr-login-button>span:nth-child(2){display:grid;gap:2px;flex:1}.qr-login-button small{color:var(--muted);font-weight:550}.qr-login-button>i{font-size:22px;color:var(--muted)}.qr-button-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:white;font-size:25px}
.qr-login-panel{text-align:center;display:grid;justify-items:center;gap:10px;padding:4px 0}.qr-login-panel h3{margin:7px 0 0;font-size:22px}.qr-orbit{width:104px;height:104px;border-radius:32px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(22,119,255,.14),rgba(101,88,255,.12));color:var(--blue);font-size:42px;animation:qr-breathe 1.4s ease-in-out infinite}.qr-orbit.error{color:var(--red);animation:none}.qr-image-shell{position:relative;width:236px;height:236px;padding:14px;border-radius:32px;background:white;box-shadow:0 20px 55px rgba(32,77,126,.18)}.login-qr{width:100%;height:100%;display:block;border-radius:18px;image-rendering:pixelated}.qr-image-shell>i{position:absolute;inset:-7px;border:2px solid rgba(22,119,255,.2);border-radius:37px;pointer-events:none}.qr-status{display:flex;align-items:center;gap:8px;margin:0;color:var(--muted);font-weight:700}.qr-status>span{width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 5px rgba(239,154,56,.12);animation:status-pulse 1.1s infinite}.qr-status.scanned{color:var(--green)}.qr-status.scanned>span{background:var(--green);box-shadow:0 0 0 5px rgba(25,184,120,.12)}.qr-steps{text-align:left;margin:4px 0;padding-left:24px;color:var(--muted);font-size:13px;line-height:1.8}.security-note{padding:9px 12px;border-radius:12px;background:rgba(25,184,120,.09);color:var(--green);font-size:12px;font-weight:650}
.app-shell{grid-template-columns:84px 360px minmax(0,1fr);background:transparent}.rail{margin:12px 0 12px 12px;border:1px solid var(--line);border-radius:27px;background:var(--surface);box-shadow:var(--small-shadow);backdrop-filter:blur(24px)}.nav-button{transition:transform .18s ease,background .18s ease,color .18s ease}.nav-button:hover{transform:translateY(-2px)}.nav-button.active{background:linear-gradient(145deg,rgba(22,119,255,.16),rgba(24,189,229,.09));box-shadow:inset 0 0 0 1px rgba(22,119,255,.08)}
.sidebar{margin:12px 0 12px 12px;border:1px solid var(--line);border-radius:27px 0 0 27px;overflow:hidden;box-shadow:var(--small-shadow);backdrop-filter:blur(24px)}.sidebar-head{padding:24px 18px 13px}.sidebar-title{font-size:29px}.sidebar-scroll{scrollbar-width:thin;overscroll-behavior:contain}.list-row{min-height:68px;padding:10px 12px;border:1px solid transparent;transition:background .18s ease,border-color .18s ease,transform .18s ease}.list-row:hover{transform:translateX(2px)}.list-row.active{background:linear-gradient(135deg,rgba(22,119,255,.12),rgba(24,189,229,.06));border-color:rgba(22,119,255,.1)}
.content{margin:12px 12px 12px 0;border:1px solid var(--line);border-left:0;border-radius:0 27px 27px 0;overflow:hidden;box-shadow:var(--small-shadow);background:color-mix(in srgb,var(--surface) 72%,transparent);backdrop-filter:blur(24px)}
.chat-head{height:78px;padding:11px 18px;background:color-mix(in srgb,var(--surface-solid) 89%,transparent);backdrop-filter:blur(22px)}.chat-head .avatar{width:46px;height:46px}.chat-scroll{height:0;min-height:0;flex:1 1 0;overflow-y:auto!important;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding:24px;background:radial-gradient(circle at 20% 8%,rgba(22,119,255,.045),transparent 25%),linear-gradient(180deg,color-mix(in srgb,var(--bg) 42%,transparent),transparent)}.message-list{min-height:100%;justify-content:flex-end;padding-top:18px}.message-line{flex:0 0 auto}.bubble{padding:10px 14px;border:1px solid rgba(45,79,118,.07);box-shadow:0 6px 20px rgba(42,76,116,.07)}.mine .bubble{border:0;background:linear-gradient(135deg,#197fff,#2da9f6);box-shadow:0 8px 22px rgba(25,127,255,.2)}.message-time{opacity:.82}.composer{position:relative;z-index:3;padding:10px 14px calc(10px + var(--safe-bottom));background:color-mix(in srgb,var(--surface-solid) 92%,transparent);backdrop-filter:blur(26px)}.composer-tools{overflow-x:auto;scrollbar-width:none;padding:1px}.composer-tools::-webkit-scrollbar{display:none}.icon-button{flex:0 0 39px;border:1px solid var(--line);background:var(--surface-2);transition:transform .16s ease,background .16s ease}.icon-button:active{transform:scale(.92)}.composer-row .textarea{resize:none;min-height:46px;max-height:118px;border-radius:18px}.composer-row .button{min-height:46px;border-radius:16px}.typing-bubble{box-shadow:none}
.page{padding:28px;scrollbar-width:thin;overscroll-behavior:contain}.page-inner{max-width:1040px;gap:18px}.page-inner h1,.page-inner h2,.page-inner h3{letter-spacing:-.025em}.hero-card{position:relative;overflow:hidden;background:linear-gradient(135deg,#0d79fb,#3d71f4 55%,#6457f5)}.hero-card:after{content:"";position:absolute;width:240px;height:240px;right:-90px;top:-110px;border-radius:50%;background:rgba(255,255,255,.14);pointer-events:none}.profile-hero{padding:30px}.bill-row{padding:14px 4px}.pill{font-weight:650}.route-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,rgba(22,119,255,.13),rgba(101,88,255,.09));font-size:20px}
.overlay{background:rgba(4,13,26,.48);backdrop-filter:blur(18px)}.dialog{border-radius:30px;padding:26px}.toast{backdrop-filter:blur(18px)}
@keyframes qr-breathe{50%{transform:scale(1.04);box-shadow:0 18px 44px rgba(22,119,255,.15)}}@keyframes status-pulse{50%{opacity:.45;transform:scale(.78)}}
@media(max-width:1020px){.app-shell{grid-template-columns:76px 310px minmax(0,1fr)}.rail{margin-left:8px}.sidebar{margin-left:8px}.content{margin-right:8px}}
@media(max-width:720px){
  body:before,body:after{opacity:.11}.app-shell{height:100dvh;display:flex;padding:0}.rail{margin:0;border-radius:0;border:0;border-top:1px solid var(--line);box-shadow:0 -8px 28px rgba(37,70,110,.08);background:color-mix(in srgb,var(--surface-solid) 92%,transparent);backdrop-filter:blur(28px);transition:transform .24s ease,opacity .2s ease}.sidebar{margin:0;border:0;border-radius:0;padding-bottom:calc(72px + var(--safe-bottom));box-shadow:none}.content{margin:0;border:0;border-radius:0;box-shadow:none;background:var(--bg);height:auto;min-height:0}.content.mobile-open{display:flex}.chat-active .rail{transform:translateY(110%);opacity:0;pointer-events:none}.chat-active .content{inset:0!important;height:100dvh;transform:none}.chat-head{height:calc(66px + var(--safe-top));padding:calc(8px + var(--safe-top)) 11px 8px}.chat-scroll{height:0;padding:12px 9px 18px;scrollbar-gutter:auto}.message-list{padding-top:12px;gap:7px;justify-content:flex-end}.message-wrap{max-width:82%}.bubble{font-size:15px;border-radius:19px 19px 19px 6px}.mine .bubble{border-radius:19px 19px 6px 19px}.composer{padding:8px 9px calc(8px + var(--safe-bottom))}.composer-tools{gap:6px;margin-bottom:6px}.composer-row{gap:7px}.composer-row .button{padding:10px 13px}.page{padding:14px 11px calc(88px + var(--safe-bottom))}.chat-active .page{padding-bottom:14px}.card{border-radius:20px;padding:16px}.auth-main{padding:24px 21px calc(22px + var(--safe-bottom));justify-content:flex-start;overflow-x:hidden;overflow-y:auto}.auth-tabs{margin:17px 0}.auth-main .brand-logo.large{width:70px;height:70px;border-radius:22px}.qr-image-shell{width:min(218px,58vw);height:min(218px,58vw);border-radius:28px}.qr-steps{font-size:12px}.dialog{width:min(94vw,650px);border-radius:24px;padding:20px}.toast-stack{left:12px;right:12px;bottom:calc(18px + var(--safe-bottom))}.toast{text-align:center}.profile-hero{padding:24px 16px}
}
.message-list{justify-content:flex-start}
.message-list:before{content:"";flex:1 1 0;min-height:0}.row-chevron{color:var(--muted);font-size:22px;font-weight:400}