:root{--ink:#20241f;--muted:#858982;--line:#ecece8;--paper:#fff;--canvas:#f7f7f4;--green:#c5e5b5;--green-ink:#385a32;--shadow:0 20px 70px #1720171c}*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font:14px 'DM Sans',sans-serif}button,input{font:inherit}button{cursor:pointer;border:0;color:inherit}.hidden{display:none!important}.app{max-width:1440px;height:100dvh;margin:auto;padding:18px;display:grid;grid-template-columns:240px minmax(440px,1fr) 275px;gap:16px}.panel{background:#fff;border:1px solid #edeee9;border-radius:19px}.sidebar{padding:20px 14px 12px;display:flex;flex-direction:column;min-height:0}.brand{font:800 23px Manrope,sans-serif;letter-spacing:-1.2px;display:flex;align-items:center;gap:8px;padding:0 7px 21px}.brand-icon{width:28px;height:28px;border-radius:9px;background:#d9edcf;color:#41663c;display:grid;place-items:center;font-size:17px}.nav{height:40px;border-radius:11px;padding:0 11px;display:flex;align-items:center;gap:10px;color:#757a72;font-weight:600}.nav.active{background:#f2f7ef;color:#41643c}.nav span{font-size:12px}.side-head{margin:24px 7px 8px;display:flex;justify-content:space-between;align-items:center;text-transform:uppercase;letter-spacing:1px;font-weight:700;font-size:10px;color:#9b9f97}.small-icon{width:32px;height:32px;border-radius:9px;background:#f7f8f4;color:#74796f;font-size:15px}.side-head .small-icon{height:25px;width:25px}.conversation-list,.people-list{display:grid;gap:3px;overflow:auto}.person-row,.conv-row{display:flex;gap:9px;align-items:center;background:none;text-align:left;padding:8px;border-radius:11px;min-width:0}.person-row:hover,.conv-row:hover,.conv-row.active{background:#f5f7f2}.avatar{width:37px;height:37px;border-radius:50%;flex:none;display:grid;place-items:center;background:linear-gradient(145deg,#e7b49a,#b57669);color:white;font-weight:700;font-size:11px}.avatar.c2{background:linear-gradient(145deg,#a9c7bb,#64887d)}.avatar.c3{background:linear-gradient(145deg,#d6b5e2,#916ca1)}.avatar.c4{background:linear-gradient(145deg,#e9d599,#b68c4e)}.avatar.c5{background:linear-gradient(145deg,#a7b3d6,#6675a3)}.row-copy{min-width:0;flex:1}.row-top{display:flex;justify-content:space-between;gap:4px;font-size:11px}.row-top strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-time{font-size:9px;color:#a0a49d;white-space:nowrap}.row-sub{font-size:10px;color:#92968f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}.small-muted{font-size:9px;text-transform:none;letter-spacing:0}.people-head{margin-top:19px}.people-list{max-height:34%;}.account{display:flex;align-items:center;gap:9px;border-top:1px solid var(--line);padding:13px 4px 2px;margin-top:auto}.user-avatar{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;background:#e4dfce;color:#5d624e;font-weight:700;font-size:11px}.account-copy{display:grid;gap:3px;min-width:0;flex:1}.account-copy strong{font-size:11px}.account-copy span{font-size:9px;color:#969a92}.chat{display:flex;flex-direction:column;min-height:0;overflow:hidden}.chat-header{height:68px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 19px;gap:10px;flex:none}.contact-avatar{width:39px;height:39px}.header-copy{display:grid;gap:4px}.header-copy strong{font-size:12px}.header-copy span{font-size:10px;color:#959990}.header-actions{margin-left:auto;display:flex;gap:8px;align-items:center}.tip-button{border:1px solid #e5e9df;background:#f8faf6;padding:8px 11px;border-radius:9px;color:#52674c;font-size:10px;font-weight:700}.tip-button:disabled{opacity:.45;cursor:default}.messages{flex:1;overflow:auto;display:flex;flex-direction:column;gap:14px;padding:21px 22px}.day-divider{text-align:center;font-size:9px;letter-spacing:.7px;color:#a0a49b;margin:2px 0 3px}.message{max-width:79%;display:flex;gap:7px;align-items:flex-end}.message.mine{align-self:flex-end;flex-direction:row-reverse}.mini-avatar{width:22px;height:22px;border-radius:50%;background:#d7b39e;color:#fff;font-size:8px;display:grid;place-items:center;flex:none}.bubble{background:#f2f3ef;border-radius:14px 14px 14px 4px;padding:10px 13px;line-height:1.48;font-size:12px;overflow-wrap:anywhere}.mine .bubble{background:#e9f3e4;border-radius:14px 14px 4px 14px}.stamp{font-size:9px;color:#a0a49d;margin-top:4px}.mine .stamp{text-align:right}.content-card{width:min(305px,80vw);border:1px solid #ecece6;border-radius:14px;overflow:hidden;background:#fff}.media-preview{width:100%;height:148px;background:linear-gradient(145deg,#e6d3bf,#eee7dc 50%,#a5b199);display:grid;place-items:center;color:#fff;font-size:26px;object-fit:cover}.media-preview.video{background:linear-gradient(145deg,#c8beca,#eee1d9 50%,#989e9a)}.content-info{padding:11px 12px}.content-title{font-weight:700;font-size:11px}.content-meta{font-size:9px;color:#989c94;margin-top:4px}.unlock{margin-top:10px;width:100%;height:34px;background:#c5e5b5;color:#385a32;font-size:10px;font-weight:700;border-radius:9px}.unlocked{font-size:10px;color:#507648;font-weight:700;margin-top:9px}.composer-wrap{border-top:1px solid var(--line);padding:13px 16px 15px}.composer{min-height:48px;border:1px solid #e8eae4;border-radius:13px;display:flex;align-items:center;padding:5px 6px 5px 8px;gap:5px}.composer input{border:0;outline:0;min-width:0;flex:1;padding:0 5px;font-size:12px}.composer input::placeholder{color:#adb0aa}.composer input:disabled{background:white}.compose-action{width:33px;height:33px;border-radius:9px;background:none;color:#71786e;font-size:19px}.compose-action:hover{background:#f2f4ef}.send{height:34px;width:38px;border-radius:9px;background:#c5e5b5;color:#385a32;font-weight:700;font-size:16px}.send:disabled{opacity:.5}.composer-note{font-size:9px;color:#a0a49b;margin:8px 3px 0}.details{padding:21px 16px;display:flex;flex-direction:column;min-height:0}.details-person{text-align:center;border-bottom:1px solid var(--line);padding:7px 3px 17px}.large{width:65px;height:65px;font-size:16px;margin:0 auto 10px}.details-person h2{font:700 15px Manrope;margin:0 0 4px}.handle{font-size:10px;color:#969a92}.details-person p{font-size:10px;line-height:1.55;color:#777d74;margin:11px 5px}.privacy-tag{font-size:9px;color:#55744c;background:#f2f7ef;border-radius:20px;padding:5px 9px}.details-section{padding-top:16px;overflow:auto}.details-section h3{font:700 11px Manrope;margin:0 1px 11px}.content-list{display:grid;gap:7px}.content-row{display:flex;align-items:center;gap:9px;padding:8px;border:1px solid var(--line);border-radius:10px}.content-thumb{width:42px;height:41px;border-radius:7px;background:linear-gradient(145deg,#d9c3b0,#aab29c);display:grid;place-items:center;color:white;flex:none}.content-thumb.video{background:linear-gradient(145deg,#cbbdcd,#a1a1a1)}.content-row-copy{min-width:0;flex:1}.content-row-copy b{font-size:9px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content-row-copy span{font-size:9px;color:#92968e;display:block;margin-top:4px}.empty-mini{font-size:10px;color:#a0a49b;padding:10px 2px}.payment-info{margin-top:auto;background:#f7f8f4;padding:12px;border-radius:11px}.payment-title{font-size:10px;font-weight:700}.payment-info p{font-size:9px;color:#8e938a;line-height:1.5;margin:6px 0 0}.empty{margin:auto;text-align:center;color:#6f756d;padding:25px}.empty-icon{width:54px;height:54px;border-radius:18px;background:#eaf3e4;color:#557a49;display:grid;place-items:center;font-size:28px;margin:0 auto 15px}.empty h2{font:700 17px Manrope;color:#333930;margin:0 0 7px}.empty p{font-size:11px;color:#8d9289}.auth-shell{min-height:100dvh;display:grid;place-items:center;padding:20px}.auth-card{width:min(390px,100%);background:white;border:1px solid #ededeb;border-radius:20px;padding:25px;box-shadow:0 18px 60px #1d23150a}.auth-card .brand{justify-content:center;font-size:27px;padding:0 0 21px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;background:#f4f5f1;border-radius:11px}.tab{height:34px;border-radius:8px;background:none;color:#7e837a;font-size:11px;font-weight:600}.tab.active{background:#fff;color:#34412f;box-shadow:0 1px 4px #1a211212}.auth-note{text-align:center;font-size:11px;color:#8c9188;margin:13px 0 21px}.auth-card label,.modal form>label:not(.dropzone){display:grid;gap:6px;font-size:10px;font-weight:700;color:#42483f;margin:12px 0}.auth-card input,.modal input:not([type=file]){height:40px;border:1px solid #e7e9e3;border-radius:9px;padding:0 11px;outline:none;font-size:11px}.auth-card input:focus,.modal input:focus{border-color:#a9ca9a}.primary{height:41px;border-radius:10px;background:#c5e5b5;color:#375a31;font-size:11px;font-weight:700;margin-top:10px}.wide{width:100%}.auth-foot{text-align:center;font-size:9px;color:#a0a49c;margin-top:17px}.form-error{min-height:16px;text-align:center;color:#b5483f;font-size:10px;margin-top:9px}.overlay{position:fixed;inset:0;background:#18201855;z-index:5;display:none;place-items:center;padding:15px}.overlay.open{display:grid}.modal{width:min(420px,100%);background:white;border-radius:17px;padding:21px;box-shadow:var(--shadow)}.modal header{display:flex;justify-content:space-between;gap:10px;margin-bottom:16px}.modal h2{font:700 16px Manrope;margin:0 0 5px}.modal header p{font-size:10px;color:#8b9087;margin:0}.close{width:28px;height:28px;border-radius:8px;background:#f2f3ef;color:#777;font-size:17px;flex:none}.modal form>label:not(.dropzone){margin-top:12px}.dropzone{border:1px dashed #d4d9cf;border-radius:11px;background:#fbfcfa;padding:15px;display:grid;gap:5px;text-align:center;cursor:pointer}.dropzone b{font-size:11px;color:#465140}.dropzone span{font-size:9px;color:#92978d}.dropzone input{display:none}.media-name{font-size:9px;color:#5e7e52;margin-top:7px}.demo-hint{text-align:center;color:#969a92;font-size:9px}.toast{position:fixed;bottom:20px;left:50%;z-index:10;transform:translate(-50%,12px);background:#252c24;color:white;padding:11px 15px;border-radius:10px;font-size:11px;opacity:0;transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.app{grid-template-columns:220px minmax(410px,1fr);max-width:900px}.details{display:none}}
@media(max-width:650px){.app{height:100dvh;padding:0;display:block}.sidebar{display:none}.chat{height:100dvh;border:0;border-radius:0}.chat-header{height:62px;padding:0 12px}.messages{padding:17px 12px}.composer-wrap{padding:10px 11px max(12px,env(safe-area-inset-bottom))}.composer-note{display:none}.header-actions .small-icon{display:none}.tip-button{padding:7px 8px}.auth-card{padding:21px}.message{max-width:90%}}

.mobile-menu{display:none}@media(max-width:650px){.mobile-menu{display:grid;place-items:center}.app.menu-open:before{content:'';position:fixed;inset:0;background:#17201766;z-index:6}.app.menu-open .sidebar{display:flex;position:fixed;z-index:7;inset:10px 18% 10px 10px;box-shadow:var(--shadow);border-radius:16px}.app.menu-open .people-list{max-height:40%}}


/* Brisa visual identity: obsidian, violet neon, cool lilac and a restrained gold accent. */
:root{--ink:#f3efff;--muted:#aaa3c1;--line:#29243a;--paper:#100e18;--canvas:#08070d;--green:#a955ff;--green-ink:#e3c7ff;--shadow:0 24px 80px #000b,0 0 36px #772cff14;color-scheme:dark}
body{background:radial-gradient(ellipse at 50% -25%,#28123f 0,transparent 43%),var(--canvas);color:var(--ink);font-family:Inter,'Segoe UI',system-ui,sans-serif}
.panel,.auth-card,.modal{background:linear-gradient(155deg,#15121f 0%,#0d0b13 100%);border-color:#302843;box-shadow:0 12px 40px #0005}
.app{max-width:1500px;padding:16px;gap:14px}
.brand{color:#f5f0ff;letter-spacing:-1px}.brand-icon{background:linear-gradient(145deg,#b34cff,#6b24ff 72%);color:#fff;box-shadow:0 0 22px #852cff73;border:1px solid #d49aff55}
.nav{color:#aaa2c0}.nav.active{background:linear-gradient(100deg,#5420a833,#8d2dff22);color:#e3c3ff;box-shadow:inset 2px 0 #a83dff}.side-head{color:#9e96b5}.small-icon{background:#1c1927;color:#c7bde3;border:1px solid #332b44}.small-icon:hover{background:#2b2140;color:#fff;border-color:#8751d2}
.person-row:hover,.conv-row:hover,.conv-row.active{background:#211a30}.row-time,.row-sub,.account-copy span,.header-copy span{color:#9e96b4}.avatar{box-shadow:0 0 0 2px #171320}.avatar.c2{background:linear-gradient(145deg,#59c7c0,#4651a5)}.avatar.c3{background:linear-gradient(145deg,#db74ff,#7640c9)}.avatar.c4{background:linear-gradient(145deg,#e5bf69,#99682a)}.avatar.c5{background:linear-gradient(145deg,#8e9aff,#514eaf)}.user-avatar{background:linear-gradient(145deg,#352640,#211c30);color:#e4c8ff;border:1px solid #49345d}.account{border-color:var(--line)}
.chat-header{border-color:var(--line)}.tip-button{border:1px solid #7440a8;background:#231631;color:#dfb8ff}.tip-button:hover:not(:disabled){background:#41205d;box-shadow:0 0 20px #973aff44}.messages{background:radial-gradient(ellipse at 50% 0,#25163726,transparent 58%)}.day-divider{color:#9288a7}.mini-avatar{background:#292037;color:#d7c1f3}.bubble{background:#201b2c;border:1px solid #332a44;color:#f1ebfa;box-shadow:0 5px 16px #0002}.mine .bubble{background:linear-gradient(135deg,#6924a3,#4822a0);border-color:#8b45d0;color:white}.stamp{color:#b8a9cf}
.content-card{background:linear-gradient(145deg,#191421,#100d17);border:1px solid #49355d;box-shadow:0 8px 30px #0004}.content-title{color:#f5efff}.content-meta,.content-info{color:#aaa1bd}.media-preview,.content-thumb{background:linear-gradient(135deg,#261735,#13101c);border-color:#403051}.unlock{background:linear-gradient(110deg,#7826bd,#5c32d4);color:#fff;box-shadow:0 0 18px #862aff35}.unlock:hover{filter:brightness(1.15)}.unlocked{color:#94e4b6}.composer-wrap{background:#100e18;border-top:1px solid var(--line)}.composer{background:#191522;border:1px solid #383047;border-radius:15px}.composer:focus-within{border-color:#9d4be2;box-shadow:0 0 0 3px #922dff1c}.composer input{color:#f4efff}.composer input::placeholder{color:#8f87a4}.compose-action{color:#d4a2ff}.send,.primary{background:linear-gradient(135deg,#a633ef,#6333e8);color:#fff;box-shadow:0 5px 20px #812bdb4a}.send:hover,.primary:hover{filter:brightness(1.12);transform:translateY(-1px)}.composer-note{color:#958ba8}.details-person{border-bottom:1px solid var(--line)}.details-person p{color:#aaa2bb}.privacy-tag{background:#15271f;color:#a7edc1;border:1px solid #264b37}.handle{color:#ad9dbf}.details-section h3,.content-row-copy{color:#e9e1f3}.empty h2{color:#f3ecfb}.empty p,.empty-mini{color:#a29ab4}.empty-icon{color:#ba71ff;background:#271631;box-shadow:0 0 32px #812cff21}.payment-info{background:#171321;border:1px solid #332b43;border-radius:14px}.payment-title{color:#d9c0f1}.payment-info p,.demo-hint{color:#a49ab7}.auth-shell{background:radial-gradient(ellipse at 50% 0,#32164d 0,transparent 45%),#08070d}.auth-card{border:1px solid #382948}.auth-note,.auth-foot{color:#a79db8}.tab{color:#a89db9}.tab.active{color:#e5c4ff;background:#271632;box-shadow:inset 0 -2px #bd51ff}.auth-card label,.modal label{color:#e3d9ee}.auth-card input,.modal input{background:#100d17;color:#f5efff;border:1px solid #3a3148}.auth-card input:focus,.modal input:focus{border-color:#a64ae8;box-shadow:0 0 0 3px #963aff1c;outline:none}.dropzone{background:#171220;border-color:#7643a2;color:#e9d8fc}.dropzone:hover{background:#21152d;border-color:#b74eff}.form-error{color:#ff8caa}.overlay{background:#05040bcc;backdrop-filter:blur(8px)}.modal header{border-bottom:1px solid var(--line)}.modal header p{color:#aaa0b8}.close{background:#241d30;color:#d8cbe9}.close:hover{background:#392447;color:white}.toast{background:#211a2c;border:1px solid #58416c;color:#f3eaff;box-shadow:var(--shadow)}
/* Gold is reserved for small creator accents, keeping the neon violet as the main signal. */
.details-person h2:after{content:'';display:block;width:28px;height:2px;margin:9px auto 0;background:linear-gradient(90deg,#a93cff,#f2c55f);border-radius:9px}
@media(max-width:650px){.app{background:var(--canvas)}.chat{background:#100e18}.app.menu-open:before{background:#05040bcc}.app.menu-open .sidebar{background:#12101a;border-color:#3a2c4a}.chat-header{background:#100e18}.tip-button{font-size:10px}}

/* Mobile-first navigation: familiar chat list, clear contacts tab, and simple chat back button. */
@media(max-width:650px){
  body{background:#08070d}.app{height:100dvh;min-height:100dvh;padding:0;display:block;max-width:none;overflow:hidden;background:#08070d}
  .sidebar{display:flex;position:fixed;inset:0;z-index:2;height:100dvh;min-height:0;padding:calc(10px + env(safe-area-inset-top)) 14px calc(76px + env(safe-area-inset-bottom));border:0;border-radius:0;background:#0d0b13;box-shadow:none;overflow:hidden}
  .sidebar>.brand{min-height:50px;padding:4px 4px 12px;font-size:25px}.sidebar>.brand:after{content:'+';margin-left:auto;width:39px;height:39px;display:grid;place-items:center;border-radius:50%;font:400 26px system-ui;background:#6025a6;color:#fff;box-shadow:0 0 18px #8f32ff42}
  .sidebar>.nav{display:none}.side-head{display:flex;margin:8px 4px;padding:8px 0 6px;font-size:12px;letter-spacing:.5px;text-transform:none;color:#f3efff}.side-head .small-icon{width:36px;height:36px;border-radius:50%;font-size:21px;background:#21152d;border-color:#553271;color:#dcafff}.side-head.people-head{margin-top:8px}
  .conversation-list,.people-list{overflow:auto;gap:1px}.conv-row,.person-row{padding:11px 6px;min-height:68px;border-radius:12px;border-bottom:1px solid #211c2c}.avatar{width:46px;height:46px}.row-top{font-size:13px}.row-sub{font-size:11px}.row-time{font-size:10px}
  .app.contacts-only .side-head:not(.people-head),.app.contacts-only .conversation-list{display:none}.app.messages-only .people-head,.app.messages-only .people-list{display:none}
  .account{display:none}.mobile-bottom{position:fixed;z-index:5;left:0;right:0;bottom:0;height:calc(64px + env(safe-area-inset-bottom));padding:5px 12px env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(3,1fr);background:#100d17;border-top:1px solid #2b2339}.mobile-bottom button{display:grid;place-content:center;justify-items:center;gap:3px;background:transparent;color:#988da9;font-size:10px;font-weight:600}.mobile-bottom button span{font-size:19px;line-height:20px}.mobile-bottom button.selected{color:#d6a4ff}.mobile-bottom button.selected span{color:#bd5cff;text-shadow:0 0 14px #9e35ff}
  .chat{display:none;position:fixed;inset:0;height:100dvh;min-height:0;z-index:4;border:0;border-radius:0;background:#0e0c14;overflow:hidden}.app.chat-open .sidebar,.app.chat-open .mobile-bottom{display:none}.app.chat-open .chat{display:flex}
  .chat-header{height:calc(58px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 12px 0;background:#100d17;border-bottom:1px solid #2c2438}.mobile-menu{display:grid;place-items:center;width:36px;height:36px;background:transparent;border:0;color:#dec0fa;font-size:32px;line-height:1}.contact-avatar{width:38px;height:38px}.header-copy strong{font-size:13px}.header-copy span{font-size:10px}.header-actions{gap:5px}.tip-button{padding:8px 9px;font-size:10px}.messages{flex:1;min-height:0;padding:15px 12px;gap:11px}.message{max-width:88%}.bubble{font-size:14px;padding:10px 12px}.composer-wrap{padding:9px 10px max(11px,env(safe-area-inset-bottom));background:#100d17}.composer{min-height:48px}.composer input{font-size:14px}.composer-note{display:none}.details{display:none}.app.menu-open:before{display:none}
}

@media(max-width:650px){.sidebar>.brand:after{display:none}.mobile-bottom{grid-template-columns:repeat(2,1fr)}}

@media(max-width:650px){.sidebar>.brand{display:flex;align-items:center;gap:8px}.sidebar>.brand #newChat{display:grid;place-items:center;margin-left:auto;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#a633ef,#6333e8);border:0;color:#fff;font-size:24px;box-shadow:0 0 16px #812bdb48}.mobile-search{display:flex;align-items:center;gap:9px;min-height:46px;padding:0 13px;margin:7px 2px 12px;border:1px solid #2b2438;border-radius:14px;background:#17131f;color:#aa9bb9}.mobile-search span{font-size:22px}.mobile-search input{width:100%;border:0;outline:0;background:transparent;color:#f4efff;font:inherit;font-size:13px}.mobile-search input::placeholder{color:#91869e}}
.profile-modal{width:min(460px,100%);max-height:min(92dvh,860px);overflow:auto}.profile-modal header{position:sticky;top:-21px;background:#100d17;z-index:1;padding:3px 0 12px}.profile-photo-row{display:flex;align-items:center;gap:14px;margin:8px 0 16px}.profile-preview{width:70px;height:70px;flex:none;font-size:20px}.profile-photo-row>div:last-child{display:grid;gap:6px}.profile-photo-row small{font-size:10px;color:#a49ab7}.profile-photo-row input[type=file]{display:none}.photo-picker,.text-button{width:max-content;border:0;background:transparent;color:#d1a0f5;padding:0;font:inherit;font-size:12px;font-weight:600;cursor:pointer}.text-button{color:#a69ab8;font-size:11px}.profile-modal textarea{width:100%;resize:vertical;min-height:80px;padding:10px 11px;border-radius:9px;background:#100d17;color:#f5efff;border:1px solid #3a3148;font:inherit;font-size:12px}.profile-modal textarea:focus{outline:0;border-color:#a64ae8}.profile-link-editor{border-top:1px solid var(--line);margin-top:17px;padding-top:13px}.profile-link-editor h3,.contact-profile-modal>h3{margin:0 0 5px;font-size:13px;color:#eee4f8}.profile-link-editor p{margin:0 0 10px;font-size:10px;color:#a49ab7}.profile-link-editor form{display:grid;gap:8px}.profile-link-editor input{height:40px;border:1px solid #3a3148;border-radius:9px;padding:0 11px;background:#100d17;color:#f5efff}.profile-link-list{display:grid;gap:7px;margin-top:10px}.profile-link-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid #342b43;border-radius:10px;background:#17131f}.profile-link{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px;color:#ddb8ff;text-decoration:none;font-size:12px;font-weight:700;overflow-wrap:anywhere}.profile-link:hover{text-decoration:underline}.profile-link small{font-size:10px;color:#a89ab9;font-weight:400}.link-remove{width:28px;height:28px;border-radius:50%;background:#291d31;color:#e4c6fa;font-size:18px}.details-person .profile-links{margin:10px 0 12px}.details-person .profile-link-row{background:#15111b}.contact-profile-button{padding:0;border:0;background:transparent;border-radius:50%;flex:none}.contact-profile-button:focus-visible{outline:2px solid #ba59ff;outline-offset:2px}.contact-profile-modal{width:min(400px,100%);max-height:90dvh;overflow:auto}.contact-profile-head{display:grid;justify-items:center;text-align:center;margin:4px 0 18px}.contact-profile-head .profile-preview{width:88px;height:88px}.contact-profile-head h2{margin:10px 0 3px;font-size:18px}.contact-profile-head p{margin:10px 0 0;color:#b7adc6;font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}.contact-profile-modal .profile-link-list{margin-top:8px}
@media(max-width:650px){.mobile-bottom{grid-template-columns:repeat(4,1fr)!important}.profile-modal{width:100%;max-height:calc(100dvh - env(safe-area-inset-top) - 16px);padding:18px}.profile-modal header{top:-18px}.contact-profile-modal{width:100%;max-height:90dvh}.contact-profile-button{margin:0}.details-person .profile-link{font-size:13px}}


.upload-preview{margin:9px 0;border:1px solid #49355d;border-radius:12px;overflow:hidden;background:#100d17;max-height:220px}.upload-preview img,.upload-preview video{display:block;width:100%;max-height:220px;object-fit:contain}.upload-progress{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;margin:10px 0;color:#cdb4e8;font-size:11px}.upload-progress progress{width:100%;height:8px;accent-color:#a633ef}.upload-progress span{min-width:112px;text-align:right}.upload-progress.hidden{display:none!important}

/* Compact WhatsApp-like layout, with an opaque full-screen iPhone view. */
@media(min-width:1051px){.app{max-width:1320px;height:calc(100dvh - 20px);grid-template-columns:255px minmax(0,1fr) 220px;padding:10px;gap:10px}.sidebar{padding:15px 11px 10px}.brand{padding-bottom:14px}.side-head{margin-top:15px}.people-list{max-height:30%}.chat-header{height:60px;padding-inline:15px}.messages{padding:17px 18px}.composer-wrap{padding:10px 13px 12px}}
@media(min-width:651px) and (max-width:1050px){.app{width:100%;max-width:none;height:100dvh;grid-template-columns:225px minmax(0,1fr);padding:8px;gap:8px}.chat{min-width:0}.sidebar{padding:13px 9px}.details{display:none}}
.status-screen{display:flex;flex:1;min-height:0;flex-direction:column;gap:14px;overflow:auto;padding:10px 6px}.status-screen.hidden{display:none!important}.status-heading{display:grid;gap:4px;padding:7px 5px 12px;border-bottom:1px solid var(--line)}.status-heading h2{margin:0;font-size:20px;color:#f5efff}.status-heading span{font-size:10px;color:#a99cba}.status-form{display:grid;gap:7px;padding:0 5px 13px;border-bottom:1px solid var(--line)}.status-form label{font-size:11px;font-weight:700;color:#eadcf8}.status-form textarea{min-height:76px;resize:vertical;border:1px solid #3a3148;border-radius:11px;padding:10px;background:#100d17;color:#f5efff;font:inherit;font-size:12px}.status-form textarea:focus{outline:0;border-color:#a64ae8}.status-form .primary{margin-top:0}.status-list{display:grid;gap:4px}.status-row{display:flex;gap:10px;align-items:flex-start;padding:10px 7px;border-radius:12px;background:#17131f;border:1px solid #302641}.status-avatar{width:38px;height:38px;font-size:11px}.status-copy{min-width:0;flex:1}.status-row-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.status-row-head strong{font-size:12px;color:#f1eaff}.status-row-head time{font-size:9px;color:#a99cba}.status-copy p{margin:5px 0 0;font-size:12px;line-height:1.4;color:#d0c5dd;overflow-wrap:anywhere}.call-empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:20px}.call-empty .empty-icon{color:#d3a2ff;background:#271631}.call-empty h3{margin:0;font-size:14px;color:#f2eaff}.call-empty p{max-width:260px;margin:0;color:#aa9fba;font-size:11px;line-height:1.55}.app.statuses-only .mobile-search,.app.statuses-only .side-head,.app.statuses-only #conversationList,.app.statuses-only #peopleList,.app.statuses-only>.sidebar>.nav,.app.calls-only .mobile-search,.app.calls-only .side-head,.app.calls-only #conversationList,.app.calls-only #peopleList,.app.calls-only>.sidebar>.nav{display:none}
@media(max-width:767px){html,body{width:100%;height:100%;min-height:100%;margin:0;overflow:hidden;background:#08070d!important}.app{position:fixed!important;inset:0!important;width:100vw!important;max-width:none!important;height:100dvh!important;min-height:100dvh!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;overflow:hidden!important;background:#0d0b13!important;box-shadow:none!important}.sidebar{inset:0!important;width:100vw!important;height:100dvh!important;max-width:none!important;border:0!important;border-radius:0!important;background:#0d0b13!important;opacity:1!important;backdrop-filter:none!important;padding:calc(10px + env(safe-area-inset-top)) 14px calc(72px + env(safe-area-inset-bottom))!important}.chat{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;border:0!important;border-radius:0!important;background:#100e18!important;opacity:1!important;backdrop-filter:none!important}.app.chat-open .chat{display:flex}.mobile-bottom{height:calc(62px + env(safe-area-inset-bottom))!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:5px 4px env(safe-area-inset-bottom)!important;background:#100d17!important;backdrop-filter:none!important}.mobile-bottom button{min-width:0;gap:2px;font-size:9px;white-space:nowrap}.mobile-bottom button span{font-size:17px}.status-screen{padding:8px 2px}.app.statuses-only .mobile-bottom,.app.calls-only .mobile-bottom{display:grid}.app.statuses-only #statusScreen,.app.calls-only #callsScreen{display:flex}.app.statuses-only .account,.app.calls-only .account{display:none}.app.chat-open .sidebar,.app.chat-open .mobile-bottom{display:none}.chat-header{padding-top:env(safe-area-inset-top);height:calc(58px + env(safe-area-inset-top))}.composer-wrap{padding-bottom:max(10px,env(safe-area-inset-bottom))}}

/* Brisa's uploaded logo: violet, electric blue and cyan glow. */
:root{--green:#159cff;--green-ink:#d4f8ff;--canvas:#070b18;--line:#292b48}
body{background:radial-gradient(ellipse at 20% -25%,#241247 0,transparent 40%),radial-gradient(ellipse at 85% 5%,#06284a 0,transparent 42%),#070b18}
.brand-icon{width:38px;height:38px;overflow:hidden;border-radius:11px;background:#080d1d;border:1px solid #36cfff70;box-shadow:0 0 18px #168aff4a}
.brand-icon img{display:block;width:100%;height:100%;object-fit:cover;border-radius:10px}
.nav.active{background:linear-gradient(100deg,#6120a833,#155dff28,#00d9ff18);color:#d8f6ff;box-shadow:inset 2px 0 #28cbff}
.brand-icon{box-shadow:0 0 15px #762cff55,0 0 22px #00bfff35}
.send,.primary{background:linear-gradient(120deg,#782cff 0%,#315aff 54%,#08bfff 100%);box-shadow:0 5px 20px #128eff45}
.unlock{background:linear-gradient(110deg,#762cff,#315aff 62%,#00aee8);box-shadow:0 0 18px #168eff35}
.mine .bubble{background:linear-gradient(135deg,#5122a0,#2359c8 65%,#0879ac);border-color:#4a9fe5;color:#fff}
.composer:focus-within{border-color:#3dafff;box-shadow:0 0 0 3px #168cff22}
.auth-card input:focus,.modal input:focus,.status-form textarea:focus{border-color:#36bfff;box-shadow:0 0 0 3px #1a85ff20}
.mobile-bottom button.selected{color:#c5f5ff}.mobile-bottom button.selected span{color:#39cbff;text-shadow:0 0 14px #078cff}
.status-heading h2{color:#ddf8ff}.status-row{border-color:#263d58}.status-form .primary{color:white}
@media(max-width:767px){body{background:#070b18!important}.app,.sidebar{background:#080b17!important}.mobile-bottom{border-color:#162c46!important;background:#080c19!important}.chat{background:#080b17!important}}

/* Keep a clear way back to the conversation list on every screen size. */
.mobile-menu{display:flex!important;align-items:center;justify-content:center;gap:3px;width:auto;min-width:62px;height:36px;padding:0 7px;background:transparent;border:0;color:#d9f4ff;font-size:24px;line-height:1;flex:none}
.mobile-menu span{font-size:11px;font-weight:700;line-height:1}

.mobile-menu{display:flex!important;visibility:visible!important;opacity:1!important;align-items:center;justify-content:center;gap:5px;min-width:84px!important;height:40px!important;padding:0 11px!important;background:linear-gradient(115deg,#6b26d8,#2459d8 65%,#0696ba)!important;border:1px solid #57d7ff!important;border-radius:12px!important;color:#fff!important;box-shadow:0 0 18px #098dff62!important;font-size:21px!important;font-weight:800!important;line-height:1;flex:none;position:relative;z-index:2}
.mobile-menu span{font-size:11px!important;font-weight:800!important;color:#fff!important}

/* Brisa mobile chat navigation: return to the WhatsApp-style conversation list. */
@media (min-width:768px){.mobile-menu{display:none!important}}
@media (max-width:767px){
  .app{display:block!important}
  .app:not(.chat-open)>.sidebar{display:flex!important;z-index:3}
  .app:not(.chat-open)>.chat{display:none!important}
  .app.chat-open>.sidebar,.app.chat-open>.mobile-bottom{display:none!important}
  .app.chat-open>.chat{display:flex!important;z-index:4}
  .sidebar>.brand{min-height:58px!important;gap:9px!important}
  .brand-icon{width:48px!important;height:48px!important;border-radius:14px!important;flex:none}
  .brand-icon img{border-radius:13px!important}
  .brand-name{font-size:25px;font-weight:800;letter-spacing:-1px;color:#f5f1ff}
  .mobile-menu{display:flex!important;visibility:visible!important;opacity:1!important;min-width:76px!important;height:42px!important;padding:0 10px!important;border:1px solid #44cfff!important;border-radius:13px!important;background:linear-gradient(115deg,#6b26d8,#2459d8 65%,#0696ba)!important;color:#fff!important;box-shadow:0 0 17px #098dff50!important}
  .chat-header{gap:8px!important}
}
@media (min-width:768px){
  .mobile-menu{display:flex!important}
  .app.list-focus{grid-template-columns:minmax(0,1fr)!important}
  .app.list-focus>.sidebar{width:min(850px,100%);justify-self:center}
  .app.list-focus>.chat,.app.list-focus>.details{display:none!important}
}

/* iPhone-like Brisa chat list: logo, large title, search, message rows and floating tabs. */
@media(max-width:767px){
  .sidebar{padding:calc(8px + env(safe-area-inset-top)) 16px calc(102px + env(safe-area-inset-bottom))!important;background:#070a12!important}
  .sidebar>.brand{min-height:56px!important;padding:2px 0 0!important;gap:10px!important}
  .brand-icon{width:45px!important;height:45px!important;border-radius:14px!important;box-shadow:0 0 15px #762cff55,0 0 22px #00bfff35!important}
  .brand-name{font-size:23px!important}
  .mobile-top-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
  .mobile-round-action{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff20;border-radius:50%;background:#171923;color:#f7f6ff;font-size:22px;line-height:1;box-shadow:0 4px 14px #0005}
  .mobile-round-action:first-child{font-size:18px;letter-spacing:1px}
  .mobile-round-action.new-chat-action{background:linear-gradient(135deg,#762cff,#315aff 65%,#08bfff);border-color:#50d8ff88;color:#fff;font-size:32px;box-shadow:0 0 20px #147fff55}
  .mobile-title{display:block;margin:20px 0 16px;font-size:38px;line-height:1.05;font-weight:750;letter-spacing:-1.5px;color:#fbfaff}
  .mobile-search{height:48px;min-height:48px!important;margin:0 0 14px!important;padding:0 15px!important;border:0!important;border-radius:28px!important;background:#1a1b25!important;color:#9d9eae!important}
  .mobile-search span{font-size:23px!important;color:#9aa1b5}
  .mobile-search input{font-size:15px!important;color:#f2f3fb!important}
  .side-head{min-height:26px;margin:0 2px 4px!important;padding:3px 0!important;border-bottom:1px solid #252735;font-size:12px!important;font-weight:650!important;text-transform:none!important;letter-spacing:0!important;color:#b8b9c6!important}
  .conversation-list,.people-list{gap:0!important;min-height:0}
  .conv-row,.person-row{min-height:79px!important;padding:10px 2px!important;gap:13px!important;border-bottom:1px solid #242530!important;border-radius:0!important;background:transparent!important}
  .avatar{width:56px!important;height:56px!important;font-size:15px!important}
  .row-top{align-items:center;font-size:16px!important;gap:10px!important}
  .row-top strong{font-size:16px!important;font-weight:650;color:#f6f5fb}
  .row-time{font-size:12px!important;color:#9698a6!important}
  .row-sub{margin-top:5px!important;font-size:13px!important;color:#a7a8b5!important}
  .mobile-bottom{left:13px!important;right:13px!important;bottom:calc(10px + env(safe-area-inset-bottom))!important;width:auto!important;height:72px!important;padding:6px 7px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:2px!important;border:1px solid #ffffff24!important;border-radius:40px!important;background:rgba(24,24,34,.94)!important;box-shadow:0 12px 34px #0009,inset 0 1px #ffffff12!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important}
  .mobile-bottom button{display:grid;place-content:center;justify-items:center;gap:3px!important;min-width:0;padding:4px 2px!important;border-radius:32px!important;background:transparent!important;color:#b6b5c3!important;font-size:10px!important;font-weight:550!important;white-space:nowrap}
  .mobile-bottom button span{font-size:20px!important;line-height:22px!important}
  .mobile-bottom button.selected{background:#ffffff16!important;color:#f6f3ff!important}
  .mobile-bottom button.selected span{color:#72dfff!important;text-shadow:0 0 13px #168dffb8!important}
  .app.contacts-only .mobile-title{color:#fbfaff}
  .app.statuses-only .mobile-title,.app.calls-only .mobile-title{margin-bottom:14px}
  .app.chat-open .chat-header{padding-top:env(safe-area-inset-top)!important}
}

/* Brisa navigation and conversation header finish */
html.phone-preview .mobile-bottom{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media(max-width:767px){.mobile-bottom{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
.messages{background-color:#0a0e1b;background-image:linear-gradient(#090d1970,#090d1970),url('/brisa-doodles.svg'),radial-gradient(ellipse at 50% 0,#241d4930,transparent 62%);background-size:auto,320px 320px,auto;background-repeat:repeat,repeat,no-repeat;background-position:center;background-attachment:local,local,local}
.messages.has-chat-wallpaper{background-image:linear-gradient(#080d1a70,#080d1a70),var(--chat-wallpaper);background-size:auto,cover;background-repeat:repeat,no-repeat;background-position:center;background-attachment:local,local}
.chat-header{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(110deg,#123981 0%,#145ed0 42%,#087fb0 72%,#123b8c 100%)!important;background-size:220% 220%!important;animation:brisa-header-flow 18s ease-in-out infinite!important;border-bottom:1px solid #69caff66!important;box-shadow:0 5px 20px #11165c55,inset 0 1px #ffffff18!important}
.chat-header::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 0,#715bff2e,transparent 46%),radial-gradient(ellipse at 88% 100%,#00d8ff42,transparent 48%);opacity:.9}
.chat-header::after{content:"";position:absolute;z-index:0;left:-35%;right:-35%;bottom:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,#bd7aff,#59eaff,#746cff,transparent);background-size:200% 100%;animation:brisa-header-line 8s linear infinite;opacity:.85}
.chat-header>*{position:relative;z-index:1}
.chat-header .header-copy strong{color:#fff!important;text-shadow:0 1px 10px #1d1748a8}
.chat-header .header-copy span{color:#d8e6ff!important}
.chat-header .mobile-menu{color:#e8e4ff!important;text-shadow:0 0 10px #8c7aff75!important}
.chat-header .contact-avatar{border-color:#90e8ff88!important;box-shadow:0 0 16px #347eff69!important}
@keyframes brisa-header-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes brisa-header-line{0%{background-position:100% 0}100%{background-position:-100% 0}}
.chat-wallpaper-settings{display:grid;gap:8px;margin:12px 0;padding:13px;border:1px solid #344872;border-radius:15px;background:linear-gradient(135deg,#11182b,#17142d);box-shadow:inset 0 1px #ffffff09}
.chat-wallpaper-settings h3{margin:0;color:#f2edff;font-size:13px}
.chat-wallpaper-settings>p{margin:0;color:#aebbd1;font-size:10px;line-height:1.5}
.chat-wallpaper-swatch{height:78px;border:1px solid #475b87;border-radius:12px;background-color:#0a0e1b;background-image:linear-gradient(#090d1960,#090d1960),url('/brisa-doodles.svg'),linear-gradient(125deg,#251452,#0b3c75,#064a5c);background-size:auto,172px 172px,auto;background-position:center;background-repeat:repeat,repeat,no-repeat;overflow:hidden}
.chat-wallpaper-swatch.has-image{background-size:cover;background-repeat:no-repeat;background-position:center}
.chat-wallpaper-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.chat-wallpaper-actions .photo-picker{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border:1px solid #526fe0;border-radius:11px;background:linear-gradient(110deg,#4021a0,#125eaa);color:#fff;font-size:10px;font-weight:700;cursor:pointer;box-shadow:0 3px 12px #2157c437}
.chat-wallpaper-actions .photo-picker input{display:none}
.chat-wallpaper-settings>small{color:#9eacc4;font-size:9px;line-height:1.45}
.chat-wallpaper-settings .privacy-hint{min-height:14px;color:#70d7ff;font-size:9px}
@media(prefers-reduced-motion:reduce){.chat-header,.chat-header::after{animation:none!important}}
#mobileMenu.mobile-menu{width:27px!important;min-width:27px!important;height:32px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#e8f4ff!important;font-size:24px!important;font-weight:400!important;text-shadow:none!important}
#mobileMenu.mobile-menu:hover,#mobileMenu.mobile-menu:focus-visible{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#fff!important;text-shadow:0 0 8px #69caff45!important}
.sticker-toolbar{display:flex;justify-content:flex-end;min-height:30px}
.sticker-toolbar button{min-height:30px;padding:0 10px;border:1px solid #4769bd;border-radius:10px;background:linear-gradient(120deg,#241950,#123766);color:#dff4ff;font-size:10px;font-weight:700}
.saved-sticker-option{position:relative;display:grid;place-items:center;min-width:0;min-height:68px}
.saved-sticker-send{width:100%;height:100%;display:grid;place-items:center;gap:4px;padding:5px 14px 5px 5px;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer}
.saved-sticker-send img,.custom-sticker-message{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 4px 8px #0005)}
.saved-sticker-remove{position:absolute;top:1px;right:1px;width:18px;height:18px;border:1px solid #46516f;border-radius:50%;background:#171b2b;color:#c6d2e8;font-size:13px;line-height:14px}
.custom-sticker-message{width:min(150px,45vw);height:min(150px,45vw);filter:drop-shadow(0 7px 13px #0005)}
.chat-file-card{width:min(280px,74vw);display:grid;gap:10px;padding:11px 13px;border:1px solid #4a5f87;border-radius:16px;background:linear-gradient(145deg,#141a2aee,#111626f2);box-shadow:0 5px 17px #0004;color:#f3f6ff}
.mine .chat-file-card{border-color:#53baff66;background:linear-gradient(135deg,#19244a,#142c43)}
.chat-file-heading,.chat-document-link{min-width:0;display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.chat-file-heading>span:nth-child(2),.chat-document-link>span:nth-child(2){min-width:0;flex:1;display:grid;gap:3px}
.chat-file-heading b,.chat-document-link b{font-size:11px;overflow-wrap:anywhere}
.chat-file-heading small,.chat-document-link small{color:#adbad2;font-size:9px;overflow-wrap:anywhere}
.chat-file-icon{width:34px;height:34px;flex:none;display:grid;place-items:center;border:1px solid #5da2dd55;border-radius:11px;background:linear-gradient(145deg,#362077,#16578b);color:#e4f7ff;font-size:18px}
.chat-download-icon{flex:none;color:#67d5ff;font-size:18px}
.chat-file-card audio,.chat-attachment-preview audio{width:100%;height:38px;accent-color:#168cff}
.chat-file-card+.stamp{align-self:start}
.chat-attachment-preview{min-height:40px;display:grid;place-items:center;gap:8px;padding:10px;border:1px solid #30456a;border-radius:13px;background:#0e1525;color:#e7f3ff;font-size:11px}
.chat-attachment-preview .chat-file-icon{width:46px;height:46px}
.sticker-preview{min-height:90px;display:grid;place-items:center;padding:12px;border:1px solid #344872;border-radius:13px;background:radial-gradient(ellipse,#1d2c4a,#0a1020)}
.sticker-preview img{width:120px;height:120px;max-width:100%;object-fit:contain}
.chat-attachment-modal .upload-progress{display:grid;gap:5px;min-height:27px}
.chat-attachment-modal .upload-progress progress{width:100%;height:8px;accent-color:#20baff}
.chat-attachment-modal .upload-progress span{min-height:12px;color:#9fb5d4;font-size:9px}
@media(max-width:767px){.chat-file-card{width:min(270px,76vw)}.chat-attachment-modal{max-height:calc(100dvh - 32px);overflow:auto}.saved-sticker-send img{width:52px;height:52px}}
@media(min-width:768px){.mobile-title,.mobile-top-actions{display:none!important}}
@media(max-width:767px){.sidebar>.brand #newChat.mobile-round-action{width:48px!important;height:48px!important;margin-left:0!important;border-radius:50%!important;background:linear-gradient(135deg,#762cff,#315aff 65%,#08bfff)!important;border:1px solid #50d8ff88!important;color:#fff!important;font-size:32px!important;box-shadow:0 0 20px #147fff55!important}}

/* Desktop window can preview the real app inside an iPhone-sized viewport. */
@media(min-width:768px){
 html.phone-preview,html.phone-preview body{width:100%;height:100%;min-height:100%;overflow:hidden}
 html.phone-preview body{display:grid;place-items:center;padding:14px;background:radial-gradient(ellipse at 50% 5%,#1a1740,#080a12 62%)}
 html.phone-preview #app{position:relative!important;inset:auto!important;width:min(393px,calc((100dvh - 28px)*.4613))!important;height:min(852px,calc(100dvh - 28px))!important;min-height:0!important;max-width:none!important;margin:0!important;padding:0!important;display:block!important;overflow:hidden!important;border:8px solid #171923!important;border-radius:42px!important;background:#080b17!important;box-shadow:0 24px 90px #000b,0 0 0 1px #6b73a250!important}
 html.phone-preview #app::before{content:'';position:absolute;z-index:8;top:0;left:50%;transform:translateX(-50%);width:104px;height:23px;border-radius:0 0 16px 16px;background:#05060a;pointer-events:none}
 html.phone-preview .sidebar{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;display:flex!important;padding:31px 14px 100px!important;border:0!important;border-radius:0!important;background:#070a12!important;overflow:hidden!important}
 html.phone-preview .sidebar>.brand{min-height:56px!important;padding:2px 0 0!important;gap:10px!important}
 html.phone-preview .brand-icon{width:45px!important;height:45px!important;border-radius:14px!important}
 html.phone-preview .brand-name{font-size:23px!important;color:#f5f1ff}
 html.phone-preview .mobile-top-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
 html.phone-preview .mobile-round-action{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff20;border-radius:50%;background:#171923;color:#f7f6ff;font-size:20px}
 html.phone-preview #newChat.mobile-round-action{background:linear-gradient(135deg,#762cff,#315aff 65%,#08bfff);border-color:#50d8ff88;color:#fff;font-size:32px;box-shadow:0 0 18px #147fff55}
 html.phone-preview .mobile-title{display:block;margin:20px 0 16px;font-size:38px;line-height:1.05;font-weight:750;letter-spacing:-1.5px;color:#fbfaff}
 html.phone-preview .mobile-search{display:flex;align-items:center;gap:9px;height:48px;min-height:48px;margin:0 0 14px;padding:0 15px;border:0;border-radius:28px;background:#1a1b25;color:#9d9eae}
 html.phone-preview .mobile-search input{width:100%;border:0;outline:0;background:transparent;color:#f2f3fb;font:inherit;font-size:15px}
 html.phone-preview .sidebar>.nav{display:none!important}
 html.phone-preview .side-head{min-height:26px;margin:0 2px 4px;padding:3px 0;border-bottom:1px solid #252735;font-size:12px;font-weight:650;text-transform:none;letter-spacing:0;color:#b8b9c6}
 html.phone-preview .conversation-list,html.phone-preview .people-list{gap:0;min-height:0;overflow:auto}
 html.phone-preview .conv-row,html.phone-preview .person-row{min-height:79px;padding:10px 2px;gap:13px;border-bottom:1px solid #242530;border-radius:0;background:transparent}
 html.phone-preview .avatar{width:56px;height:56px;font-size:15px}
 html.phone-preview .row-top{align-items:center;font-size:16px;gap:10px}
 html.phone-preview .row-top strong{font-size:16px;font-weight:650;color:#f6f5fb}
 html.phone-preview .row-time{font-size:12px;color:#9698a6}
 html.phone-preview .row-sub{margin-top:5px;font-size:13px;color:#a7a8b5}
 html.phone-preview .account{display:none!important}
 html.phone-preview .mobile-bottom{position:absolute!important;left:13px!important;right:13px!important;bottom:10px!important;width:auto!important;height:72px!important;padding:6px 7px!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:2px!important;border:1px solid #ffffff24!important;border-radius:40px!important;background:rgba(24,24,34,.94)!important;box-shadow:0 12px 34px #0009!important;backdrop-filter:blur(20px)!important}
 html.phone-preview .mobile-bottom button{display:grid;place-content:center;justify-items:center;gap:3px;min-width:0;padding:4px 2px;border-radius:32px;background:transparent;color:#b6b5c3;font-size:10px;white-space:nowrap}
 html.phone-preview .mobile-bottom button span{font-size:20px;line-height:22px}
 html.phone-preview .mobile-bottom button.selected{background:#ffffff16;color:#f6f3ff}
 html.phone-preview .mobile-bottom button.selected span{color:#72dfff;text-shadow:0 0 13px #168dffb8}
 html.phone-preview .chat{display:none;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;z-index:5!important;border:0!important;border-radius:0!important;background:#080b17!important;overflow:hidden!important}
 html.phone-preview #app.chat-open>.sidebar,html.phone-preview #app.chat-open>.mobile-bottom{display:none!important}
 html.phone-preview #app.chat-open>.chat{display:flex!important}
 html.phone-preview .chat-header{height:84px;padding:29px 10px 0;border-bottom:1px solid #2c2438;background:#100d17}
 html.phone-preview .mobile-menu{display:flex!important;visibility:visible!important;min-width:76px!important;height:40px!important;padding:0 8px!important;border:1px solid #44cfff!important;border-radius:13px!important;background:linear-gradient(115deg,#6b26d8,#2459d8 65%,#0696ba)!important;color:white!important;font-size:20px!important}
 html.phone-preview .mobile-menu span{font-size:11px!important}
 html.phone-preview .details{display:none!important}
}
@media(min-width:768px){
 html.phone-preview #app.messages-only .people-head,html.phone-preview #app.messages-only #peopleList{display:none!important}
 html.phone-preview #app.contacts-only .side-head:not(.people-head),html.phone-preview #app.contacts-only #conversationList{display:none!important}
}

/* Refined compact phone view: calm contrast, native typography and fixed layout regions. */
html.phone-preview body,.phone-preview #app{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media(min-width:768px){
 html.phone-preview body{background:#17181e!important}
 html.phone-preview #app{background:#08090c!important;border-color:#17181c!important;box-shadow:0 22px 64px #0009,0 0 0 1px #45465255!important}
 html.phone-preview .sidebar{display:flex!important;flex-direction:column!important;gap:0!important;padding:31px 15px 96px!important;background:#08090c!important;color:#f5f5f7!important}
 html.phone-preview .sidebar>.brand{flex:0 0 52px!important;min-height:52px!important;align-items:center!important;padding:0!important;gap:9px!important}
 html.phone-preview .brand-icon{width:42px!important;height:42px!important;border-color:#303342!important;box-shadow:0 0 11px #4728a722,0 0 12px #087ba522!important}
 html.phone-preview .brand-name{font-size:19px!important;font-weight:700!important;letter-spacing:-.35px!important;color:#f3f3f7!important}
 html.phone-preview .mobile-top-actions{display:flex!important;align-items:center!important;gap:9px!important;margin-left:auto!important}
 html.phone-preview .mobile-round-action{width:42px!important;height:42px!important;border:1px solid #303137!important;background:#191a1f!important;color:#eeeeF2!important;box-shadow:0 3px 10px #0005!important;font-size:17px!important}
 html.phone-preview #newChat.mobile-round-action{border-color:#4c5690!important;background:#25263a!important;color:#a8dfff!important;box-shadow:0 0 13px #343d8138!important;font-size:28px!important}
 html.phone-preview .mobile-title{display:block!important;flex:0 0 auto!important;margin:17px 0 13px!important;font-size:36px!important;line-height:1.13!important;font-weight:720!important;letter-spacing:-1.05px!important;color:#f7f7f8!important}
 html.phone-preview .mobile-search{flex:0 0 46px!important;display:flex!important;align-items:center!important;gap:9px!important;height:46px!important;min-height:46px!important;margin:0 0 14px!important;padding:0 14px!important;border:1px solid #24252a!important;border-radius:25px!important;background:#202125!important;color:#a7a8ae!important}
 html.phone-preview .mobile-search span{font-size:21px!important;color:#9b9da6!important}
 html.phone-preview .mobile-search input{min-width:0!important;width:100%!important;border:0!important;outline:0!important;background:transparent!important;color:#f1f1f4!important;font-family:inherit!important;font-size:14px!important}
 html.phone-preview .mobile-search input::placeholder{color:#9b9ca3!important}
 html.phone-preview .side-head{flex:0 0 27px!important;min-height:27px!important;margin:0 1px 4px!important;padding:3px 0 5px!important;border-bottom:1px solid #292a2f!important;color:#a7a8ae!important;font-family:inherit!important;font-size:11px!important;font-weight:600!important;text-transform:none!important;letter-spacing:.05px!important}
 html.phone-preview .conversation-list,html.phone-preview .people-list{display:grid!important;flex:1 1 auto!important;align-content:start!important;grid-auto-rows:min-content!important;min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain!important;gap:0!important}
 html.phone-preview #app.messages-only .people-head,html.phone-preview #app.messages-only #peopleList{display:none!important}
 html.phone-preview #app.contacts-only .side-head:not(.people-head),html.phone-preview #app.contacts-only #conversationList{display:none!important}
 html.phone-preview .conv-row,html.phone-preview .person-row{display:flex!important;flex:0 0 78px!important;align-items:center!important;min-height:78px!important;padding:8px 1px!important;gap:12px!important;border:0!important;border-bottom:1px solid #24252a!important;border-radius:0!important;background:transparent!important}
 html.phone-preview .avatar{width:54px!important;height:54px!important;font-size:14px!important;box-shadow:none!important}
 html.phone-preview .row-copy{min-width:0!important;flex:1 1 auto!important}
 html.phone-preview .row-top{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;font-family:inherit!important;font-size:15px!important}
 html.phone-preview .row-top strong{max-width:69%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#f2f2f4!important;font-size:15px!important;font-weight:620!important}
 html.phone-preview .row-time{flex:none!important;color:#9899a0!important;font-size:11px!important}
 html.phone-preview .row-sub{margin-top:5px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#a4a5ac!important;font-size:12px!important;line-height:1.35!important}
 html.phone-preview .conversation-list:empty{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:8px!important;padding:24px!important;text-align:center!important}
 html.phone-preview .conversation-list:empty:before{content:"Aún no tienes chats";color:#f0eff5;font-size:16px;font-weight:600}
 html.phone-preview .conversation-list:empty:after{content:"Toca + para buscar contactos e iniciar una conversación.";max-width:250px;color:#9b9ca5;font-size:12px;line-height:1.5}
 html.phone-preview .mobile-bottom{position:absolute!important;left:11px!important;right:11px!important;bottom:9px!important;width:auto!important;height:66px!important;padding:5px!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:3px!important;border:1px solid #36363c!important;border-radius:35px!important;background:rgba(29,29,33,.97)!important;box-shadow:0 8px 22px #0008!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important}
 html.phone-preview .mobile-bottom button{display:grid!important;place-content:center!important;justify-items:center!important;gap:2px!important;min-width:0!important;padding:3px 1px!important;border-radius:29px!important;background:transparent!important;color:#b4b4bb!important;font-family:inherit!important;font-size:9px!important;font-weight:550!important;white-space:nowrap!important}
 html.phone-preview .mobile-bottom button span{font-size:18px!important;line-height:20px!important}
 html.phone-preview .mobile-bottom button.selected{background:#44444b!important;color:#f6f6f7!important}
 html.phone-preview .mobile-bottom button.selected span{color:#b9e8ff!important;text-shadow:none!important}
 html.phone-preview #app.chat-open .mobile-bottom,html.phone-preview #app.chat-open .sidebar{display:none!important}
 html.phone-preview #app.chat-open .chat{position:absolute!important;inset:0!important;z-index:5!important;display:flex!important;width:100%!important;height:100%!important;border:0!important;border-radius:0!important;background:#090a0e!important}
 html.phone-preview .chat-header{flex:0 0 78px!important;height:78px!important;padding:26px 10px 0!important;gap:8px!important;background:#101115!important;border-bottom:1px solid #292a30!important}
 html.phone-preview .mobile-menu{display:flex!important;align-items:center!important;justify-content:center!important;gap:3px!important;min-width:70px!important;height:38px!important;padding:0 7px!important;border:1px solid #484858!important;border-radius:12px!important;background:#242430!important;color:#e3e0f2!important;box-shadow:none!important;font-family:inherit!important;font-size:20px!important}
 html.phone-preview .mobile-menu span{font-size:11px!important}
 html.phone-preview .details{display:none!important}
}
@media(max-width:767px){
 body,.app,.sidebar,.chat{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
 .sidebar{gap:0!important}
 .conversation-list,.people-list{flex:1 1 auto!important;align-content:start!important;grid-auto-rows:min-content!important;min-height:0!important;overscroll-behavior:contain!important}
 .mobile-bottom{background:rgba(29,29,33,.97)!important;border-color:#36363c!important;box-shadow:0 8px 22px #0008!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important}
 .mobile-bottom button.selected{background:#44444b!important;color:#f6f6f7!important}
 .mobile-bottom button.selected span{color:#b9e8ff!important;text-shadow:none!important}
 .conversation-list:empty:before{content:"Aún no tienes chats";padding-top:45px;color:#f0eff5;text-align:center;font-size:16px;font-weight:600}
 .conversation-list:empty:after{content:"Toca + para buscar contactos e iniciar una conversación.";max-width:260px;margin:0 auto;color:#9b9ca5;text-align:center;font-size:12px;line-height:1.5}
}

/* Simpler mobile navigation: only Chats, Calls and Contacts stay on the floating bar. */
@media(min-width:768px){
 html.phone-preview .side-head{display:none!important}
 html.phone-preview .mobile-bottom{grid-template-columns:repeat(3,minmax(0,1fr))!important;left:38px!important;right:38px!important;height:64px!important;bottom:12px!important}
 html.phone-preview .mobile-bottom button{font-size:11px!important}
 html.phone-preview .mobile-overflow{position:absolute;z-index:9;top:81px;right:15px;display:grid;gap:2px;min-width:152px;padding:6px;border:1px solid #33343a;border-radius:15px;background:#1d1e23;box-shadow:0 12px 32px #0009}
 html.phone-preview .mobile-overflow.hidden{display:none!important}
 html.phone-preview .mobile-overflow button{min-height:42px;padding:0 12px;border-radius:10px;background:transparent;color:#eeeeF2;text-align:left;font-family:inherit;font-size:13px}
 html.phone-preview .mobile-overflow button:hover{background:#2c2d34}
}
@media(max-width:767px){
 .side-head{display:none!important}
 .mobile-bottom{grid-template-columns:repeat(3,minmax(0,1fr))!important;left:28px!important;right:28px!important;height:64px!important;bottom:calc(9px + env(safe-area-inset-bottom))!important}
 .mobile-bottom button{font-size:11px!important}
 .mobile-overflow{position:absolute;z-index:9;top:81px;right:15px;display:grid;gap:2px;min-width:152px;padding:6px;border:1px solid #33343a;border-radius:15px;background:#1d1e23;box-shadow:0 12px 32px #0009}
 .mobile-overflow.hidden{display:none!important}
 .mobile-overflow button{min-height:42px;padding:0 12px;border-radius:10px;background:transparent;color:#eeeeF2;text-align:left;font-family:inherit;font-size:13px}
}
@media(max-width:767px){
 .app.messages-only .people-head,.app.messages-only #peopleList{display:none!important}
 .app.contacts-only #conversationList{display:none!important}
}

/* Keep one mobile destination visible at a time; no desktop panels around the phone view. */
@media(min-width:768px){
 html.phone-preview #app.messages-only .people-head,html.phone-preview #app.messages-only #peopleList{display:none!important}
 html.phone-preview #app.contacts-only .side-head,html.phone-preview #app.contacts-only #conversationList{display:none!important}
 html.phone-preview #app.calls-only .mobile-search,html.phone-preview #app.calls-only .side-head,html.phone-preview #app.calls-only #conversationList,html.phone-preview #app.calls-only #peopleList{display:none!important}
 html.phone-preview #app.statuses-only .mobile-search,html.phone-preview #app.statuses-only .side-head,html.phone-preview #app.statuses-only #conversationList,html.phone-preview #app.statuses-only #peopleList{display:none!important}
 html.phone-preview .account,html.phone-preview .sidebar>.nav{display:none!important}
 html.phone-preview .conversation-list:empty:before,html.phone-preview .conversation-list:empty:after{display:none!important;content:none!important}
 html.phone-preview .people-list:empty:before,html.phone-preview .people-list:empty:after{display:none!important;content:none!important}
}
@media(max-width:767px){
 #app.messages-only .people-head,#app.messages-only #peopleList{display:none!important}
 #app.contacts-only .side-head,#app.contacts-only #conversationList{display:none!important}
 #app.calls-only .mobile-search,#app.calls-only .side-head,#app.calls-only #conversationList,#app.calls-only #peopleList{display:none!important}
 #app.statuses-only .mobile-search,#app.statuses-only .side-head,#app.statuses-only #conversationList,#app.statuses-only #peopleList{display:none!important}
 .account,.sidebar>.nav{display:none!important}
 .conversation-list:empty:before,.conversation-list:empty:after,.people-list:empty:before,.people-list:empty:after{display:none!important;content:none!important}
}

/* Make Chats and Contacts use the same single-screen frame as Calls. */
@media(min-width:768px){
 html.phone-preview #app>.sidebar{display:flex!important;flex-direction:column!important;overflow:hidden!important}
 html.phone-preview #app>.sidebar>.mobile-title{flex:0 0 auto!important}
 html.phone-preview #app>.sidebar>.mobile-search{flex:0 0 46px!important}
 html.phone-preview #app.messages-only #conversationList,html.phone-preview #app.contacts-only #peopleList{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;min-height:0!important;width:100%!important;overflow-y:auto!important}
 html.phone-preview #app.messages-only #conversationList:not(.empty-list),html.phone-preview #app.contacts-only #peopleList:not(.empty-list){display:grid!important;align-content:start!important}
 html.phone-preview #app.messages-only #conversationList.empty-list,html.phone-preview #app.contacts-only #peopleList.empty-list{display:flex!important;align-items:center!important;justify-content:center!important;align-content:center!important}
 html.phone-preview #app.messages-only #conversationList.empty-list:before{content:"Aún no tienes chats";display:block;color:#f0eff5;font-size:17px;font-weight:650;text-align:center}
 html.phone-preview #app.messages-only #conversationList.empty-list:after{content:"Tus conversaciones aparecerán aquí.";display:block;max-width:250px;margin-top:6px;color:#9b9ca5;font-size:13px;line-height:1.5;text-align:center}
 html.phone-preview #app.contacts-only #peopleList.empty-list .empty-mini{display:block;width:100%;padding:0 22px;border:0;background:transparent;color:#a3a4ac;font-size:13px;line-height:1.5;text-align:center}
 html.phone-preview #app.messages-only .mobile-search,html.phone-preview #app.contacts-only .mobile-search{display:flex!important}
 html.phone-preview #app.messages-only .mobile-bottom,html.phone-preview #app.contacts-only .mobile-bottom,html.phone-preview #app.calls-only .mobile-bottom{display:grid!important}
}
@media(max-width:767px){
 #app.messages-only #conversationList,#app.contacts-only #peopleList{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;min-height:0!important;width:100%!important;overflow-y:auto!important}
 #app.messages-only #conversationList:not(.empty-list),#app.contacts-only #peopleList:not(.empty-list){display:grid!important;align-content:start!important}
 #app.messages-only #conversationList.empty-list,#app.contacts-only #peopleList.empty-list{display:flex!important;align-items:center!important;justify-content:center!important;align-content:center!important}
 #app.messages-only #conversationList.empty-list:before{content:"Aún no tienes chats";display:block;color:#f0eff5;font-size:17px;font-weight:650;text-align:center}
 #app.messages-only #conversationList.empty-list:after{content:"Tus conversaciones aparecerán aquí.";display:block;max-width:250px;margin-top:6px;color:#9b9ca5;font-size:13px;line-height:1.5;text-align:center}
 #app.contacts-only #peopleList.empty-list .empty-mini{display:block;width:100%;padding:0 22px;border:0;background:transparent;color:#a3a4ac;font-size:13px;line-height:1.5;text-align:center}
 #app.messages-only .mobile-search,#app.contacts-only .mobile-search{display:flex!important}
 #app.messages-only .mobile-bottom,#app.contacts-only .mobile-bottom,#app.calls-only .mobile-bottom{display:grid!important}
}

/* Reference finish: Brisa's three simple tabs and a full-bleed iPhone preview. */
@media(min-width:768px){
 html.phone-preview body{background:#080d20!important}
 html.phone-preview #app{border:0!important;border-radius:0!important;background:#050b1b!important;box-shadow:0 20px 80px #0009!important}
 html.phone-preview #app::before{display:none!important}
 html.phone-preview #app::after{content:"";position:absolute;z-index:12;left:50%;bottom:9px;width:120px;height:4px;transform:translateX(-50%);border-radius:4px;background:#f5f5f7}
 html.phone-preview .sidebar{padding:7px 16px 120px!important;background:radial-gradient(ellipse at 76% 2%,#11183b 0,transparent 38%),#050b1b!important}
 html.phone-preview .device-status{height:27px;flex:0 0 27px;display:flex;align-items:flex-start;justify-content:space-between;padding:2px 8px 0;color:#f7f8ff;font:600 15px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
 html.phone-preview .device-indicators{display:flex;align-items:center;gap:6px;height:19px;color:white}
 html.phone-preview .signal-bars{display:block;width:16px;height:13px;background:linear-gradient(to right,#fff 0 3px,transparent 3px 5px,#fff 5px 8px,transparent 8px 10px,#fff 10px 13px,transparent 13px 15px,#fff 15px);clip-path:polygon(0 62%,20% 47%,20% 100%,0 100%,27% 40%,47% 25%,47% 100%,27% 100%,54% 18%,74% 6%,74% 100%,54% 100%,80% 0,100% 0,100% 100%,80% 100%)}
 html.phone-preview .wifi-mark{font:700 20px/18px system-ui;transform:rotate(-35deg)}
 html.phone-preview .battery-mark{position:relative;width:24px;height:13px;border:1.5px solid #fff;border-radius:4px}
 html.phone-preview .battery-mark:before{content:"";position:absolute;inset:2px 3px 2px 2px;border-radius:1px;background:#ffda4c}
 html.phone-preview .battery-mark:after{content:"";position:absolute;right:-3.5px;top:3px;width:2px;height:5px;border-radius:0 2px 2px 0;background:#fff}
 html.phone-preview .sidebar>.brand{min-height:57px!important;flex:0 0 57px!important;padding:3px 0 0!important;gap:9px!important}
 html.phone-preview .brand-icon{position:relative;overflow:hidden;width:46px!important;height:46px!important;border-radius:14px!important;border:1px solid #258dff!important;background:#060d28!important;box-shadow:0 0 15px #572dff88,0 0 20px #00caff4c!important}
 html.phone-preview .brand-icon img{position:absolute;width:160%;height:170%;max-width:none;left:-30%;top:-5%;object-fit:fill;border-radius:0!important}
 html.phone-preview .brand-name{font-size:23px!important;font-weight:760!important;letter-spacing:-.8px!important;color:#fafaff!important}
 html.phone-preview .mobile-top-actions{gap:12px!important}
 html.phone-preview .mobile-round-action{width:39px!important;height:39px!important;background:#14192d!important;border-color:#ffffff12!important;color:#f6f7ff!important;font-size:19px!important;box-shadow:none!important}
 html.phone-preview #newChat.mobile-round-action{width:42px!important;height:42px!important;background:linear-gradient(135deg,#6937ff,#236bff 65%,#08bfff)!important;border:1px solid #5ad7ff8a!important;color:#fff!important;font-size:29px!important;box-shadow:0 0 20px #2265ff70!important}
 html.phone-preview .mobile-title{margin:16px 0 13px!important;font-size:34px!important;line-height:1.12!important;letter-spacing:-1.1px!important}
 html.phone-preview .mobile-search{height:42px!important;min-height:42px!important;margin:0 0 18px!important;padding:0 13px!important;border:1px solid #7376ff8c!important;border-radius:25px!important;background:linear-gradient(110deg,#181c36,#1b1c39 65%,#241c48)!important;box-shadow:0 0 14px #5664ff1f,inset 0 1px #ffffff14!important}
 html.phone-preview .mobile-search span{font-size:21px!important;color:#a9b4d7!important}
 html.phone-preview .mobile-search input{font-size:14px!important}
 html.phone-preview .side-head{display:none!important}
 html.phone-preview .conv-row,html.phone-preview .person-row{min-height:78px!important;padding:9px 1px!important;gap:12px!important;border-bottom:1px solid #283044!important}
 html.phone-preview .avatar{width:52px!important;height:52px!important}
 html.phone-preview .row-top strong{font-size:15px!important;font-weight:620!important}
 html.phone-preview .row-time{font-size:11px!important}
 html.phone-preview .row-sub{font-size:12px!important}
 html.phone-preview .mobile-bottom{left:16px!important;right:16px!important;bottom:62px!important;height:66px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;padding:4px!important;border:1px solid #7764ff!important;border-radius:36px!important;background:linear-gradient(110deg,#11132bdf,#10152bd9 48%,#1b1231e8)!important;box-shadow:0 0 16px #493eff58,inset 0 1px #ffffff1b!important;backdrop-filter:blur(18px)!important}
 html.phone-preview .mobile-bottom button{font-size:11px!important;color:#b9bdd1!important}
 html.phone-preview .mobile-bottom button span{font-size:20px!important}
 html.phone-preview .mobile-bottom button.selected{position:relative;background:transparent!important;color:#f5f3ff!important}
 html.phone-preview .mobile-bottom button.selected span{color:#d9c4ff!important;text-shadow:0 0 13px #8d52ff!important}
 html.phone-preview .mobile-bottom button.selected:after{content:"";position:absolute;left:20%;right:20%;bottom:-4px;height:3px;border-radius:3px;background:#8e63ff;box-shadow:0 0 9px #8855ff}
 html.phone-preview .mobile-bottom .tab-icon{display:grid;place-items:center}
 html.phone-preview .mobile-bottom .tab-icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
}
@media(max-width:767px){
 .device-status{display:none!important}
 .sidebar{background:radial-gradient(ellipse at 76% 2%,#11183b 0,transparent 38%),#050b1b!important}
 .brand-icon{position:relative;overflow:hidden;border:1px solid #258dff!important;background:#060d28!important}
 .brand-icon img{position:absolute;width:160%;height:170%;max-width:none;left:-30%;top:-5%;object-fit:fill;border-radius:0!important}
 .mobile-title{margin-top:16px!important;font-size:34px!important}
 .mobile-search{height:42px!important;min-height:42px!important;border:1px solid #7376ff8c!important;border-radius:25px!important;background:linear-gradient(110deg,#181c36,#1b1c39 65%,#241c48)!important;box-shadow:0 0 14px #5664ff1f,inset 0 1px #ffffff14!important}
 .mobile-bottom{left:16px!important;right:16px!important;bottom:calc(37px + env(safe-area-inset-bottom))!important;height:66px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;padding:4px!important;border:1px solid #7764ff!important;border-radius:36px!important;background:linear-gradient(110deg,#11132bdf,#10152bd9 48%,#1b1231e8)!important;box-shadow:0 0 16px #493eff58,inset 0 1px #ffffff1b!important}
 .mobile-bottom button{font-size:11px!important}
 .mobile-bottom button.selected{position:relative;background:transparent!important}
 .mobile-bottom button.selected:after{content:"";position:absolute;left:20%;right:20%;bottom:-4px;height:3px;border-radius:3px;background:#8e63ff;box-shadow:0 0 9px #8855ff}
 .mobile-bottom .tab-icon{display:grid;place-items:center}
 .mobile-bottom .tab-icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
}

/* Center the leaf mark by itself in the phone header. */
@media(min-width:768px){
 html.phone-preview .sidebar>.brand{position:relative!important;justify-content:center!important}
 html.phone-preview .sidebar>.brand .brand-name{display:none!important}
 html.phone-preview .sidebar>.brand .brand-icon{position:absolute!important;left:50%!important;top:4px!important;width:52px!important;height:52px!important;transform:translateX(-50%)!important}
 html.phone-preview .sidebar>.brand .mobile-top-actions{position:absolute!important;right:0!important;top:7px!important;margin:0!important}
}
@media(max-width:767px){
 .sidebar>.brand{position:relative!important;justify-content:center!important}
 .sidebar>.brand .brand-name{display:none!important}
 .sidebar>.brand .brand-icon{position:absolute!important;left:50%!important;top:2px!important;width:52px!important;height:52px!important;transform:translateX(-50%)!important}
 .sidebar>.brand .mobile-top-actions{position:absolute!important;right:0!important;top:4px!important;margin:0!important}
}

/* Use the isolated centered leaf asset and keep Contacts behind the top + button. */
@media(min-width:768px){
 html.phone-preview .brand-icon img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;border-radius:0!important;filter:drop-shadow(0 0 5px #336cff66)}
 html.phone-preview .mobile-bottom{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:767px){
 .brand-icon img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;border-radius:0!important;filter:drop-shadow(0 0 5px #336cff66)}
 .mobile-bottom{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(min-width:768px){
 html.phone-preview .sidebar>.brand .brand-icon{display:none!important}
 html.phone-preview .sidebar>.brand .header-profile-avatar{position:absolute!important;left:50%!important;top:4px!important;width:52px!important;height:52px!important;transform:translateX(-50%)!important;display:grid!important;place-items:center!important;padding:0!important;overflow:hidden!important;border:2px solid #69c8ff!important;border-radius:50%!important;background-color:#121a31!important;background-repeat:no-repeat!important;color:#f7f8ff!important;font:700 15px/1 system-ui!important;box-shadow:0 0 17px #376dff7a,0 0 18px #8b3bff3d!important}
}
@media(max-width:767px){
 .sidebar>.brand .brand-icon{display:none!important}
 .sidebar>.brand .header-profile-avatar{position:absolute!important;left:50%!important;top:2px!important;width:52px!important;height:52px!important;transform:translateX(-50%)!important;display:grid!important;place-items:center!important;padding:0!important;overflow:hidden!important;border:2px solid #69c8ff!important;border-radius:50%!important;background-color:#121a31!important;background-repeat:no-repeat!important;color:#f7f8ff!important;font:700 15px/1 system-ui!important;box-shadow:0 0 17px #376dff7a,0 0 18px #8b3bff3d!important}
}

/* Profile photo crop and full-size viewer */
.avatar-crop-panel{margin:10px 0 14px;padding:13px;border:1px solid #3c3153;border-radius:14px;background:linear-gradient(145deg,#111329,#11101c)}.avatar-crop-panel h3{margin:0 0 10px;color:#f4efff;font-size:13px}.avatar-crop-viewport{position:relative;width:min(100%,280px);aspect-ratio:1;margin:0 auto;overflow:hidden;border-radius:16px;background:#080b17;border:1px solid #6252ba;box-shadow:0 0 22px #4e44c755;touch-action:none;cursor:grab}.avatar-crop-viewport:active{cursor:grabbing}.avatar-crop-viewport img{position:absolute;max-width:none;object-fit:fill;user-select:none;-webkit-user-drag:none;pointer-events:none}.crop-zoom{display:grid;gap:7px;margin:12px 0 6px;font-size:11px;color:#d8d1ee}.crop-zoom input{width:100%;accent-color:#755cff}.avatar-crop-panel>p{margin:5px 0 11px;color:#9f9ab4;font-size:10px;text-align:center}.crop-actions{display:flex;justify-content:flex-end;align-items:center;gap:15px}.crop-actions .primary{padding:9px 14px;border-radius:9px}.crop-actions button:disabled{opacity:.55;cursor:wait}.profile-preview{cursor:pointer}.avatar-viewer{position:relative;display:grid;place-items:center;width:min(92vw,720px);height:min(88dvh,820px);padding:16px;background:#090b13;border:1px solid #ffffff22;border-radius:18px}.avatar-viewer img{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px}.avatar-viewer-close{position:absolute;right:10px;top:10px;z-index:2;background:#171522;color:#fff}
/* Profile lookup privacy, temporary conversations, centered crop and roomy composer */
.avatar-crop-viewport img{transform:translate(-50%,-50%);object-fit:fill}
.composer{align-items:flex-end;min-height:56px;padding:8px 8px 8px 10px;border-radius:20px;transition:border-color .2s,box-shadow .2s,background .2s}
.composer textarea{display:block;flex:1;min-width:0;max-height:160px;min-height:38px;resize:none;overflow-y:auto;border:0;outline:0;background:transparent;color:#f4efff;padding:9px 8px;font:inherit;font-size:14px;line-height:1.45;scrollbar-width:thin}
.composer textarea::placeholder{color:#958ca5}
.composer textarea:disabled{opacity:.55}
.composer .compose-action,.composer .send{flex:none;margin-bottom:1px}
.composer .send{width:40px;height:40px;border-radius:50%;font-size:20px}
.contact-lookup{display:flex;gap:7px;margin:6px 2px 8px;padding:4px;border:1px solid #392d4b;border-radius:14px;background:#17131f}
.contact-lookup input{flex:1;min-width:0;height:34px;padding:0 10px;border:0;outline:0;background:transparent;color:#f4efff;font-size:12px}
.contact-lookup input::placeholder{color:#90879d}
.contact-lookup button{width:36px;height:34px;border-radius:11px;background:linear-gradient(135deg,#a633ef,#315dff);color:#fff;font-size:22px;line-height:1}
.temporary-toggle{font-size:19px;color:#bca8d3;border:1px solid #3b3049;border-radius:12px;min-width:38px;height:38px}
.temporary-toggle.is-temporary{color:#fff;background:linear-gradient(135deg,#8328ce,#315dff);box-shadow:0 0 18px #6d49ff55;border-color:#8f58ff}
.privacy-hint{display:block;margin-top:-3px;color:#a79cb8;font-size:10px;line-height:1.45;font-weight:400}
.profile-modal .privacy-switch{display:flex!important;grid-template-columns:auto 1fr;align-items:center;gap:9px!important;padding:10px 11px;border:1px solid #3b3049;border-radius:12px;background:#17131f;font-size:11px!important;line-height:1.4}
.profile-modal .privacy-switch input{width:18px;height:18px;margin:0;accent-color:#8e42e8}
.private-handle{display:grid;gap:5px;padding:11px 12px;border:1px solid #393047;border-radius:12px;background:#15111d;color:#e8ddf3;font-size:11px}
.private-handle small{color:#a79cb8;font-size:10px;line-height:1.45}
@media(max-width:650px){.composer{min-height:54px;border-radius:22px}.composer textarea{font-size:15px;min-height:38px}.contact-lookup{margin-inline:0}.temporary-toggle{min-width:34px;width:34px;height:34px}}

/* The doodle wallpaper is limited to the message pane; the rest of the app stays clean. */
.messages{background-color:#0c0b13;background-image:url('/brisa-doodles.svg'),radial-gradient(ellipse at 50% 0,#25163726,transparent 58%);background-size:320px 320px,auto;background-repeat:repeat,no-repeat;background-attachment:local,local}
.mobile-bottom{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#contactsNav{height:36px;padding-inline:9px;font-size:11px}
@media(max-width:767px){.mobile-bottom{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:767px){#app.messages-only #contactLookupForm{display:none!important}}
@media(min-width:768px){html.phone-preview #app.messages-only #contactLookupForm{display:none!important}}
@media(max-width:650px){.header-actions{gap:5px}.tip-button{font-size:9px!important}}
.app:not(.contacts-only) #contactLookupForm{display:none!important}

.chat-expiry-settings{display:grid;gap:8px;margin:0 0 17px;padding:13px;border:1px solid #3b304b;border-radius:14px;background:linear-gradient(145deg,#171324,#12101a)}.chat-expiry-settings h3{margin:0;color:#eee5fa;font-size:13px}.chat-expiry-settings p{margin:0;color:#a99fba;font-size:11px;line-height:1.5}.chat-expiry-settings select{width:100%;height:42px;padding:0 12px;border:1px solid #49385b;border-radius:11px;background:#171320;color:#f4efff;font:inherit;font-size:12px;outline:0}.chat-expiry-settings select:focus{border-color:#a64ae8;box-shadow:0 0 0 3px #963aff1c}.chat-expiry-settings small{color:#a99fba;font-size:10px;line-height:1.4}#mobileMore.mobile-round-action{width:34px!important;height:34px!important;font-size:15px!important;letter-spacing:1px!important}
@media(max-width:650px){.chat-expiry-settings{padding:12px}.chat-expiry-settings select{height:44px}#mobileMore.mobile-round-action{width:34px!important;height:34px!important}}


/* Emoji picker integrated in Brisa's message composer. */
.composer-wrap{position:relative}
.emoji-toggle{flex:none;width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#c9c1dd;font:400 25px/1 system-ui;cursor:pointer;transition:background .18s,color .18s,transform .18s}
.emoji-toggle:hover:not(:disabled),.emoji-toggle[aria-expanded="true"]{background:#9c64ef25;color:#e8d4ff;transform:scale(1.06)}
.emoji-toggle:disabled{opacity:.42;cursor:default}
.emoji-picker{position:absolute;z-index:30;left:10px;bottom:calc(100% + 10px);width:min(350px,calc(100vw - 44px));height:min(390px,52dvh);min-height:270px;padding:12px;border:1px solid #544372;border-radius:18px;background:linear-gradient(155deg,#171528f7,#101322f8 70%,#171329f7);box-shadow:0 16px 48px #0009,0 0 24px #7448c52b;backdrop-filter:blur(20px);display:flex;flex-direction:column;gap:8px}
.emoji-picker.hidden{display:none!important}
.emoji-picker-compact #emojiCategories,.emoji-picker-compact #emojiGroupLabel{display:none!important}
.emoji-option{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",system-ui,sans-serif;font-size:26px;line-height:1.3;overflow:visible}
.emoji-grid{gap:4px;padding:5px 3px 7px}
.sticker-art{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",system-ui,sans-serif;line-height:1.25;overflow:visible}
.attach-menu{position:absolute;z-index:40;left:9px;bottom:calc(100% + 8px);width:min(260px,calc(100% - 18px));padding:7px;display:grid;gap:3px;border:1px solid #3d3451;border-radius:16px;background:linear-gradient(150deg,#1a1726f7,#100f18fa);box-shadow:0 12px 32px #0009;backdrop-filter:blur(18px)}
.attach-menu.hidden{display:none!important}
.attach-menu button{display:flex;align-items:center;gap:10px;width:100%;min-height:53px;padding:7px 9px;border:0;border-radius:11px;background:transparent;color:#eee8f8;text-align:left}
.attach-menu button:hover{background:#ffffff0c}
.attach-menu button>span:first-child{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:11px;background:#8052b522;font-size:18px}
.attach-menu button>span:last-child{display:grid;gap:3px;min-width:0}
.attach-menu b{font-size:12px;font-weight:650}
.attach-menu small{color:#a99fb8;font-size:10px}
@media(max-width:767px){.emoji-option{font-size:25px}.attach-menu{left:8px;bottom:calc(100% + 7px);width:min(280px,calc(100vw - 32px))}}
.emoji-picker-top{display:flex;align-items:center;gap:7px}
.emoji-search{flex:1;min-width:0;height:38px;display:flex;align-items:center;gap:7px;padding:0 11px;border:1px solid #ffffff14;border-radius:12px;background:#ffffff0b;color:#aea2c7}
.emoji-search span{font-size:21px;line-height:1}
.emoji-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#f7f3ff;font:inherit;font-size:12px}
.emoji-search input::placeholder{color:#9991a9}
.emoji-close{width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:10px;background:#ffffff0c;color:#cfc6df;font-size:22px;cursor:pointer}
.emoji-categories{display:flex;gap:3px;overflow-x:auto;padding:1px 0 5px;border-bottom:1px solid #ffffff12;scrollbar-width:none}
.emoji-categories::-webkit-scrollbar{display:none}
.emoji-category{flex:none;width:34px;height:34px;border:0;border-radius:10px;background:transparent;color:#a99fba;font-size:20px;cursor:pointer}
.emoji-category:hover,.emoji-category.active{background:#8755ce2b;color:#e9d8ff}
.emoji-group-label{padding:1px 3px 0;color:#b9b0c8;font-size:10px;font-weight:650;letter-spacing:.04em}
.emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-content:start;gap:2px;overflow-y:auto;padding:1px 2px 4px;scrollbar-color:#64518a transparent;scrollbar-width:thin}
.emoji-option{aspect-ratio:1;min-width:0;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;font:24px/1 system-ui,sans-serif;cursor:pointer;transition:background .12s,transform .12s}
.emoji-option:hover{background:#ffffff12;transform:scale(1.12)}
.emoji-empty{grid-column:1/-1;padding:24px 6px;color:#a79db5;text-align:center;font-size:12px}
@media(max-width:650px){.emoji-picker{left:0;width:min(360px,calc(100vw - 38px));height:min(360px,48dvh);min-height:250px;padding:10px;border-radius:17px}.emoji-grid{grid-template-columns:repeat(8,minmax(0,1fr))}.emoji-option{font-size:23px}.emoji-toggle{width:34px;height:38px}}

.emoji-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;border-radius:11px;background:#ffffff09}
.emoji-mode-tabs button{height:30px;border:0;border-radius:8px;background:transparent;color:#aaa0bb;font-size:11px;font-weight:650;cursor:pointer}
.emoji-mode-tabs button.active{background:#8d51d42c;color:#ead8ff;box-shadow:inset 0 0 0 1px #b483ff32}
.sticker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:7px;overflow-y:auto;padding:2px 1px 5px;scrollbar-color:#64518a transparent;scrollbar-width:thin}
.sticker-grid.hidden{display:none!important}
.sticker-option{min-width:0;min-height:81px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px 3px;border:1px solid #ffffff0d;border-radius:13px;background:linear-gradient(145deg,#ffffff0b,#ffffff04);cursor:pointer;transition:background .14s,transform .14s,border-color .14s}
.sticker-option:hover{transform:translateY(-2px);border-color:#9d67d066;background:#a762eb20}
.sticker-art{font-size:32px;line-height:1.1;filter:drop-shadow(0 2px 5px #a348ef35)}
.sticker-label{max-width:100%;overflow:hidden;color:#c6bbd5;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.sticker-message{max-width:76%;width:max-content}
.sticker-message-content{min-width:105px;text-align:center}
.sticker-message-art{padding:4px 10px;font:58px/1.2 system-ui,sans-serif;filter:drop-shadow(0 4px 10px #9c55f23b);animation:sticker-pop .22s ease-out both}
.sticker-message-label{margin-top:1px;color:#e3d8f2;font-size:10px;font-weight:600;text-shadow:0 1px 5px #070611}
.sticker-message .stamp{margin-top:3px}
@keyframes sticker-pop{from{opacity:0;transform:scale(.76)}to{opacity:1;transform:scale(1)}}
@media(max-width:650px){.sticker-grid{gap:6px}.sticker-option{min-height:76px}.sticker-art{font-size:30px}.sticker-message-art{font-size:62px}}

/* Keep the emoji/sticker tray inside the available phone viewport. */
.emoji-picker{width:min(350px,calc(100vw - 28px));height:min(390px,calc(100dvh - 170px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));min-height:0;max-height:calc(100dvh - 170px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:hidden}
.emoji-grid,.sticker-grid{flex:1 1 auto;min-height:0;overscroll-behavior:contain}
.emoji-picker-top,.emoji-mode-tabs,.emoji-categories,.emoji-group-label{flex:none;min-width:0}
@media(max-width:650px){.emoji-picker{left:0;bottom:calc(100% + 7px);width:min(350px,calc(100vw - 28px));height:min(350px,calc(100dvh - 155px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));min-height:0;max-height:calc(100dvh - 155px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:9px}.emoji-grid,.sticker-grid{flex:1 1 auto;min-height:0}}

/* Compactar el selector para que siempre quede dentro del chat en pantallas pequeñas. */
.emoji-picker{box-sizing:border-box;width:min(340px,calc(100vw - 24px));height:min(340px,42dvh);max-height:calc(100dvh - 150px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:0;padding:10px;gap:6px;overflow:hidden}
.emoji-grid,.sticker-grid{min-width:0;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.sticker-option{min-width:0;min-height:72px;padding:5px 3px}
@media(max-width:767px){
  .emoji-picker{left:12px;right:12px;bottom:calc(100% + 7px);width:auto;height:min(310px,40dvh);max-height:calc(100dvh - 145px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:9px;border-radius:16px}
  .emoji-category{width:32px;height:32px}
  .emoji-grid{grid-template-columns:repeat(8,minmax(0,1fr))}
  .emoji-option{font-size:22px}
  .sticker-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .sticker-option{min-height:68px}
  .sticker-art{font-size:28px}
}

/* Indicador de desplazamiento discreto para recorrer el historial del chat. */
.messages{scrollbar-width:thin;scrollbar-color:#705795 transparent}
.messages::-webkit-scrollbar{width:5px}
.messages::-webkit-scrollbar-track{background:transparent;margin-block:8px}
.messages::-webkit-scrollbar-thumb{border:1px solid transparent;border-radius:99px;background:linear-gradient(180deg,#8c68b8a6,#66518b99) padding-box;box-shadow:0 0 4px #8c68b833}
.messages::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#a184c5c7,#8068a8b8) padding-box;box-shadow:0 0 5px #9b7ac344}
.messages::-webkit-scrollbar-button{display:none;width:0;height:0}

/* Destello ocasional solo en el contorno del botón de propina. */
.tip-button{position:relative;isolation:isolate;overflow:visible}
.tip-button::before{content:"";position:absolute;z-index:0;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from 0deg,transparent 0deg 285deg,#9d7ed766 306deg,#e4d6ff 320deg,#a8e5ffb3 329deg,transparent 346deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;pointer-events:none;animation:tip-border-glint 12s linear infinite}
.tip-button::after{content:"";position:absolute;z-index:1;top:1px;right:22%;width:3px;height:3px;border-radius:50%;background:#e8dcff;box-shadow:0 0 4px 1px #c9aaff66,9px 2px 0 -1px #b8e9ff;opacity:0;pointer-events:none;animation:tip-border-sparks 12s ease-in-out infinite}
@keyframes tip-border-glint{0%,2%{opacity:0;transform:rotate(0deg)}3%{opacity:.46}4%{opacity:.12}5%{opacity:.54}7%,100%{opacity:0;transform:rotate(360deg)}}

/* Deja espacio para glifos emoji altos y tonos de piel sin recortarlos. */
.emoji-grid{grid-auto-rows:minmax(40px,auto);align-content:start;padding:5px 4px 8px}
.emoji-option{aspect-ratio:auto;min-height:40px;padding:2px;overflow:visible;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",system-ui,sans-serif;font-size:26px;line-height:1.25;white-space:nowrap}
.emoji-option:hover{transform:scale(1.04)}
.sticker-art{display:block;padding:2px;line-height:1.3;overflow:visible}
@media(max-width:767px){.emoji-grid{grid-auto-rows:minmax(39px,auto)}.emoji-option{min-height:39px;font-size:24px;line-height:1.25}}
@keyframes tip-border-sparks{0%,2%,8%,100%{opacity:0;transform:scale(.5) rotate(0deg)}3.5%{opacity:.7;transform:scale(1) rotate(45deg)}5%{opacity:.15;transform:scale(.65) rotate(90deg)}6.5%{opacity:.55;transform:scale(.9) rotate(135deg)}}
@media(prefers-reduced-motion:reduce){.tip-button::before,.tip-button::after{animation:none;opacity:0}}

/* Estados con publicaciones agrupadas y visor seguro de pantalla completa. */
.status-form>input[type=url]{width:100%;height:40px;padding:0 11px;border:1px solid #3a3148;border-radius:10px;background:#100d17;color:#f5efff;font:inherit;font-size:12px;outline:0}
.status-form>input[type=url]:focus{border-color:#36bfff;box-shadow:0 0 0 3px #1a85ff20}
.status-upload-row,.status-record-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.status-file-button,.status-record-row .secondary{min-height:37px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 11px;border:1px solid #3b3658;border-radius:11px;background:#17142a;color:#e3d9ff;font-size:10px;font-weight:650;cursor:pointer}
.status-file-button input{display:none}
.status-record-row .secondary{background:#20142a;color:#f5d8ef}
.status-record-row #statusRecordLabel{font-size:10px;color:#b8c8df}
.status-media-name{min-height:0;color:#9dbbe4;font-size:10px;overflow-wrap:anywhere}
.status-group{width:100%;min-width:0;display:flex;align-items:center;gap:11px;padding:11px 9px;border:1px solid #263d58;border-radius:13px;background:linear-gradient(120deg,#14152a,#101927);color:inherit;text-align:left;cursor:pointer}
.status-group:hover{border-color:#5877ae;background:linear-gradient(120deg,#1c1834,#102032)}
.status-group .status-copy{flex:1;min-width:0}
.status-group .status-copy p{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status-group .status-row-head time{flex:none}
.status-ring{outline:2px solid #8d60ef;outline-offset:2px}
.status-add-mark{width:23px;height:23px;display:grid;place-items:center;flex:none;border-radius:50%;background:linear-gradient(130deg,#762cff,#08bfff);color:white;font-size:17px}
.status-total-views{margin-left:auto;max-width:82px;color:#97b3d4;font-size:9px;text-align:right}
.status-empty{padding:18px 10px;text-align:center}
.status-viewer{padding:0;background:#030714eF;backdrop-filter:blur(18px)}
.status-viewer-card{width:min(520px,100%);height:min(900px,100dvh);display:flex;flex-direction:column;overflow:hidden;border:1px solid #425077;border-radius:22px;background:radial-gradient(ellipse at 50% 15%,#26204a,#0c1220 68%);box-shadow:0 18px 65px #000a}
.status-viewer-card>header{display:flex;align-items:center;gap:10px;min-height:63px;padding:10px 13px}
.status-viewer-back{width:35px;height:35px;border-radius:50%;background:#ffffff12;color:#eff1ff;font-size:22px}
.status-viewer-person{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
.status-viewer-person>div:last-child{display:grid;gap:3px;min-width:0}
.status-viewer-person strong{font-size:12px;color:#f5f4ff}
.status-viewer-person time{font-size:9px;color:#b4b7cc}
.status-viewer-card .close{position:static;flex:none}
.status-progress{height:3px;margin:0 12px;background:#ffffff20;border-radius:9px;overflow:hidden}
.status-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#a46bff,#43d8ff);transition:width .2s}
.status-viewer-body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:13px;overflow:auto;padding:14px}
.status-viewer-media{display:block;max-width:100%;max-height:100%;object-fit:contain;border-radius:13px}
.status-viewer-body video,.status-viewer-body img{width:100%;height:100%;min-height:150px}
.status-viewer-body audio{width:min(420px,100%)}
.status-viewer-caption{max-width:100%;margin:0;padding:10px 14px;border-radius:12px;background:#090d1cbf;color:#fff;text-align:center;font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.status-viewer-link{max-width:100%;padding:10px 13px;border:1px solid #536ba3;border-radius:12px;background:#131b32;color:#9ce5ff;text-align:center;font-size:12px;overflow-wrap:anywhere}
.status-viewer-footer{display:grid;gap:8px;max-height:36%;overflow:auto;padding:11px 14px calc(12px + env(safe-area-inset-bottom));border-top:1px solid #ffffff18;background:#070b18c9}
.status-views-label{color:#e1d9ff;font-size:11px}
.status-viewers-list{display:grid;gap:5px}
.status-viewer-row{display:flex;align-items:center;gap:8px;padding:5px;border-radius:9px;background:#ffffff08}
.status-viewer-row strong{flex:1;color:#ecebfa;font-size:10px}
.status-viewer-row time{color:#a9abc0;font-size:9px}
.status-view-controls{display:flex;justify-content:space-between;gap:10px}
.status-view-controls button{min-height:34px;padding:0 12px;border:1px solid #393c5b;border-radius:10px;background:#17182a;color:#e8e4f8;font-size:10px}
.status-view-controls button:disabled{opacity:.35;cursor:default}
.app.statuses-only .mobile-search,.app.statuses-only .side-head,.app.statuses-only #conversationList,.app.statuses-only #peopleList,.app.statuses-only>.sidebar>.nav,.app.statuses-only .account{display:none!important}
.app.statuses-only #statusScreen{display:flex!important}.app.calls-only #callsScreen{display:flex!important}.app.payments-only #paymentsScreen{display:flex!important}
@media(max-width:767px){
 .mobile-bottom{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .status-screen{padding:5px 2px 20px;gap:11px}
 .status-form{gap:8px}
 .status-viewer{padding:0}
 .status-viewer-card{width:100%;height:100dvh;border:0;border-radius:0}
 .status-viewer-media{max-height:68dvh}
}

/* Conversation canvas: quiet Brisa doodles, deeper bubbles and a soft composer. */
.messages{background-color:#0a0e1b;background-image:linear-gradient(#090d19e8,#090d19e8),url('/brisa-doodles.svg');background-size:auto,320px 320px;background-repeat:repeat;background-position:center;scrollbar-gutter:stable}
.day-divider{width:max-content;max-width:85%;align-self:center;padding:6px 11px;border:1px solid #91bdff18;border-radius:20px;background:#11182acb;color:#b1bed4;font-size:9px;letter-spacing:.45px;backdrop-filter:blur(10px)}
.bubble{border:1px solid #ffffff12;background:linear-gradient(145deg,#171725f2,#151b2bf2);box-shadow:0 4px 13px #02040b38;color:#f0eff8;backdrop-filter:blur(7px)}
.mine .bubble{border:1px solid #67c7ff3d;background:linear-gradient(135deg,#4e2188f5,#244ca8f5 64%,#087a9bf5);box-shadow:0 4px 16px #05142c70;color:#fff}
.stamp{color:#a7b3c8}
.content-card{border-color:#56648870;background:#11182a;box-shadow:0 8px 25px #02040b55}
.content-info{background:linear-gradient(135deg,#11182a,#16152a);color:#f4f2ff}
.content-meta{color:#b2bad0}
.unlocked{color:#79d8ff}
.composer-wrap{border-top:1px solid #293653;background:linear-gradient(180deg,#0d1221f5,#0a0e19 42%)}
.composer{border-color:#394661;background:linear-gradient(120deg,#15182a,#111a2a);box-shadow:inset 0 1px #ffffff08}
.composer:focus-within{border-color:#537fff;box-shadow:0 0 0 3px #198cff1b,0 8px 28px #050a1766}
.composer textarea{color:#f5f3ff;caret-color:#65d8ff}
.composer textarea::placeholder{color:#9da9bd}
.compose-action,.emoji-toggle{color:#c4c6dc}
.composer-note{color:#8e9bb0}
.status-upload-preview{max-height:210px;margin:2px 0 6px;border:1px solid #53628966;border-radius:12px;background:#0a1020;overflow:hidden}
.status-upload-preview.hidden{display:none!important}
.status-upload-preview-media{display:block;width:100%;max-height:208px;object-fit:contain}
.mobile-menu{width:35px!important;min-width:35px!important;height:35px!important;padding:0!important;display:grid!important;place-items:center!important;flex:none!important;border:1px solid #5266a0!important;border-radius:50%!important;background:linear-gradient(145deg,#17162b,#101a2b)!important;color:#dcecff!important;font-size:20px!important;line-height:1!important;box-shadow:0 3px 12px #060a1850,inset 0 1px #ffffff12!important}
.mobile-menu span{display:none!important}
.mobile-menu:hover{border-color:#58caff!important;background:linear-gradient(145deg,#231b3c,#12243a)!important;color:#fff!important}
@media(max-width:767px){.mobile-menu{width:33px!important;min-width:33px!important;height:33px!important;font-size:19px!important}}
.tip-button::after{content:"✦";top:-5px;left:-9px;right:auto;width:auto;height:auto;border-radius:0;background:none;box-shadow:0 0 7px #bdeeffa8,0 0 12px #9a72ff70;color:#e9faff;font-size:10px;line-height:1;animation:tip-star-cross 13s ease-in-out infinite}
@keyframes tip-star-cross{0%,73%,100%{opacity:0;transform:translate(-5px,-2px) rotate(-15deg) scale(.55)}75%{opacity:.95}78%{opacity:.45;transform:translate(22px,5px) rotate(40deg) scale(.85)}81%{opacity:1;transform:translate(53px,11px) rotate(100deg) scale(.65)}84%{opacity:0;transform:translate(68px,14px) rotate(150deg) scale(.3)}}
@media(prefers-reduced-motion:reduce){.tip-button::after{animation:none;opacity:0}}
.mobile-menu{width:30px!important;min-width:30px!important;height:34px!important;padding:0!important;display:grid!important;place-items:center!important;flex:none!important;border:0!important;border-radius:0!important;background:transparent!important;color:#cce8ff!important;font-size:23px!important;font-weight:500!important;line-height:1!important;box-shadow:none!important;text-shadow:0 0 8px #55bfff30!important}
.mobile-menu span{display:none!important}
.mobile-menu:hover{border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;box-shadow:none!important;text-shadow:0 0 9px #60caffb0!important}
.mobile-menu:focus-visible{outline:0!important;color:#fff!important;text-shadow:0 0 10px #57caff!important}
@media(max-width:767px){.mobile-menu{width:28px!important;min-width:28px!important;height:32px!important;font-size:22px!important}}

/* Compact, device-sized chat list preview */
html.phone-preview .mobile-title{margin:7px 0 7px!important;font-size:31px!important;line-height:1.06!important;letter-spacing:-.9px!important}
html.phone-preview .mobile-search{height:36px!important;min-height:36px!important;margin:0 0 8px!important;padding:0 10px!important}
html.phone-preview .mobile-search span{font-size:18px!important}
html.phone-preview .mobile-search input{font-size:12px!important}
html.phone-preview .conv-row,html.phone-preview .person-row{min-height:69px!important;padding:7px 1px!important;gap:10px!important}
html.phone-preview .avatar{width:47px!important;height:47px!important}
html.phone-preview .row-top strong{font-size:14px!important}
html.phone-preview .row-time{font-size:10px!important}
html.phone-preview .row-sub{font-size:11px!important}
@media(max-width:767px){.mobile-title{margin:7px 0 7px!important;font-size:31px!important;line-height:1.06!important}.mobile-search{height:36px!important;min-height:36px!important;margin-bottom:8px!important;padding:0 10px!important}.conv-row,.person-row{min-height:69px!important;padding:7px 1px!important;gap:10px!important}.conv-row .avatar,.person-row .avatar{width:47px!important;height:47px!important}}
html.phone-preview .mobile-bottom{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.messages{background-color:#0a0e1b!important;background-image:linear-gradient(#090d1968,#090d1968),url('/brisa-doodles.svg'),radial-gradient(ellipse at 50% 0,#241d4930,transparent 62%)!important;background-size:auto,320px 320px,auto!important;background-repeat:repeat,repeat,no-repeat!important;background-position:center!important;background-attachment:local,local,local!important}
.messages.has-chat-wallpaper{background-image:linear-gradient(#080d1a70,#080d1a70),var(--chat-wallpaper)!important;background-size:auto,cover!important;background-repeat:repeat,no-repeat!important;background-position:center!important;background-attachment:local,local!important}
.chat-header{position:relative!important;isolation:isolate!important;overflow:hidden!important;background:linear-gradient(110deg,#123981 0%,#145ed0 42%,#087fb0 72%,#123b8c 100%)!important;background-size:220% 220%!important;animation:brisa-header-flow 18s ease-in-out infinite!important;border-bottom:1px solid #69caff66!important;box-shadow:0 5px 20px #11165c55,inset 0 1px #ffffff18!important}
.chat-header::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 0,#715bff2e,transparent 46%),radial-gradient(ellipse at 88% 100%,#00d8ff42,transparent 48%);opacity:.9}
.chat-header::after{content:"";position:absolute;z-index:0;left:-35%;right:-35%;bottom:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,#bd7aff,#59eaff,#746cff,transparent);background-size:200% 100%;animation:brisa-header-line 8s linear infinite;opacity:.85}
.chat-header>*{position:relative;z-index:1}
.chat-header .header-copy strong{color:#fff!important;text-shadow:0 1px 10px #1d1748a8!important}
.chat-header .header-copy span{color:#d8e6ff!important}
@media(prefers-reduced-motion:reduce){.chat-header,.chat-header::after{animation:none!important}}

/* Opciones opcionales de texto y enlace en estados. */
.status-option-row{display:flex;gap:8px;margin-bottom:2px}
.status-option{min-height:34px;padding:0 14px;border:1px solid #3b4b6a;border-radius:999px;background:#11182a;color:#c7d2ea;font:inherit;font-size:11px;font-weight:700;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.status-option.active{border-color:#538bff;background:linear-gradient(120deg,#202457,#103f63);color:#e8f8ff;box-shadow:0 0 12px #308dff28}
.status-compose-field{display:grid;gap:6px}
.status-form .status-compose-field.hidden{display:none!important}
.status-viewer-caption a{color:#89d7ff;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}

/* Cada pestaña móvil muestra su propia sección sin superponer paneles. */
.app.statuses-only #callsScreen,.app.calls-only #statusScreen{display:none!important}

/* Lista compacta para que entren alrededor de siete conversaciones en el móvil. */
.conversation-item{position:relative;display:flex;align-items:center;min-width:0}
.conversation-item .conv-row{flex:1;padding-right:38px}
.pin-chat-button{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:27px;height:27px;border-radius:8px;background:transparent;color:#99a3bd;opacity:.58;font-size:12px;transition:opacity .16s,background .16s,color .16s}
.conversation-item:hover .pin-chat-button,.pin-chat-button.pinned{opacity:1}
.pin-chat-button.pinned{background:#19334a;color:#8ee9ff}
.pin-chat-button:hover{background:#202943;color:#d5f8ff}
@media(max-width:767px){.sidebar{padding-top:calc(6px + env(safe-area-inset-top))!important;padding-bottom:calc(59px + env(safe-area-inset-bottom))!important}.brand{padding-bottom:8px!important}.header-profile-avatar{width:42px!important;height:42px!important}.mobile-round-action{width:36px!important;height:36px!important}.mobile-title{margin:4px 0 5px!important;font-size:28px!important;line-height:1.04!important}.mobile-search{height:33px!important;min-height:33px!important;margin-bottom:5px!important;padding:0 9px!important}.conversation-list,.people-list{gap:0!important}.conversation-item,.conv-row,.person-row{height:59px!important;min-height:59px!important}.conversation-item .conv-row{padding:5px 37px 5px 1px!important;gap:9px!important;border-bottom:1px solid #263044!important;border-radius:0!important;background:transparent!important}.conv-row .avatar,.person-row .avatar{width:41px!important;height:41px!important}.row-top strong{font-size:12px!important}.row-time{font-size:9px!important}.row-sub{margin-top:2px!important;font-size:10px!important}.pin-chat-button{right:5px;width:24px;height:24px;font-size:10px}}
html.phone-preview .conversation-item,html.phone-preview .conv-row{height:59px!important;min-height:59px!important}
html.phone-preview .conversation-item .conv-row{padding:5px 37px 5px 1px!important;border-bottom:1px solid #263044!important}
html.phone-preview .conversation-item .avatar{width:41px!important;height:41px!important}
/* Fijar aparece solo al deslizar una conversación, con transición tipo mensajería móvil. */
.conversation-item{overflow:hidden;border-radius:12px;touch-action:pan-y;overscroll-behavior-x:contain}
.conversation-item .conv-row{position:relative;z-index:1;touch-action:pan-y;transition:transform .24s cubic-bezier(.2,.75,.25,1);will-change:transform}
.pin-chat-button{z-index:0;right:-74px;top:0;transform:none;width:74px;height:100%;min-height:100%;border-radius:0;display:grid;place-items:center;background:linear-gradient(145deg,#21468c,#165f95);color:#e6f8ff;opacity:0;pointer-events:none;font-size:12px;font-weight:700;transition:right .24s cubic-bezier(.2,.75,.25,1),opacity .18s,background .18s}
.conversation-item.revealed .conv-row{transform:translateX(-74px)}
.conversation-item.revealed .pin-chat-button{right:0;opacity:1;pointer-events:auto}
.conversation-item.revealed .pin-chat-button.pinned{background:linear-gradient(145deg,#5b368f,#245aa4);color:#fff}
@media(prefers-reduced-motion:reduce){.conversation-item .conv-row,.pin-chat-button{transition:none!important}}
/* Densidad para mostrar hasta ocho chats en pantallas móviles comunes. */
@media(max-width:767px){.app.messages-only .conversation-item,.app.messages-only .conversation-item .conv-row{height:50px!important;min-height:50px!important}.app.messages-only .conversation-item .conv-row{padding-top:3px!important;padding-bottom:3px!important;gap:7px!important}.app.messages-only .conversation-item .avatar{width:35px!important;height:35px!important;font-size:10px!important}.app.messages-only .conversation-item .row-top strong{font-size:11px!important}.app.messages-only .conversation-item .row-time{font-size:8px!important}.app.messages-only .conversation-item .row-sub{margin-top:1px!important;font-size:9px!important;line-height:1.1!important}.app.messages-only .pin-chat-button{width:74px!important;height:100%!important}}
html.phone-preview .app.messages-only .conversation-item,html.phone-preview .app.messages-only .conversation-item .conv-row{height:50px!important;min-height:50px!important}
html.phone-preview .app.messages-only .conversation-item .avatar{width:35px!important;height:35px!important}
/* Estados: publicaciones arriba y Mi estado al final; el compositor se abre desde +. */
.status-compose-header{display:flex;align-items:center;justify-content:space-between;margin:0 0 4px}
.status-compose-header h3{margin:0;color:#eaf7ff;font-size:15px}
.status-compose-header button{width:30px;height:30px;border:0;border-radius:50%;background:#152542;color:#dff5ff;font-size:18px;cursor:pointer}
.status-screen.status-compose-active .status-heading{display:none}
.status-screen.status-compose-active .status-form:not(.hidden){animation:status-compose-in .2s ease-out both}
@keyframes status-compose-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.own-status-group{order:999;cursor:default}
.own-status-avatar{padding:0;border:1px solid #4269b1;cursor:pointer}
.own-status-group .status-copy{cursor:pointer}
.own-status-group .status-add-mark{border:0;cursor:pointer;transition:transform .18s,box-shadow .18s}
.own-status-group .status-add-mark:hover{transform:scale(1.08);box-shadow:0 0 14px #168fff65}
.own-status-group .status-add-mark:focus-visible,.status-compose-header button:focus-visible{outline:2px solid #70d9ff;outline-offset:2px}
/* Botones compactos del encabezado y acceso a contactos con icono de grupo. */
.mobile-top-actions{gap:6px!important}
.mobile-round-action{width:30px!important;height:30px!important;font-size:13px!important;box-shadow:0 2px 8px #0005!important;transition:transform .18s,filter .18s!important}
.mobile-round-action:first-child{font-size:12px!important;letter-spacing:1px!important}
.mobile-round-action.new-chat-action{display:grid!important;place-items:center!important;font-size:0!important}
.mobile-round-action.new-chat-action svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mobile-round-action:hover{transform:scale(1.05);filter:brightness(1.08)}
@media(max-width:767px){.sidebar>.brand .mobile-top-actions .mobile-round-action{width:30px!important;height:30px!important;min-width:30px!important;padding:0!important}.sidebar>.brand .mobile-top-actions{gap:6px!important}}
html.phone-preview .sidebar>.brand .mobile-top-actions .mobile-round-action{width:30px!important;height:30px!important;min-width:30px!important;padding:0!important}
html.phone-preview .sidebar>.brand .mobile-top-actions{gap:6px!important}

.profile-settings-list{margin:14px 0 4px}
.profile-settings-list h3{font-size:13px;color:#eee4f8;margin:0 0 7px}
.profile-setting-option{width:100%;display:flex;align-items:center;gap:11px;padding:10px 11px;border:1px solid #344872;border-radius:12px;background:linear-gradient(135deg,#11182b,#17142d);color:#eaf7ff;text-align:left;cursor:pointer;transition:border-color .18s,background .18s}
.profile-setting-option:hover,.profile-setting-option:focus-visible{border-color:#5e8ddd;background:linear-gradient(135deg,#15223a,#211a3a);outline:none}
.profile-setting-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#1b2e55;color:#78d5ff;font-size:16px}
.profile-setting-copy{display:grid;gap:3px;flex:1}
.profile-setting-copy strong{font-size:11px}
.profile-setting-copy small{font-size:9px;color:#aebbd1}
.profile-setting-arrow{font-size:19px;color:#9db8e4;transition:transform .2s}
.profile-setting-option[aria-expanded=true] .profile-setting-arrow{transform:rotate(90deg)}

/* La barra de pestañas queda junto al borde inferior para dejar más alto a la lista. */
@media(max-width:767px){.mobile-bottom{bottom:calc(6px + env(safe-area-inset-bottom))!important}}
html.phone-preview .mobile-bottom{bottom:10px!important}

/* Acciones superiores más discretas: perfil y buscar/agregar contactos. */
.mobile-top-actions{gap:5px!important}
#mobileMore.mobile-round-action,.sidebar>.brand #newChat.mobile-round-action{width:27px!important;height:27px!important;min-width:27px!important;padding:0!important;border-radius:50%!important}
#mobileMore.mobile-round-action{font-size:11px!important;letter-spacing:1px!important}
.sidebar>.brand #newChat.mobile-round-action{font-size:0!important;box-shadow:0 0 10px #147fff38!important}
.sidebar>.brand #newChat.mobile-round-action svg{width:14px!important;height:14px!important}

/* Barra inferior fija tipo cristal, separada del indicador de inicio del teléfono. */
.mobile-bottom{position:fixed!important;bottom:calc(18px + env(safe-area-inset-bottom))!important;background:rgba(18,20,37,.62)!important;border-color:#8b8cff65!important;box-shadow:0 8px 24px #0006,inset 0 1px #ffffff1b!important;backdrop-filter:blur(22px) saturate(145%)!important;-webkit-backdrop-filter:blur(22px) saturate(145%)!important}
.mobile-bottom button{gap:2px!important;font-size:9px!important}
.mobile-bottom button .tab-icon svg{width:21px!important;height:21px!important}
html.phone-preview .mobile-bottom{position:fixed!important;bottom:24px!important;background:rgba(18,20,37,.62)!important;border-color:#8b8cff65!important;box-shadow:0 8px 24px #0006,inset 0 1px #ffffff1b!important;backdrop-filter:blur(22px) saturate(145%)!important;-webkit-backdrop-filter:blur(22px) saturate(145%)!important}
html.phone-preview .mobile-bottom button{font-size:9px!important;gap:2px!important}
html.phone-preview .mobile-bottom button .tab-icon svg{width:21px!important;height:21px!important}

/* Compactar la cápsula de navegación conservando tres pestañas y el efecto de cristal. */
.mobile-bottom{left:24px!important;right:24px!important;width:auto!important;height:56px!important;padding:3px 5px!important;border-radius:30px!important}
html.phone-preview .mobile-bottom{left:24px!important;right:24px!important;width:auto!important;height:56px!important;padding:3px 5px!important;border-radius:30px!important;bottom:26px!important}
.mobile-bottom button .tab-icon svg{width:19px!important;height:19px!important}
html.phone-preview .mobile-bottom button .tab-icon svg{width:19px!important;height:19px!important}

/* En la maqueta de teléfono, la barra se ancla al marco de Brisa y no al navegador. */
html.phone-preview #app{position:relative!important;overflow:hidden!important;contain:layout paint!important}
html.phone-preview .sidebar{position:absolute!important;inset:0!important;overflow:hidden!important}
html.phone-preview .mobile-bottom{position:absolute!important;left:24px!important;right:24px!important;bottom:26px!important;width:auto!important;max-width:calc(100% - 48px)!important;box-sizing:border-box!important;z-index:5!important}

.tip-button{display:grid;place-items:center;width:34px;height:34px;min-width:34px;padding:0!important;border-radius:50%;font-size:17px!important;font-weight:800;line-height:1}

.voice-recording-bar{display:flex;align-items:center;gap:9px;min-height:42px;margin:0 0 8px;padding:6px 9px;border:1px solid #3f5d91;border-radius:14px;background:linear-gradient(120deg,#101c35ed,#15142bed);color:#eaf5ff;box-shadow:inset 0 1px #ffffff0d}
.voice-recording-bar.hidden{display:none!important}
.voice-recording-dot{width:8px;height:8px;flex:none;border-radius:50%;background:#ff5d78;box-shadow:0 0 9px #ff315b88;animation:voice-dot-pulse 1s ease-in-out infinite}
#voiceRecordingStatus{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:#dbe9ff}
#voiceRecordingTime{font-variant-numeric:tabular-nums;font-size:10px;color:#a8c7f2}
.voice-lock-actions{display:none;align-items:center;gap:5px}
.voice-recording-bar.locked .voice-lock-actions{display:flex}
.voice-lock-actions button{width:28px;height:28px;display:grid;place-items:center;border:1px solid #6a7ba5;border-radius:50%;background:#202943;color:#e9f4ff;font-size:18px;line-height:1}
.voice-lock-actions #voiceSendNow{border-color:#44bdf5;background:linear-gradient(135deg,#2355bb,#087eae);color:white}
.send.voice-ready{background:linear-gradient(135deg,#2d5ad4,#078db5)!important;color:#fff!important;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.send.voice-pressed{transform:scale(.94);box-shadow:0 0 0 5px #3597ff24,0 0 16px #248dff75}
@keyframes voice-dot-pulse{50%{opacity:.45;transform:scale(.82)}}
@media(prefers-reduced-motion:reduce){.voice-recording-dot{animation:none}}

.profile-quick-links{display:flex;flex-wrap:wrap;align-items:center;gap:5px;max-height:46px;min-width:0;overflow:auto;scrollbar-width:thin}
.profile-quick-links:empty,.profile-quick-links.hidden{display:none!important}
.profile-quick-link{display:inline-flex;align-items:center;max-width:100%;min-height:22px;padding:3px 8px;border:1px solid #35618c;border-radius:999px;background:linear-gradient(110deg,#10233c,#142a40);color:#9cddff;text-decoration:none;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile-quick-link:after{content:'↗';margin-left:4px;color:#63cfff;font-size:9px}
.profile-quick-link:hover{border-color:#53b9ef;background:#173956}
.archived-chats-toggle{display:block;width:100%;margin:3px 0 8px;padding:8px 11px;border-radius:10px;text-align:left;background:#f4f5f8;color:#6d7280;font-size:12px;font-weight:600;cursor:pointer}.chat-swipe-actions{position:absolute;z-index:0;right:-174px;top:0;width:174px;height:100%;display:grid;grid-template-columns:repeat(3,1fr);align-items:stretch;transition:right .24s cubic-bezier(.2,.75,.25,1);background:#172644}.conversation-item.revealed .conv-row{transform:translateX(-174px)!important}.conversation-item.revealed .chat-swipe-actions{right:0}.chat-swipe-actions .pin-chat-button,.chat-swipe-actions .chat-action-button{position:static!important;top:auto!important;right:auto!important;transform:none!important;width:auto!important;height:100%!important;min-height:0!important;border-radius:0!important;display:grid!important;place-items:center!important;opacity:1!important;pointer-events:auto!important;background:transparent!important;color:#e8f3ff!important;font-size:11px!important;font-weight:700!important}.chat-swipe-actions .chat-action-button{border-left:1px solid #ffffff1c}.chat-swipe-actions .pin-chat-button.pinned{color:#8ee9ff!important}.chat-swipe-actions .chat-action-button:hover,.chat-swipe-actions .pin-chat-button:hover{background:#ffffff12!important}.mute-chat-indicator{margin-left:4px;color:#92a6c7;font-size:10px}.message-actions{display:flex;gap:6px;margin-top:3px;opacity:0;transition:opacity .16s}.message:hover .message-actions,.message-actions:focus-within{opacity:1}.message-actions button,.message-reaction-picker button{padding:3px 7px;border-radius:10px;background:#ffffff0d;color:#bcc3d8;font-size:12px}.message-reaction-picker{display:flex;gap:3px;margin-top:4px;padding:4px;width:max-content;max-width:100%;border:1px solid #ffffff18;border-radius:14px;background:#10131e;box-shadow:0 8px 26px #0007}.message-reaction-picker button{font-size:15px}.message-reaction-summary{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}.reaction-chip{padding:2px 7px;border:1px solid #ffffff19;border-radius:12px;background:#ffffff0d;color:#e5e7f1;font-size:10px;cursor:pointer}.reaction-chip.mine{border-color:#49c8ef80;background:#15384a}.message-reply-quote{display:grid;gap:2px;margin-bottom:5px;padding:5px 8px;border-left:2px solid #44c6f3;border-radius:4px;background:#ffffff0a;font-size:10px;color:#c9cee0}.message-reply-quote span{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-composer-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 8px 5px;padding:7px 10px;border-left:2px solid #43c9f1;border-radius:8px;background:#16263b;color:#d8e5f7;font-size:11px}.reply-composer-copy{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-composer-bar button{background:transparent;color:#c6d2e8;font-size:18px}.privacy-presence-settings{display:grid;gap:10px;margin:18px 0;padding:14px;border:1px solid #292b3a;border-radius:14px;background:#10121b}.privacy-presence-settings h3{margin:0 0 2px;font-size:13px}.privacy-presence-settings label{display:grid;gap:6px;color:#d7d8e3;font-size:11px}.privacy-presence-settings select{width:100%;padding:9px 10px;border:1px solid #34364a;border-radius:9px;background:#171a27;color:#f3f4fa}.privacy-presence-settings small{color:#9296a8;font-size:10px;line-height:1.45}@media(max-width:767px){.message-actions{opacity:1}.chat-swipe-actions{width:162px;right:-162px}.conversation-item.revealed .conv-row{transform:translateX(-162px)!important}}
.security-settings{display:grid;gap:9px;margin:16px 0;padding:14px;border:1px solid #292b3a;border-radius:14px;background:#10121b}.security-settings h3{margin:0 0 2px;font-size:13px}.security-settings label{display:grid;gap:5px;color:#d7d8e3;font-size:11px}.security-settings input{width:100%;padding:9px 10px;border:1px solid #34364a;border-radius:9px;background:#171a27;color:#f3f4fa}.security-settings .secondary{padding:8px 10px;border-radius:9px;background:#1a2b45;color:#dce9ff;font-size:11px}.security-settings small{color:#9296a8;font-size:10px;line-height:1.45}.app-lock-screen{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at 50% 20%,#142b48,#070a12 65%);color:#f6f8ff}.app-lock-card{width:min(360px,100%);padding:28px;border:1px solid #ffffff1f;border-radius:24px;background:#0e1421ed;box-shadow:0 22px 90px #0009;text-align:center}.app-lock-mark{width:54px;height:54px;margin:0 auto 14px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#6448ff,#20caff);font-size:30px;font-weight:800}.app-lock-card h1{margin:0 0 6px;font-size:22px}.app-lock-card p{margin:0 0 20px;color:#aab2c4}.app-lock-card input{width:100%;margin-bottom:12px;padding:13px;border:1px solid #ffffff25;border-radius:12px;background:#111a2b;color:white;text-align:center;font-size:24px;letter-spacing:8px}.chat-swipe-actions{width:212px!important;right:-212px!important;grid-template-columns:repeat(4,1fr)!important}.conversation-item.revealed .conv-row{transform:translateX(-212px)!important}@media(max-width:767px){.chat-swipe-actions{width:196px!important;right:-196px!important}.conversation-item.revealed .conv-row{transform:translateX(-196px)!important}}
.status-list{display:flex!important;flex-wrap:nowrap!important;gap:11px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:4px 3px 10px!important;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none}.status-list::-webkit-scrollbar{display:none}.status-group{flex:0 0 min(76vw,245px)!important;width:min(76vw,245px)!important;min-height:86px;scroll-snap-align:start;box-shadow:0 8px 24px #0003}.status-empty{flex:0 0 100%;min-width:100%;scroll-snap-align:start}.app.contacts-only #archivedChatsToggle,.app.calls-only #archivedChatsToggle,.app.statuses-only #archivedChatsToggle{display:none!important}.device-pair-form{display:grid;gap:9px;margin-top:10px;padding-top:10px;border-top:1px solid #ffffff19}.device-pair-form label{display:grid;gap:6px}.device-pair-form input{padding:10px;border:1px solid #ffffff24;border-radius:10px;background:#111927;color:#fff}.device-pair-code{margin-top:5px;padding:10px;border:1px solid #2c5d81;border-radius:10px;background:#10263b;color:#c9edff;font-size:11px;line-height:1.5}.linked-devices-list{display:grid;gap:6px;margin-top:4px}.linked-device-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;border:1px solid #ffffff14;border-radius:9px;background:#ffffff06}.linked-device-row span{display:grid;gap:3px;min-width:0}.linked-device-row b{font-size:10px}.linked-device-row small{color:#9aa3b7;font-size:9px}.linked-device-row button{padding:5px 8px;border-radius:7px;background:#302035;color:#ffdce7;font-size:10px}.notification-setting{display:flex!important;align-items:center;gap:8px!important}.notification-setting input{width:15px!important;height:15px!important;accent-color:#41b9ec}.notification-setting span{color:#d7d8e3;font-size:11px}

/* Estados en tarjetas horizontales y navegación lateral al abrir cada historia. */
.status-list{display:flex!important;flex-wrap:nowrap!important;align-items:stretch;width:100%;max-width:100%;min-width:0;gap:12px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:5px 5px 12px!important;scroll-snap-type:x mandatory;scroll-padding-inline:5px;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.status-list::-webkit-scrollbar{display:none}
.status-group{box-sizing:border-box;flex:0 0 min(76vw,270px)!important;width:min(76vw,270px)!important;max-width:calc(100vw - 48px);min-width:0;min-height:104px;scroll-snap-align:start;box-shadow:0 9px 24px #0004;background:linear-gradient(135deg,#121c31 0%,#121529 62%,#19152a 100%);border-color:#365274;transition:transform .18s,border-color .18s,background .18s}
.status-group:active{transform:scale(.985)}
.status-group .status-avatar{flex:0 0 44px;width:44px;height:44px}
.status-group .status-copy{min-width:0;overflow:hidden}
.status-group .status-row-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status-group .status-row-head time{font-size:10px}
.status-group .status-copy p{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;overflow:hidden;text-overflow:ellipsis}
.status-empty{box-sizing:border-box;flex:0 0 100%!important;width:100%;min-width:100%;scroll-snap-align:start}
.own-status-group{flex:0 0 min(76vw,270px)!important}
#statusViewerBody{touch-action:pan-y}
@media(max-width:767px){.status-list{max-width:100%;padding-inline:3px!important}.status-group,.own-status-group{flex-basis:min(76vw,280px)!important;width:min(76vw,280px)!important;max-width:calc(100vw - 42px);min-height:96px}}

.context-action-panel,.private-code-panel{width:min(390px,calc(100vw - 32px));max-height:min(78dvh,560px);overflow:auto;border:1px solid #304465;background:linear-gradient(145deg,#11182a,#121321 70%,#171329);box-shadow:0 20px 70px #0009}
.context-action-panel header,.private-code-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.context-action-panel header p,.private-code-panel header p{margin:4px 0 0;color:#aeb9d0;font-size:12px}
.context-action-list{display:grid;gap:8px;margin:16px 0 10px}
.context-action-list button,.contact-profile-actions button{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:11px 13px;border:1px solid #ffffff17;border-radius:12px;background:#ffffff08;color:#e9effb;text-align:left;font:inherit;cursor:pointer}
.context-action-list button:hover,.contact-profile-actions button:hover{background:#17243a;border-color:#48bceb65}
.context-action-panel>small,.private-code-panel small{color:#9ba6bb;font-size:11px;line-height:1.5}
.private-code-panel form{display:grid;gap:10px;margin-top:14px}
.private-code-panel label{display:grid;gap:7px;color:#dce6f6;font-size:12px}
.private-code-panel input{width:100%;padding:12px;border:1px solid #35435d;border-radius:11px;background:#0b111d;color:#f2f6ff;font:inherit;letter-spacing:.25em}
.contact-profile-actions{display:grid;gap:8px;margin-top:18px;padding-top:12px;border-top:1px solid #ffffff16}
.contact-profile-actions button:last-child{color:#ffc7cd}
.transaction-message{max-width:min(92%,340px);align-self:center;margin:8px auto!important}
.transaction-message .transaction-card{display:grid;gap:5px;padding:11px 14px;border:1px solid #3388b566;border-radius:15px;background:linear-gradient(135deg,#10253b,#17182d 75%);color:#dceafa;box-shadow:0 7px 24px #02091970;text-align:center}
.transaction-card strong{color:#82dcff;font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.transaction-card span{font-size:12px;line-height:1.35;overflow-wrap:anywhere}
.transaction-card b{color:#f4f8ff;font-size:16px}
.transaction-card time{color:#aeb9d0;font-size:10px}
@media(max-width:767px){.context-action-panel,.private-code-panel{width:calc(100vw - 28px);max-width:430px;max-height:calc(75dvh - env(safe-area-inset-top));border-radius:20px}.transaction-message{max-width:94%}}

.payment-hub-panel{width:min(410px,calc(100vw - 32px));max-height:min(78dvh,580px);overflow:auto;border:1px solid #31517a;background:linear-gradient(145deg,#111a2e,#101321 68%,#171429);box-shadow:0 20px 70px #0009}
.payment-hub-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.payment-hub-panel header p{margin:4px 0 0;color:#aeb9d0;font-size:12px}
.payment-hub-actions{display:grid;gap:9px;margin:17px 0 14px}
.payment-hub-actions button{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:10px 13px;border:1px solid #ffffff18;border-radius:14px;background:linear-gradient(110deg,#ffffff0b,#14213a);color:#eaf1ff;text-align:left;font:inherit;cursor:pointer}
.payment-hub-actions button>span:first-child{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:11px;background:linear-gradient(135deg,#554cff,#1aadeb);color:white;font-size:19px}
.payment-hub-actions button>span:last-child{display:grid;gap:4px}
.payment-hub-actions button b{font-size:13px}
.payment-hub-actions button small{color:#aab6ca;font-size:10px;line-height:1.35}
.payment-hub-actions button:not(:first-child){opacity:.78}
.payment-hub-actions button:hover{border-color:#4bbbe977;background:linear-gradient(110deg,#172745,#15203a)}
.payment-hub-note{margin:0;padding:10px 11px;border:1px solid #35547566;border-radius:12px;background:#10243a77;color:#bdcbe0;font-size:10px;line-height:1.5}
.transaction-card small{color:#bdd8ed;font-size:10px}
@media(max-width:767px){.payment-hub-panel{width:calc(100vw - 28px);max-width:430px;max-height:calc(75dvh - env(safe-area-inset-top));border-radius:20px}}
.brisa-qr-modal{width:min(390px,calc(100vw - 32px));max-height:calc(88dvh - env(safe-area-inset-top));overflow:auto;border:1px solid #31517a;background:linear-gradient(145deg,#111a2e,#101321 68%,#171429);box-shadow:0 20px 70px #0009;text-align:center}
.brisa-qr-modal header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;text-align:left}
.brisa-qr-modal header p{margin:4px 0 0;color:#aeb9d0;font-size:11px}
.qr-image-wrap{display:grid;place-items:center;width:min(270px,76vw);aspect-ratio:1;margin:18px auto 12px;padding:10px;border:1px solid #375377;border-radius:18px;background:#fff;box-shadow:0 8px 26px #0005}
.qr-image-wrap img{display:block;width:100%;height:100%;object-fit:contain}
.brisa-qr-modal>strong{display:block;color:#eff5ff;font-size:15px}
.brisa-qr-modal>small{display:block;margin:8px auto 12px;max-width:290px;color:#afbdd3;font-size:10px;line-height:1.5}
.brisa-qr-modal .form-error{margin-top:8px}
.qr-profile-button{width:100%;margin:6px 0 0}
.contact-lookup #scanContactQR{flex:0 0 36px;width:36px;height:34px;border:1px solid #529ddd55;border-radius:11px;background:#10213a;color:#b8eaff;font-size:17px;line-height:1}
.device-pair-code{display:grid;justify-items:center;gap:8px;text-align:center}
.device-pair-code img{width:164px;height:164px;padding:6px;border-radius:10px;background:#fff}
.device-pair-code span{font-size:10px;overflow-wrap:anywhere}
.device-pair-code small{color:#8fc9e8;font-size:10px}
.qr-camera-frame{position:relative;width:100%;aspect-ratio:1;margin-top:14px;overflow:hidden;border:1px solid #39628b;border-radius:18px;background:#050912}
.qr-camera-frame video{display:block;width:100%;height:100%;object-fit:cover}
.qr-camera-corners{position:absolute;inset:18%;border:2px solid #63dfff;border-radius:16px;box-shadow:0 0 0 999px #0208122e,0 0 18px #3bd7ff66;pointer-events:none}
@media(max-width:767px){.brisa-qr-modal{width:calc(100vw - 28px);max-width:430px;max-height:calc(88dvh - env(safe-area-inset-top));border-radius:20px}.qr-image-wrap{width:min(250px,72vw)}}

/* Motivos discretos que atraviesan el fondo de la cabecera del chat. */
.chat-header{position:relative;isolation:isolate;overflow:hidden}
.chat-header-sparkles{position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none}
.chat-header-sparkles span{position:absolute;left:-8%;top:var(--spark-y);color:var(--spark-color);font-size:var(--spark-size);font-weight:600;line-height:1;text-shadow:0 0 10px color-mix(in srgb,var(--spark-color) 42%,transparent);opacity:0;animation:brisa-header-cross var(--spark-time) linear var(--spark-delay) infinite}
.chat-header-sparkles span:nth-child(1){--spark-y:18%;--spark-color:#8fe9ff;--spark-size:12px;--spark-time:8.8s;--spark-delay:-1.3s}
.chat-header-sparkles span:nth-child(2){--spark-y:68%;--spark-color:#cbb4ff;--spark-size:14px;--spark-time:10.2s;--spark-delay:-6.2s}
.chat-header-sparkles span:nth-child(3){--spark-y:30%;--spark-color:#8ddcff;--spark-size:11px;--spark-time:9.5s;--spark-delay:-4s}
.chat-header-sparkles span:nth-child(4){--spark-y:72%;--spark-color:#bca3ff;--spark-size:13px;--spark-time:11s;--spark-delay:-8s}
.chat-header-sparkles span:nth-child(5){--spark-y:14%;--spark-color:#a2dfff;--spark-size:14px;--spark-time:10.5s;--spark-delay:-2.5s}
.chat-header-sparkles span:nth-child(6){--spark-y:53%;--spark-color:#a9d4ff;--spark-size:12px;--spark-time:9s;--spark-delay:-5s}
.chat-header-sparkles span:nth-child(7){--spark-y:36%;--spark-color:#ff9fcb;--spark-size:11px;--spark-time:10.8s;--spark-delay:-7s}
.chat-header-sparkles span:nth-child(8){--spark-y:82%;--spark-color:#73dfff;--spark-size:10px;--spark-time:8.5s;--spark-delay:-3.5s}
.chat-header-sparkles span:nth-child(4n){font-size:9px}
.chat-header>:not(.chat-header-sparkles){position:relative;z-index:1}
@keyframes brisa-header-cross{0%{left:-8%;opacity:0;transform:translateY(3px) rotate(-15deg) scale(.8)}12%{opacity:.28}54%{opacity:.2}88%{opacity:.25}100%{left:108%;opacity:0;transform:translateY(-3px) rotate(16deg) scale(1.04)}}
@media(prefers-reduced-motion:reduce){.chat-header-sparkles span{animation:none;opacity:.12;left:12%}.chat-header-sparkles span:nth-child(2n){left:72%}}
@media(max-width:767px){.archived-chats-toggle{max-height:40px;opacity:1;transform:translateY(0);overflow:hidden;transition:max-height .22s ease,opacity .2s ease,transform .22s ease,padding .22s ease,margin .22s ease}.archived-chats-toggle.archive-pull-hidden{max-height:0!important;margin-block:0!important;padding-block:0!important;border-width:0!important;opacity:0;transform:translateY(-7px);pointer-events:none}.app.archive-pull-armed .archived-chats-toggle.archive-pull-hidden{max-height:27px!important;padding-block:6px!important;opacity:.55;transform:translateY(0)}.app.archive-revealed .archived-chats-toggle{max-height:40px}}


/* Payments live outside conversations; the chat money button opens only the tip form. */
.payment-screen-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:2px 4px}
.payment-screen-actions button{display:grid;gap:5px;text-align:left;padding:12px;border:1px solid #315278;border-radius:13px;background:linear-gradient(145deg,#101b32,#131326);color:#eaf7ff}
.payment-screen-actions b{font-size:12px}.payment-screen-actions small{color:#9eabc3;font-size:10px;line-height:1.4}
.payment-history-heading{display:flex;align-items:center;justify-content:space-between;padding:2px 5px}
.payment-history-heading h3{margin:0;color:#f1efff;font-size:13px}.payment-history-heading button{padding:6px 10px;border-radius:20px;background:#18233a;color:#aeeaff;font-size:10px}
.payment-history-list{display:grid;gap:7px;padding:0 3px 6px}
.payment-history-empty{padding:20px 10px;text-align:center;color:#a1a7bb;font-size:12px;line-height:1.5}
.payment-history-item{display:grid;gap:5px;padding:11px;border:1px solid #283652;border-radius:13px;background:linear-gradient(145deg,#111a2d,#11111e)}
.payment-history-item-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.payment-history-item-head strong{color:#ecf5ff;font-size:12px}.payment-history-item-head b{font-size:13px}.payment-out{color:#ffb2ca}.payment-in{color:#79e4c2}.payment-history-details{color:#b3bbce;font-size:11px;overflow-wrap:anywhere}.payment-demo-status{width:max-content;padding:3px 7px;border-radius:12px;background:#24203a;color:#c4b7e9;font-size:9px}.payment-history-item time{color:#7f8ba4;font-size:9px}.payment-screen-note{margin:2px 6px 5px;color:#8f98ad;font-size:10px;line-height:1.45}
.app.payments-only .mobile-search,.app.payments-only .side-head,.app.payments-only #conversationList,.app.payments-only #peopleList,.app.payments-only>.sidebar>.nav{display:none}
.app.payments-only #paymentsScreen{display:flex}
.demo-preview-banner{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:8px;align-self:center;width:min(100%,390px);padding:8px 10px;border:1px solid #3d76aa;border-radius:14px;background:#0b1b31ee;color:#cdeaff;font-size:10px;backdrop-filter:blur(14px)}
.demo-preview-banner button{padding:7px 10px;border-radius:18px;background:linear-gradient(120deg,#41268d,#086d9b);color:white;font-size:10px}
.demo-conversation-row{border-color:#245875!important;background:linear-gradient(100deg,#10182c,#0b202b)!important}
.demo-avatar{display:grid;place-items:center;background:linear-gradient(145deg,#5838cb,#06a6be)!important;color:white!important}
.demo-message .bubble{border:1px solid #55b9dc38}.demo-message.mine .bubble{background:linear-gradient(135deg,#183e78,#234276)!important}
@media(max-width:767px){.mobile-bottom{grid-template-columns:repeat(4,minmax(0,1fr))!important}.payment-screen-actions{gap:6px}.payment-screen-actions button{padding:10px 8px}.app.payments-only .mobile-title{margin-bottom:14px}.demo-preview-banner{top:0}}


/* Keep every primary mobile destination visible, even under legacy preview rules. */
html.phone-preview #app .mobile-bottom{display:grid!important;visibility:visible!important;opacity:1!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;z-index:50!important;overflow:visible!important}
html.phone-preview #app .mobile-bottom>button{display:grid!important;visibility:visible!important;opacity:1!important;min-width:0!important;white-space:nowrap!important}
html.phone-preview #app.statuses-only .mobile-bottom,html.phone-preview #app.payments-only .mobile-bottom,html.phone-preview #app.calls-only .mobile-bottom,html.phone-preview #app.messages-only .mobile-bottom{display:grid!important}
@media(max-width:767px){#app .mobile-bottom{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-auto-flow:column!important;grid-auto-columns:minmax(0,1fr)!important}#app .mobile-bottom>button{display:grid!important;visibility:visible!important;opacity:1!important;min-width:0!important}}


/* Each mobile destination owns only its matching screen. */
#app.statuses-only #statusScreen,#app.calls-only #callsScreen,#app.payments-only #paymentsScreen{display:flex!important}
#app.statuses-only #callsScreen,#app.statuses-only #paymentsScreen,#app.calls-only #statusScreen,#app.calls-only #paymentsScreen,#app.payments-only #statusScreen,#app.payments-only #callsScreen{display:none!important}
#app.statuses-only #conversationList,#app.statuses-only #peopleList,#app.statuses-only .mobile-search,#app.statuses-only .side-head,#app.calls-only #conversationList,#app.calls-only #peopleList,#app.calls-only .mobile-search,#app.calls-only .side-head,#app.payments-only #conversationList,#app.payments-only #peopleList,#app.payments-only .mobile-search,#app.payments-only .side-head{display:none!important}
#app.statuses-only .mobile-bottom,#app.calls-only .mobile-bottom,#app.payments-only .mobile-bottom,#app.messages-only .mobile-bottom{display:grid!important;visibility:visible!important}

/* Archivados pertenece a la lista de chats, nunca a Pagos. */
#app.payments-only #archivedChatsToggle{display:none!important}

/* Swipe actions include pin and delete, with a five-button tray. */
.chat-swipe-actions{width:245px!important;right:-245px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important}
.conversation-item.revealed .conv-row{transform:translateX(-245px)!important}
.chat-swipe-actions .delete-chat-button{color:#ffb5c3!important;background:linear-gradient(150deg,#351c36,#482335)!important;font-size:10px!important}
.chat-swipe-actions .delete-chat-button:hover{background:#682d43!important;color:#fff!important}
@media(max-width:767px){.chat-swipe-actions{width:245px!important;right:-245px!important}.conversation-item.revealed .conv-row{transform:translateX(-245px)!important}}
/* Movimiento visible en la cabecera del chat: símbolos cruzan lentamente y se desvanecen. */
.chat-header-sparkles{z-index:0!important}
.chat-header-sparkles span{left:-10%;opacity:0;will-change:left,transform,opacity;text-shadow:0 0 12px color-mix(in srgb,var(--spark-color) 58%,transparent)!important;animation:brisa-header-cross var(--spark-time) linear var(--spark-delay) infinite!important}
@keyframes brisa-header-cross{0%{left:-10%;opacity:0;transform:translate3d(0,5px,0) rotate(-18deg) scale(.78)}12%{opacity:.44}38%{opacity:.32;transform:translate3d(0,-2px,0) rotate(5deg) scale(1)}72%{opacity:.4;transform:translate3d(0,3px,0) rotate(22deg) scale(.94)}100%{left:110%;opacity:0;transform:translate3d(0,-4px,0) rotate(34deg) scale(1.08)}}
@media(prefers-reduced-motion:reduce){.chat-header{animation:brisa-header-flow 18s ease-in-out infinite!important}.chat-header::after{animation:brisa-header-line 8s linear infinite!important}.chat-header-sparkles span{animation:brisa-header-cross var(--spark-time) linear var(--spark-delay) infinite!important}}.chat-header{animation-duration:11s!important}
.chat-header-sparkles{z-index:1!important}
.chat-header>:not(.chat-header-sparkles){position:relative;z-index:2}
.chat-header-sparkles span{animation-duration:7.2s!important;text-shadow:0 0 13px color-mix(in srgb,var(--spark-color) 72%,transparent)!important}.chat-header-sparkles span{font-size:calc(var(--spark-size) + 3px)!important;animation-duration:6.4s!important;text-shadow:0 0 15px color-mix(in srgb,var(--spark-color) 82%,transparent)!important}
.chat-header-sparkles::after{content:"";position:absolute;top:54%;left:-18%;width:54px;height:2px;opacity:0;pointer-events:none;background:linear-gradient(90deg,transparent,#8fe9ff,#e3c5ff,transparent);filter:drop-shadow(0 0 4px #8fe9ff);animation:brisa-header-streak 5.6s ease-in-out -2s infinite}
@keyframes brisa-header-streak{0%{left:-18%;opacity:0;transform:scaleX(.55)}12%{opacity:.48}48%{opacity:.34;transform:scaleX(1)}100%{left:115%;opacity:0;transform:scaleX(.72)}}.chat-header-sparkles span{font-size:calc(var(--spark-size) + 5px)!important;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--spark-color) 70%,transparent));}
.chat-header-sparkles::after{width:82px;height:2.5px;filter:drop-shadow(0 0 6px #8fe9ff)}
@keyframes brisa-header-cross{0%{left:-10%;opacity:0;transform:translate3d(0,5px,0) rotate(-18deg) scale(.78)}12%{opacity:.72}38%{opacity:.55;transform:translate3d(0,-2px,0) rotate(5deg) scale(1)}72%{opacity:.68;transform:translate3d(0,3px,0) rotate(22deg) scale(.94)}100%{left:110%;opacity:0;transform:translate3d(0,-4px,0) rotate(34deg) scale(1.08)}}
/* En móvil, no dejar que el mensaje vacío empuje Mi estado fuera del carrusel. */
@media(max-width:767px){#statusList .status-empty{display:none!important}.own-status-group .status-add-mark{width:32px!important;height:32px!important;font-size:21px!important;box-shadow:0 0 12px #148eff55!important}}@media(max-width:767px){.own-status-group{flex-basis:min(84vw,320px)!important;width:min(84vw,320px)!important;min-height:104px!important;border-color:#416ca8!important;background:linear-gradient(130deg,#14172d,#10223a)!important}.own-status-group .status-add-mark{width:auto!important;min-width:98px!important;height:36px!important;padding:0 11px!important;border-radius:18px!important;font-size:10px!important;font-weight:700!important;white-space:nowrap!important;box-shadow:0 0 12px #148eff55!important}}@media(max-width:767px){.own-status-group .status-copy{flex:1 1 auto!important;min-width:min(32vw,116px)!important}.own-status-group .status-row-head strong{white-space:nowrap!important}.own-status-group .status-copy p{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal!important;line-height:1.3!important}}@media(max-width:767px){.own-status-group .status-add-mark{min-width:78px!important;height:34px!important;padding:0 7px!important;font-size:9px!important}.own-status-group .status-copy p{font-size:10px!important}}@media(max-width:767px){#statusList .own-status-group{display:grid!important;grid-template-columns:38px minmax(0,1fr) auto!important;column-gap:9px!important;align-items:center!important;overflow:hidden!important}#statusList .own-status-group .status-copy{min-width:0!important;width:auto!important}#statusList .own-status-group .status-add-mark{justify-self:end!important;max-width:100%!important}}
/* Centrar el nombre junto al avatar y despejar la isla superior del teléfono de vista previa. */
@media(max-width:767px){#app.chat-open .chat-header{align-items:center!important}#app.chat-open .chat-header .header-copy{align-self:center!important;align-content:center!important;margin:0!important;transform:translateY(2px)!important}#app.chat-open .chat-header .contact-avatar{align-self:center!important}}
html.phone-preview #app.chat-open .chat-header{height:66px!important;flex-basis:66px!important;padding:18px 10px 0!important;align-items:center!important}
html.phone-preview #app.chat-open .chat-header .header-copy{flex:1 1 auto!important;min-width:0!important;max-width:100%!important;min-height:0!important;gap:3px!important;align-self:center!important;align-content:center!important;margin:0!important;transform:translateY(0)!important;overflow:hidden!important}
html.phone-preview #app.chat-open .header-copy strong,html.phone-preview #app.chat-open .header-copy span{display:block!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html.phone-preview #app.chat-open .chat-header .contact-avatar{width:40px!important;height:40px!important;align-self:center!important}
html.phone-preview #app.chat-open .chat-header>:not(.chat-header-sparkles){top:0!important}
html.phone-preview #app.chat-open #showContactProfile,html.phone-preview #app.chat-open .header-copy{top:0!important}
@media(max-width:767px){.sidebar>.brand .header-profile-avatar{top:24px!important;box-shadow:0 0 10px #376dff68,0 0 12px #8b3bff32!important}}
/* Tarjeta propia de estados: ocupa el ancho disponible y deja el acceso para publicar siempre visible. */
@media(max-width:767px){.status-list.hidden{display:none!important}#statusList .own-status-group{flex:0 0 100%!important;width:100%!important;max-width:100%!important;min-height:106px!important;padding:13px 14px!important;grid-template-columns:46px minmax(0,1fr) auto!important;column-gap:12px!important;align-items:center!important;border:1px solid #4778ba!important;border-radius:18px!important;background:linear-gradient(120deg,#151a35 0%,#10223b 100%)!important;box-shadow:0 8px 24px #02071370,inset 0 1px 0 #ffffff12!important;overflow:hidden!important}#statusList .own-status-avatar{width:44px!important;height:44px!important;flex:none!important}#statusList .own-status-group .status-copy{min-width:0!important;width:auto!important;align-self:center!important}#statusList .own-status-group .status-row-head{justify-content:flex-start!important}#statusList .own-status-group .status-row-head strong{flex:0 0 auto!important;overflow:visible!important;text-overflow:clip!important;font-size:13px!important;line-height:1.25!important}#statusList .own-status-group .status-copy p{margin:4px 0 0!important;font-size:11px!important;line-height:1.35!important;-webkit-line-clamp:2!important}#statusList .own-status-group .status-add-mark{display:inline-flex!important;align-items:center!important;justify-content:center!important;justify-self:end!important;width:auto!important;min-width:92px!important;height:38px!important;padding:0 11px!important;border:1px solid #67caff80!important;border-radius:20px!important;background:linear-gradient(120deg,#5544ed,#168ff5)!important;color:#fff!important;font-size:11px!important;font-weight:700!important;letter-spacing:.01em!important;white-space:nowrap!important;box-shadow:0 4px 14px #167ef955!important;cursor:pointer!important}#statusList .own-status-group .status-add-mark:active{transform:scale(.96)!important}#statusList .own-status-group .status-add-mark:focus-visible{outline:2px solid #b9efff!important;outline-offset:3px!important}}

/* Pago recibido confirmado: vibración corta y símbolos $ que saltan alrededor del acceso a Pagos. */
#mobilePayments,#paymentsNav{position:relative!important;overflow:visible!important}
.money-arrival-shake{animation:brisa-money-shake .72s ease-in-out!important;z-index:3!important}
.money-arrival-spark{position:absolute;z-index:20;left:50%;top:14%;pointer-events:none;color:#8df4d3;font:800 12px/1 system-ui,sans-serif;text-shadow:0 0 8px #63f2ce,0 0 15px #17b8ff;animation:brisa-money-pop 1.9s cubic-bezier(.15,.72,.28,1) var(--money-delay,0ms) both}
@keyframes brisa-money-shake{0%,100%{transform:translateX(0) rotate(0)}12%{transform:translateX(-3px) rotate(-5deg)}24%{transform:translateX(3px) rotate(5deg)}36%{transform:translateX(-3px) rotate(-4deg)}48%{transform:translateX(2px) rotate(3deg)}60%{transform:translateX(-1px) rotate(-2deg)}75%{transform:translateX(0) rotate(0)}}
@keyframes brisa-money-pop{0%{opacity:0;transform:translate(0,7px) scale(.55)}14%{opacity:1}100%{opacity:0;transform:translate(var(--money-dx),var(--money-dy)) scale(1.12)}}
@media(prefers-reduced-motion:reduce){.money-arrival-shake{animation:none!important}.money-arrival-spark{animation:none!important;opacity:1!important;transform:translate(var(--money-dx),var(--money-dy))!important}}
/* Métodos de propina enlazados por cada perfil; Brisa no confirma el pago externo. */
.payment-link-hint{margin:8px 0;padding:10px 12px;border:1px solid #31517a88;border-radius:12px;background:#10213a;color:#bdcbe0;font-size:11px;line-height:1.5}
.external-tip-modal{width:min(390px,calc(100vw - 28px));max-height:min(78dvh,560px);overflow:auto;border:1px solid #31517a;background:linear-gradient(145deg,#111a2e,#101321 68%,#171429);box-shadow:0 20px 70px #0009}
.external-tip-modal header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.external-tip-modal header h2{margin:0}
.external-tip-modal header p{margin:5px 0 0;color:#aeb9d0;font-size:12px}
.external-tip-methods{display:grid;gap:9px;margin:16px 0 12px}
.external-tip-method{display:flex;align-items:center;gap:11px;min-height:56px;padding:10px 12px;border:1px solid #ffffff1a;border-radius:14px;background:linear-gradient(110deg,#ffffff0b,#14213a);color:#eef3ff;text-decoration:none;transition:border-color .18s,transform .18s,background .18s}
.external-tip-method:hover{transform:translateY(-1px);border-color:#4bbbe977;background:linear-gradient(110deg,#172745,#15203a)}
.external-tip-method>span:nth-child(2){display:grid;gap:3px;flex:1;min-width:0}
.external-tip-method small{color:#aab6ca;font-size:10px}
.external-tip-icon{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,#554cff,#1aadeb);color:white;font-size:16px;font-weight:800}
.external-tip-icon.provider-zelle{background:linear-gradient(135deg,#6d42c7,#442486)}
.external-tip-icon.provider-cashapp{background:linear-gradient(135deg,#30c879,#087c4c)}
.external-tip-icon.provider-binance{background:linear-gradient(135deg,#f5bc35,#d89010)}
.external-tip-arrow{color:#9abbe5;font-size:18px}
.external-tip-note,.external-tip-empty{margin:0;padding:10px 11px;border:1px solid #35547566;border-radius:12px;background:#10243a77;color:#bdcbe0;font-size:10px;line-height:1.5}
@media(max-width:767px){.external-tip-modal{width:calc(100vw - 28px);max-width:430px;max-height:calc(75dvh - env(safe-area-inset-top));border-radius:20px}}
/* Selector de llamada en vidrio esmerilado, con iconos originales de Brisa. */
#callInfoModal.overlay{background:rgba(4,8,20,.3);backdrop-filter:blur(2px) saturate(118%);-webkit-backdrop-filter:blur(2px) saturate(118%)}
#callInfoModal .call-info-modal{width:min(390px,calc(100vw - 32px));max-height:min(70dvh,440px);overflow:auto;padding:22px;border:1px solid rgba(137,171,255,.38);border-radius:25px;background:linear-gradient(135deg,rgba(20,31,59,.64),rgba(24,21,52,.55));box-shadow:0 22px 70px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);color:#f4f6ff}
#callInfoModal .call-info-modal h2{margin:0;text-align:center;color:#f4f6ff;font-size:18px;font-weight:700;letter-spacing:-.02em}
#callInfoModal .call-info-note{margin:8px 0 18px;padding:0;border:0;background:none;color:#c1cce1;text-align:center;font-size:12px;line-height:1.45}
#callInfoModal .call-info-actions{gap:12px}
#callInfoModal .call-info-actions button{min-height:124px;display:flex;flex-direction:column;justify-content:center;gap:11px;border:1px solid rgba(135,165,255,.29);border-radius:19px;background:linear-gradient(145deg,rgba(29,42,79,.5),rgba(27,25,57,.44));color:#f3f5ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.09);transition:transform .2s,border-color .2s,background .2s,box-shadow .2s}
#callInfoModal .call-info-actions button:hover{transform:translateY(-2px);border-color:rgba(77,213,245,.72);background:linear-gradient(145deg,rgba(54,54,126,.65),rgba(18,105,145,.42));box-shadow:0 8px 25px rgba(20,151,220,.12),inset 0 1px 0 rgba(255,255,255,.16)}
#callInfoModal .call-info-actions button b{font-size:12px;font-weight:650}
#callInfoModal .call-option-icon{display:grid;place-items:center;width:58px;height:58px;border:1px solid rgba(108,180,255,.38);border-radius:19px;background:radial-gradient(circle at 30% 20%,rgba(150,81,255,.3),rgba(34,69,128,.26) 55%,rgba(18,192,218,.15));box-shadow:0 0 22px rgba(77,126,255,.18),inset 0 1px 0 rgba(255,255,255,.18)}
#callInfoModal .call-option-icon svg{width:38px;height:38px;overflow:visible;fill:none;stroke:url(#brisaVoiceGradient);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(61,193,255,.32))}
#callInfoModal [data-call-kind="video"] svg{stroke:url(#brisaVideoGradient)}
#callInfoModal .call-icon-wave{stroke-width:3.2}
#callInfoModal .call-icon-leaf{stroke-width:2.3}
@media(max-width:650px){#callInfoModal .call-info-modal{width:min(360px,calc(100vw - 28px));padding:19px;border-radius:22px}#callInfoModal .call-info-actions button{min-height:112px}}
@media(prefers-reduced-transparency:reduce){#callInfoModal .call-info-modal{background:#111b32;backdrop-filter:none;-webkit-backdrop-filter:none}}
/* Mantiene traslúcido el panel del mensaje de elegir; el chat no se modifica. */
#callInfoModal .call-info-modal{background-color:rgba(10,17,34,.26)!important;background-image:linear-gradient(135deg,rgba(20,31,59,.28),rgba(24,21,52,.22))!important;border-color:rgba(137,184,255,.3);backdrop-filter:blur(15px) saturate(145%);-webkit-backdrop-filter:blur(15px) saturate(145%)}
@media(prefers-reduced-transparency:reduce){#callInfoModal .call-info-modal{background-color:#111b32!important;background-image:none!important;backdrop-filter:none;-webkit-backdrop-filter:none}}
/* El panel de información del historial de llamadas usa el mismo vidrio Brisa. */
#app.calls-only #callsScreen .call-empty{background-color:rgba(10,17,34,.26)!important;background-image:linear-gradient(135deg,rgba(20,31,59,.28),rgba(24,21,52,.22))!important;border:1px solid rgba(137,184,255,.3);border-radius:22px;box-shadow:0 18px 54px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(15px) saturate(145%);-webkit-backdrop-filter:blur(15px) saturate(145%)}
@media(prefers-reduced-transparency:reduce){#app.calls-only #callsScreen .call-empty{background-color:#111b32!important;background-image:none!important;backdrop-filter:none;-webkit-backdrop-filter:none}}
/* Menú de fotos y archivos con el mismo cristal azul-violeta del selector de llamadas. */
.attach-menu{max-height:min(58dvh,340px);overflow-y:auto;overscroll-behavior:contain;border:1px solid rgba(137,184,255,.32);border-radius:19px;background-color:rgba(10,17,34,.26);background-image:linear-gradient(135deg,rgba(20,31,59,.28),rgba(24,21,52,.22));box-shadow:0 18px 54px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(15px) saturate(145%);-webkit-backdrop-filter:blur(15px) saturate(145%)}
.attach-menu button{min-height:56px;border:1px solid transparent;border-radius:13px;background:transparent;transition:background .18s,border-color .18s,transform .18s}
.attach-menu button:hover{transform:translateX(2px);border-color:rgba(124,174,255,.2);background:linear-gradient(100deg,rgba(108,91,255,.15),rgba(27,191,224,.09))}
.attach-menu .attach-icon{width:38px;height:38px;flex:none;display:grid;place-items:center;border:1px solid rgba(131,165,255,.26);border-radius:13px;background:radial-gradient(circle at 25% 20%,rgba(150,81,255,.3),rgba(34,69,128,.24) 58%,rgba(18,192,218,.13));box-shadow:0 0 18px rgba(77,126,255,.13),inset 0 1px 0 rgba(255,255,255,.1)}
.attach-menu .attach-icon svg{width:25px;height:25px;overflow:visible;fill:none;stroke:#c4d8ff;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(61,193,255,.23))}
.attach-menu .attach-icon .attachment-leaf{stroke:#55d6ed;stroke-width:1.8}
.attach-menu .attach-icon .attachment-wave{stroke:#a878ff;stroke-width:2.3}
.attach-menu b{color:#f3f5ff;font-size:12px}
.attach-menu small{color:#bdc8dc}
@media(prefers-reduced-transparency:reduce){.attach-menu{background-color:#111b32;background-image:none;backdrop-filter:none;-webkit-backdrop-filter:none}}
/* Selector de emojis y stickers con el mismo vidrio de Brisa, dentro del marco del chat. */
#emojiPicker.emoji-picker{border:1px solid rgba(137,184,255,.32);border-radius:19px;background-color:rgba(10,17,34,.24);background-image:linear-gradient(135deg,rgba(20,31,59,.28),rgba(24,21,52,.22));box-shadow:0 18px 54px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.12),0 0 24px rgba(64,123,255,.1);backdrop-filter:blur(15px) saturate(145%);-webkit-backdrop-filter:blur(15px) saturate(145%)}
#emojiPicker .emoji-search{border-color:rgba(137,184,255,.25);background:rgba(255,255,255,.07);color:#c4d8ff}
#emojiPicker .emoji-search input{color:#f4f6ff}
#emojiPicker .emoji-search input::placeholder{color:#b2bfd5}
#emojiPicker .emoji-close{border:1px solid rgba(137,184,255,.2);background:rgba(255,255,255,.07);color:#d9e4fa}
#emojiPicker .emoji-mode-tabs{border:1px solid rgba(137,184,255,.17);background:rgba(12,21,42,.32)}
#emojiPicker .emoji-mode-tabs button{display:flex;align-items:center;justify-content:center;gap:6px;height:34px;border:1px solid transparent;border-radius:9px;color:#bec9df;transition:background .18s,border-color .18s,color .18s}
#emojiPicker .emoji-mode-tabs button.active{border-color:rgba(137,184,255,.25);background:linear-gradient(110deg,rgba(130,72,244,.28),rgba(26,174,225,.2));color:#f2f5ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 14px rgba(73,130,255,.12)}
#emojiPicker .emoji-mode-tabs svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(74,197,255,.28))}
#emojiPicker .emoji-mode-tabs .picker-leaf{stroke:#52d6ed;stroke-width:1.8}
#emojiPicker .emoji-categories{border-bottom-color:rgba(137,184,255,.15)}
#emojiPicker .emoji-category:hover,#emojiPicker .emoji-category.active{background:linear-gradient(135deg,rgba(130,72,244,.25),rgba(26,174,225,.16));color:#e5f4ff}
#emojiPicker .sticker-toolbar button{border-color:rgba(137,184,255,.28);background:linear-gradient(110deg,rgba(111,71,211,.28),rgba(21,151,186,.2));color:#e6f4ff}
#emojiPicker .sticker-option{border-color:rgba(137,184,255,.14);background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035));backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#emojiPicker .sticker-option:hover{border-color:rgba(90,212,241,.5);background:linear-gradient(145deg,rgba(125,79,223,.24),rgba(24,164,203,.17))}
#emojiPicker .emoji-option:hover{background:linear-gradient(135deg,rgba(130,72,244,.22),rgba(26,174,225,.14))}
@media(prefers-reduced-transparency:reduce){#emojiPicker.emoji-picker{background-color:#111b32;background-image:none;backdrop-filter:none;-webkit-backdrop-filter:none}#emojiPicker .sticker-option{backdrop-filter:none;-webkit-backdrop-filter:none}}
/* Barra de desplazamiento del chat: tono Brisa y flechas activas solo mientras se desplaza. */
#messages{scrollbar-width:thin;scrollbar-color:rgba(115,139,188,.52) transparent}
#messages::-webkit-scrollbar{width:10px}
#messages::-webkit-scrollbar-track{margin:12px 1px;background:transparent}
#messages::-webkit-scrollbar-thumb{min-height:34px;border:3px solid transparent;border-radius:99px;background:linear-gradient(180deg,rgba(139,92,246,.62),rgba(45,190,235,.62)) padding-box;transition:background .18s,box-shadow .18s}
#messages.is-scrolling::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#9a65ff,#40cef0) padding-box;box-shadow:0 0 7px rgba(66,190,244,.24)}
#messages::-webkit-scrollbar-button:single-button:vertical:decrement,#messages::-webkit-scrollbar-button:single-button:vertical:increment{display:block;height:13px;border:0;background-color:transparent;background-repeat:no-repeat;background-position:center;background-size:8px 8px;opacity:.42;transition:opacity .16s,filter .16s}
#messages::-webkit-scrollbar-button:single-button:vertical:decrement{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2 8 4-4 4 4' fill='none' stroke='%2395a5c2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
#messages::-webkit-scrollbar-button:single-button:vertical:increment{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2 4 4 4 4-4' fill='none' stroke='%2395a5c2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
#messages.is-scrolling::-webkit-scrollbar-button:single-button:vertical:decrement,#messages.is-scrolling::-webkit-scrollbar-button:single-button:vertical:increment{opacity:1;filter:drop-shadow(0 0 3px rgba(72,205,246,.55)) brightness(1.55)}
@media(prefers-reduced-motion:reduce){#messages::-webkit-scrollbar-thumb,#messages::-webkit-scrollbar-button:single-button:vertical:decrement,#messages::-webkit-scrollbar-button:single-button:vertical:increment{transition:none}}
/* Reacciones ancladas al borde inferior del globo, con un salto breve al enviarlas. */
#messages .bubble.has-reactions{position:relative;padding-bottom:27px}
#messages .message-reaction-summary{position:absolute;right:7px;bottom:5px;z-index:1;display:flex;justify-content:flex-end;gap:4px;max-width:calc(100% - 14px);margin:0}
#messages .reaction-chip{display:inline-flex;align-items:center;gap:3px;min-height:20px;padding:2px 6px;border:1px solid rgba(111,183,239,.28);border-radius:999px;background:linear-gradient(120deg,rgba(98,68,173,.42),rgba(23,105,145,.38));color:#f2f6ff;box-shadow:0 3px 10px rgba(0,0,0,.18);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
#messages .reaction-chip.mine{border-color:rgba(70,205,238,.52);background:linear-gradient(120deg,rgba(101,69,199,.55),rgba(20,133,165,.48))}
#messages .reaction-emoji{display:inline-block;transform-origin:center bottom}
#messages .reaction-hop .reaction-emoji{animation:brisaReactionHop .66s cubic-bezier(.25,.75,.3,1.25) both}
@keyframes brisaReactionHop{0%{transform:translateY(0) scale(1)}24%{transform:translateY(-8px) scale(1.12)}42%{transform:translateY(1px) scale(.96)}60%{transform:translateY(-4px) scale(1.06)}78%{transform:translateY(0) scale(1)}100%{transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){#messages .reaction-hop .reaction-emoji{animation:none}}
/* Avisos de llamadas perdidas dentro del hilo de mensajes. */
#messages .call-event-message{max-width:min(88%,360px);width:100%;align-self:flex-start}
#messages .call-event-message.mine{align-self:flex-end}
#messages .call-event-card{display:flex;align-items:center;gap:10px;width:100%;min-width:0;padding:10px 12px;border:1px solid rgba(102,179,235,.25);border-radius:15px;background:linear-gradient(125deg,rgba(37,42,78,.82),rgba(15,42,59,.82));box-shadow:0 8px 24px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.07)}
#messages .call-event-icon{width:34px;height:34px;flex:none;display:grid;place-items:center;border:1px solid rgba(113,183,255,.3);border-radius:50%;background:linear-gradient(135deg,rgba(140,79,235,.34),rgba(27,173,219,.28));color:#aeeeff;font-size:16px}
#messages .call-event-copy{display:grid;gap:3px;min-width:0}
#messages .call-event-copy strong{color:#f3f5ff;font-size:11px;font-weight:650}
#messages .call-event-copy small{color:#b6c7df;font-size:10px}
#messages .call-event-time{margin-left:auto;align-self:flex-end;flex:none;color:#9daec9;font-size:9px}
@media(max-width:767px){#messages .call-event-message{max-width:88%;}}
/* Reacciones superpuestas: el globo conserva exactamente su relleno normal. */
#messages .bubble.has-reactions{padding:10px 13px}
#messages .bubble.has-reactions .message-reaction-summary{bottom:3px;right:4px}
#messages .reaction-chip{background:linear-gradient(120deg,rgba(32,27,57,.97),rgba(10,39,55,.97));box-shadow:0 2px 9px rgba(0,0,0,.42),0 0 8px rgba(56,173,226,.14)}
#emojiPicker .emoji-option{border:1px solid transparent;background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(111,79,188,.035));transition:background .2s,border-color .2s,transform .2s}
#emojiPicker .emoji-glyph{display:inline-block;transform-origin:center 78%;animation:brisaEmojiOrbit 2.35s ease-in-out infinite;filter:drop-shadow(0 0 5px rgba(89,179,239,.23));will-change:transform}
#emojiPicker .emoji-option:nth-child(3n) .emoji-glyph{animation-delay:-.78s}
#emojiPicker .emoji-option:nth-child(3n + 1) .emoji-glyph{animation-delay:-1.56s}
#emojiPicker .emoji-option:hover{border-color:rgba(106,208,239,.28);background:linear-gradient(145deg,rgba(132,82,237,.2),rgba(27,169,216,.15));transform:translateY(-1px)}
#emojiPicker .emoji-option:hover .emoji-glyph{filter:drop-shadow(0 0 7px rgba(87,201,242,.5));animation-duration:.72s}
#messages .reaction-emoji{animation:brisaEmojiOrbit 2.1s ease-in-out infinite}
@keyframes brisaEmojiOrbit{0%,100%{transform:translateY(0) rotate(-2deg) scale(1)}35%{transform:translateY(-2px) rotate(1.5deg) scale(1.045)}68%{transform:translateY(1px) rotate(2deg) scale(.99)}}
@media(prefers-reduced-motion:reduce){#emojiPicker .emoji-glyph,#messages .reaction-emoji{animation:none;will-change:auto}}
/* Acceso compacto a llamadas junto a propinas dentro de cada conversación. */
.call-button{width:34px;height:34px;flex:none;display:grid;place-items:center;border:1px solid #3d3550;border-radius:50%;background:#1a1724;color:#d5c5f0;transition:background .18s,border-color .18s,transform .18s}
.call-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.call-button:hover:not(:disabled){background:#292039;border-color:#8260ae;transform:translateY(-1px)}
.call-button:disabled{opacity:.4;cursor:default}
.call-info-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.call-info-actions button{min-height:78px;display:grid;place-items:center;gap:5px;border:1px solid #342a43;border-radius:13px;background:#17131f;color:#ece5f6}
.call-info-actions button span{font-size:23px;color:#c9aaff}
.call-info-actions button b{font-size:11px}
.call-info-actions button:hover{border-color:#7452a1;background:#20182b}
.call-info-note{margin:14px 0 0;padding:10px 11px;border-radius:10px;background:#201b29;color:#b7abc8;font-size:10px;line-height:1.5}
@media(max-width:650px){.call-button{width:32px;height:32px}.call-button svg{width:16px;height:16px}.call-info-modal{width:min(360px,100%);padding:17px}.call-info-actions button{min-height:72px}}
/* El nombre y el estado del chat se recortan dentro de su columna, sin invadir avatar ni acciones. */
.chat-header{min-width:0}
.contact-profile-button{flex:none}
.header-copy{flex:1;min-width:0;overflow:hidden}
.header-copy strong,.header-copy span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-actions{flex:none;min-width:max-content}
/* Ánimo persistente en la cabecera del chat */
.mood-toggle{width:31px;height:31px;display:grid;place-items:center;flex:none;padding:0;border:1px solid #a8caff55;border-radius:50%;background:#15264c66;color:#d9eaff;transition:transform .2s,border-color .2s,background .2s}
.mood-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mood-toggle:hover:not(:disabled){transform:scale(1.07);border-color:#9deaff;background:#2756a977;box-shadow:0 0 14px #5adfff35}
.mood-toggle:disabled{opacity:.4}
.mood-picker{position:fixed;z-index:30;padding:14px;border:1px solid #a4caff55;border-radius:20px;background:linear-gradient(145deg,#192849d9,#101629e8);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);box-shadow:0 16px 46px #0008,0 0 22px #557fff20;color:#f4f7ff}
.mood-picker>strong,.mood-picker>small{display:block}.mood-picker>strong{font-size:13px}.mood-picker>small{margin-top:3px;color:#b5c5e2;font-size:10px}
.mood-picker-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:12px}
.mood-picker-grid button{height:38px;border:1px solid #ffffff18;border-radius:12px;background:#ffffff0a;font-size:23px;transition:transform .18s,background .18s,border-color .18s}
.mood-picker-grid button:hover{transform:translateY(-2px) scale(1.08);background:#5684ff27;border-color:#8adfff88}
.chat-header-mood-layer{position:absolute!important;inset:0!important;z-index:1!important;overflow:hidden!important;pointer-events:none!important;isolation:isolate}
.chat-header-mood-layer::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 55% 50%,var(--mood-glow,#82e8ff20),transparent 66%);animation:mood-aura-in .45s ease-out both}
.mood-floater{position:absolute;top:50%;left:-12%;font-size:24px;line-height:1;filter:drop-shadow(0 0 8px var(--mood-glow,#91eaff88));animation:mood-cross 4.8s cubic-bezier(.2,.65,.35,1) infinite;will-change:transform,opacity}
.mood-floater-2{animation-delay:-1.6s;font-size:17px;top:22%;opacity:.82}
.mood-floater-3{animation-delay:-3.2s;font-size:15px;top:68%;opacity:.72}
.mood-happy,.mood-party,.mood-love{--mood-glow:#8affd955}.mood-angry{--mood-glow:#ff625b55}.mood-sad,.mood-sleepy{--mood-glow:#7bb8ff55}.mood-surprised,.mood-thinking{--mood-glow:#d3a4ff55}.mood-fire{--mood-glow:#ffc25555}
.mood-angry .mood-floater{animation-name:mood-angry-cross}.mood-sad .mood-floater{animation-name:mood-sad-cross}.mood-happy .mood-floater,.mood-love .mood-floater,.mood-party .mood-floater{animation-name:mood-bounce-cross}
.mood-fading{opacity:0;transition:opacity .45s ease}
@keyframes mood-cross{0%{transform:translate3d(0,-50%,0) rotate(-16deg) scale(.48);opacity:0}12%{opacity:1}65%{opacity:1}100%{transform:translate3d(125vw,-50%,0) rotate(22deg) scale(1.08);opacity:0}}
@keyframes mood-angry-cross{0%{transform:translate3d(0,-50%,0) rotate(-12deg) scale(.5);opacity:0}12%{opacity:1}22%,38%,54%{transform:translate3d(24vw,-50%,0) rotate(12deg) scale(1.12)}30%,46%,62%{transform:translate3d(34vw,-50%,0) rotate(-12deg) scale(1)}100%{transform:translate3d(125vw,-50%,0) rotate(14deg) scale(.85);opacity:0}}
@keyframes mood-sad-cross{0%{transform:translate3d(0,-35%,0) rotate(-8deg);opacity:0}15%{opacity:.9}55%{transform:translate3d(62vw,15%,0) rotate(7deg);opacity:.82}100%{transform:translate3d(125vw,40%,0) rotate(12deg);opacity:0}}
@keyframes mood-bounce-cross{0%{transform:translate3d(0,-50%,0) scale(.5);opacity:0}14%{opacity:1}35%{transform:translate3d(38vw,-78%,0) scale(1.12)}55%{transform:translate3d(67vw,-30%,0) scale(.94)}100%{transform:translate3d(125vw,-55%,0) scale(1.08);opacity:0}}
@keyframes mood-aura-in{from{opacity:0}to{opacity:1}}
/* Panel translúcido de accesos externos */
.external-tip-modal{border:1px solid #9bc8ff55!important;background:linear-gradient(145deg,#17243bd9,#111726e8)!important;color:#f5f7ff!important;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);box-shadow:0 18px 55px #0009,0 0 25px #519bff22!important}
.external-tip-modal h2{color:#f7f8ff!important}.external-tip-modal header p,.external-tip-note{color:#c0cce0!important}
.external-tip-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.external-tip-method{min-width:0;min-height:68px;display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #9abaff35;border-radius:15px;background:#ffffff0a;color:#f6f7ff;text-decoration:none;text-align:left;transition:transform .18s,border-color .18s,background .18s}
.external-tip-method:hover:not(:disabled){transform:translateY(-2px);border-color:#83dcff99;background:#4b83ff1b}
.external-tip-method.unavailable{opacity:.48;cursor:not-allowed}
.external-tip-icon{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:12px;background:#ffffff12;font-size:17px;font-weight:800;box-shadow:inset 0 0 0 1px #ffffff15}
.provider-paypal{color:#7dd5ff}.provider-zelle{color:#c7a0ff}.provider-cashapp{color:#78f0ae}.provider-binance{color:#ffd66c}
.external-tip-copy{min-width:0;display:grid;gap:3px}.external-tip-copy strong{font-size:11px}.external-tip-copy small{overflow:hidden;color:#b5c1d5;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.external-tip-arrow{margin-left:auto;color:#a7dcff;font-size:16px}
@media(max-width:480px){.external-tip-modal{padding:16px!important;border-radius:20px!important}.external-tip-methods{gap:7px}.external-tip-method{min-height:62px;padding:8px;gap:7px}.external-tip-icon{width:30px;height:30px}}
@media(prefers-reduced-motion:reduce){.mood-toggle,.mood-picker-grid button,.external-tip-method{transition:none}.mood-floater{animation:none!important;left:48%;top:50%;transform:translateY(-50%);opacity:.9}.mood-floater-2,.mood-floater-3{display:none}}
/* Estados de ánimo persistentes: el selector queda siempre dentro del chat y la cabecera cambia según el emoji. */
.mood-picker{box-sizing:border-box!important;max-width:calc(100% - 16px)!important;min-width:0!important;max-height:min(380px,calc(100dvh - 16px))!important;overflow:auto!important;overscroll-behavior:contain!important;scrollbar-width:thin;scrollbar-color:#8dcfff55 transparent;padding:11px!important;border-radius:18px!important}
.mood-picker-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}.mood-picker-heading>div{min-width:0}.mood-picker-heading strong{display:block;font-size:12px}.mood-picker-heading small{display:block;margin-top:3px;color:#c3cce0;font-size:9px;line-height:1.35}
.mood-none{flex:none;min-height:30px;padding:0 10px;border:1px solid #b8ceff45;border-radius:999px;background:#ffffff10;color:#f6f7ff;font-size:10px}.mood-none:hover{border-color:#a8e8ff;background:#ffffff1a}
.mood-picker-grid{grid-template-columns:repeat(var(--mood-columns,6),minmax(0,1fr))!important;gap:5px!important;margin-top:9px!important}.mood-picker-grid .mood-choice{width:100%;height:36px!important;min-width:0;padding:0;border:1px solid #ffffff20;border-radius:11px;background:#ffffff0b;color:#fff;font-size:22px;line-height:1}.mood-picker-grid .mood-choice:hover,.mood-picker-grid .mood-choice:focus-visible{outline:0;transform:scale(1.06);background:#588aff32;border-color:#98eaffaa}
.mood-picker-compact{padding:8px!important}.mood-picker-compact .mood-picker-heading small{display:none}.mood-picker-compact .mood-picker-grid{gap:3px!important;margin-top:6px!important}.mood-picker-compact .mood-choice{height:32px!important;font-size:20px}
.chat-header{transition:background .45s ease,background-color .45s ease,box-shadow .45s ease,border-color .45s ease!important}
.chat-header-mood-layer{z-index:1!important;contain:layout paint!important;overflow:hidden!important;border-radius:inherit;--mood-a:#1476d4;--mood-b:#17b7c8;--mood-glow:#73dfff77}
.chat-header>.chat-header-mood-layer{position:absolute!important;z-index:0!important}.chat-header>:not(.chat-header-sparkles):not(.chat-header-mood-layer){position:relative!important;z-index:2!important}
.chat-header-mood-layer::before{content:"";position:absolute;inset:-15%;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,var(--mood-glow),transparent 65%),linear-gradient(112deg,var(--mood-a),var(--mood-b));opacity:.2;animation:mood-aura-in .7s ease-out both}
.mood-face{position:absolute;left:50%;top:50%;z-index:2;display:block;font-size:clamp(34px,8vw,52px);line-height:1;filter:drop-shadow(0 3px 9px #05091b88);transform-origin:50% 65%;animation:mood-face-happy 2.6s ease-in-out infinite}
.mood-face{opacity:.55}
.mood-effect{position:absolute;z-index:3;left:50%;top:50%;display:block;font-size:clamp(15px,4vw,23px);line-height:1;filter:drop-shadow(0 2px 5px #040718aa);will-change:transform,opacity}
.mood-effect-1{--mood-x:-75px;--mood-y:-13px;animation:mood-fx-rise 2.1s ease-in-out -0.2s infinite}.mood-effect-2{--mood-x:72px;--mood-y:-12px;animation:mood-fx-float 2.8s ease-in-out -.9s infinite}.mood-effect-3{--mood-x:-44px;--mood-y:17px;animation:mood-fx-orbit 3.2s ease-in-out -1.4s infinite}.mood-effect-4{--mood-x:47px;--mood-y:18px;animation:mood-fx-pop 2.5s ease-in-out -1.7s infinite}
.mood-button-face{display:block;font-size:19px;line-height:1;animation:mood-button-breathe 2.2s ease-in-out infinite}.mood-toggle.mood-active{border-color:#d5e8ff88;background:linear-gradient(135deg,#ffffff21,#ffffff0a);box-shadow:0 0 14px var(--mood-glow,#73dfff55),inset 0 0 0 1px #ffffff14}
.chat-header.mood-header-happy{background:linear-gradient(110deg,#11659b,#168fc3 50%,#35a98b)!important;box-shadow:0 5px 22px #087cb966,inset 0 1px #ffffff22!important}
.chat-header.mood-header-love{background:linear-gradient(112deg,#1167bf 0%,#416dd2 34%,#bc5caa 68%,#ee80b9 100%)!important;box-shadow:0 5px 24px #bf58bb66,inset 0 1px #ffffff28!important}
.chat-header.mood-header-angry{background:linear-gradient(112deg,#741b29,#e43632 47%,#ff762f 100%)!important;box-shadow:0 5px 25px #f13c2d88,inset 0 1px #ffd8aa44!important}
.chat-header.mood-header-sad{background:linear-gradient(110deg,#163b75,#2868a9 55%,#368caa)!important;box-shadow:0 5px 22px #347bc966!important}
.chat-header.mood-header-surprised{background:linear-gradient(110deg,#573295,#674dde 48%,#2488c1)!important;box-shadow:0 5px 22px #7654e877!important}
.chat-header.mood-header-laugh{background:linear-gradient(110deg,#986317,#df9228 52%,#c84e55)!important;box-shadow:0 5px 22px #df922866!important}
.chat-header.mood-header-party{background:linear-gradient(110deg,#a12e8a,#d94d82 48%,#e69237)!important;box-shadow:0 5px 23px #df528277!important}
.chat-header.mood-header-thinking{background:linear-gradient(110deg,#293e77,#5667ae 48%,#387d9b)!important;box-shadow:0 5px 22px #6077c966!important}
.chat-header.mood-header-sleepy{background:linear-gradient(110deg,#29265e,#51488d 52%,#725d9d)!important;box-shadow:0 5px 22px #7564b766!important}
.chat-header.mood-header-fire{background:linear-gradient(110deg,#8a3718,#e65b1e 50%,#dc9a27)!important;box-shadow:0 5px 24px #ec621e77!important}
.chat-header.mood-header-starstruck{background:linear-gradient(110deg,#253f9b,#6651d1 50%,#ba55bb)!important;box-shadow:0 5px 24px #8060ed77!important}
.chat-header.mood-header-cool{background:linear-gradient(110deg,#12485c,#147b91 52%,#386c9d)!important;box-shadow:0 5px 22px #16a2b866!important}
.chat-header.mood-header-crying{background:linear-gradient(110deg,#20356e,#3762a4 48%,#5885b9)!important;box-shadow:0 5px 22px #4e7fc477!important}
.chat-header.mood-header-hug{background:linear-gradient(110deg,#235a91,#7563bb 50%,#cf6ca0)!important;box-shadow:0 5px 23px #d878b877!important}
.chat-header.mood-header-scream{background:linear-gradient(110deg,#4d287d,#a83f8e 50%,#d94d59)!important;box-shadow:0 5px 24px #c440a977!important}
.chat-header.mood-header-eye-roll{background:linear-gradient(110deg,#4e456f,#74718b 52%,#a0786d)!important;box-shadow:0 5px 22px #a17b7b66!important}
.chat-header.mood-header-grimace{background:linear-gradient(110deg,#6a551e,#9a7b2c 50%,#65733b)!important;box-shadow:0 5px 22px #b2933b66!important}
.chat-header.mood-header-angel{background:linear-gradient(110deg,#487d9d,#73abc0 52%,#8b91cc)!important;box-shadow:0 5px 22px #89d2ec66!important}
.chat-header.mood-header-devil{background:linear-gradient(110deg,#4a183f,#a32e4b 50%,#d35b32)!important;box-shadow:0 5px 23px #e24a586e!important}
.chat-header.mood-header-sick{background:linear-gradient(110deg,#3f6141,#849344 52%,#987d35)!important;box-shadow:0 5px 22px #a4b34b66!important}
.chat-header.mood-header-cold{background:linear-gradient(110deg,#146987,#21a5c7 50%,#7398dd)!important;box-shadow:0 5px 22px #4dd3f277!important}
.chat-header.mood-header-hot{background:linear-gradient(110deg,#883044,#db5b35 52%,#e39a36)!important;box-shadow:0 5px 23px #f36b5277!important}
.chat-header.mood-header-silly{background:linear-gradient(110deg,#247349,#46a66e 48%,#b7a834)!important;box-shadow:0 5px 22px #57c87977!important}
.chat-header.mood-header-salute{background:linear-gradient(110deg,#275476,#268eaa 50%,#58a783)!important;box-shadow:0 5px 22px #4fc9c477!important}
.chat-header.mood-header-mindblown{background:linear-gradient(110deg,#25308a,#583fc1 46%,#a241a5 100%)!important;box-shadow:0 5px 25px #8f43dd88!important}
.chat-header.mood-header-pleading{background:linear-gradient(110deg,#5465a3,#9b79c6 52%,#d28bab)!important;box-shadow:0 5px 23px #d39aba77!important}
.chat-header.mood-header-smirk{background:linear-gradient(110deg,#315561,#567d80 52%,#977b54)!important;box-shadow:0 5px 22px #9a9c6266!important}
.chat-header.mood-header-strong{background:linear-gradient(110deg,#49387c,#7759af 52%,#bd5f77)!important;box-shadow:0 5px 23px #a464d477!important}
.chat-header.mood-header-heartbreak{background:linear-gradient(110deg,#334978,#565b89 48%,#98546f)!important;box-shadow:0 5px 22px #a452756e!important}
.chat-header.mood-header-green-heart{background:linear-gradient(110deg,#126455,#168a79 52%,#67a768)!important;box-shadow:0 5px 22px #25bb9277!important}
.chat-header.mood-header-extra{background:linear-gradient(112deg,var(--mood-header-a),var(--mood-header-b) 54%,var(--mood-header-c))!important;box-shadow:0 5px 24px var(--mood-header-glow),inset 0 1px #ffffff24!important}
.mood-happy{--mood-a:#168fc3;--mood-b:#35a98b;--mood-glow:#6af0c477}.mood-love{--mood-a:#2779d2;--mood-b:#e879ba;--mood-glow:#ff9edb99}.mood-angry{--mood-a:#db302f;--mood-b:#ff7b25;--mood-glow:#ff3c286e}.mood-sad{--mood-a:#2868a9;--mood-b:#368caa;--mood-glow:#73baff77}.mood-surprised{--mood-a:#674dde;--mood-b:#2488c1;--mood-glow:#c18cff77}.mood-laugh{--mood-a:#df9228;--mood-b:#c84e55;--mood-glow:#ffd35277}.mood-party{--mood-a:#d94d82;--mood-b:#e69237;--mood-glow:#ff76d877}.mood-thinking{--mood-a:#5667ae;--mood-b:#387d9b;--mood-glow:#8ab6ff77}.mood-sleepy{--mood-a:#51488d;--mood-b:#725d9d;--mood-glow:#b5a1ff77}.mood-fire{--mood-a:#e65b1e;--mood-b:#dc9a27;--mood-glow:#ffab3c88}.mood-starstruck{--mood-a:#6651d1;--mood-b:#ba55bb;--mood-glow:#df87ff88}.mood-cool{--mood-a:#147b91;--mood-b:#386c9d;--mood-glow:#5ce5ff77}.mood-crying{--mood-a:#3762a4;--mood-b:#5885b9;--mood-glow:#88c9ff77}.mood-hug{--mood-a:#7563bb;--mood-b:#cf6ca0;--mood-glow:#ffabd277}.mood-scream{--mood-a:#a83f8e;--mood-b:#d94d59;--mood-glow:#ff6da777}.mood-eye-roll{--mood-a:#74718b;--mood-b:#a0786d;--mood-glow:#c4a8b277}.mood-grimace{--mood-a:#9a7b2c;--mood-b:#65733b;--mood-glow:#dbc46677}.mood-angel{--mood-a:#73abc0;--mood-b:#8b91cc;--mood-glow:#b5f0ff88}.mood-devil{--mood-a:#a32e4b;--mood-b:#d35b32;--mood-glow:#ff655b88}.mood-sick{--mood-a:#849344;--mood-b:#987d35;--mood-glow:#d2d87177}.mood-cold{--mood-a:#21a5c7;--mood-b:#7398dd;--mood-glow:#8af1ff99}.mood-hot{--mood-a:#db5b35;--mood-b:#e39a36;--mood-glow:#ff9d5988}.mood-silly{--mood-a:#46a66e;--mood-b:#b7a834;--mood-glow:#9cff7e77}.mood-salute{--mood-a:#268eaa;--mood-b:#58a783;--mood-glow:#7fffd377}.mood-mindblown{--mood-a:#583fc1;--mood-b:#a241a5;--mood-glow:#eb71ff99}.mood-pleading{--mood-a:#9b79c6;--mood-b:#d28bab;--mood-glow:#ffc1dc88}.mood-smirk{--mood-a:#567d80;--mood-b:#977b54;--mood-glow:#c4d17c77}.mood-strong{--mood-a:#7759af;--mood-b:#bd5f77;--mood-glow:#e788b588}.mood-heartbreak{--mood-a:#565b89;--mood-b:#98546f;--mood-glow:#cc789577}.mood-green-heart{--mood-a:#168a79;--mood-b:#67a768;--mood-glow:#78f4b777}
.mood-angry .mood-face::before,.mood-angry .mood-face::after{position:absolute;top:10%;content:"💨";font-size:.42em;opacity:.82;filter:drop-shadow(0 0 6px #ffe1bf);animation:mood-angry-smoke 1.8s ease-out infinite}.mood-angry .mood-face::before{left:-.8em}.mood-angry .mood-face::after{right:-.85em;animation-delay:-.9s}.mood-angry .mood-effect-1,.mood-angry .mood-effect-3{font-size:25px;filter:drop-shadow(0 0 8px #ffd04c);animation-name:mood-angry-flame}.mood-love .mood-effect{filter:drop-shadow(0 0 8px #ffb2e8)}.mood-love .mood-effect-1{animation-name:mood-heart-left}.mood-love .mood-effect-2{animation-name:mood-heart-right}.mood-love .mood-effect-3{animation-name:mood-heart-rise}.mood-love .mood-effect-4{animation-name:mood-heart-drift}
.mood-happy .mood-face{animation-name:mood-face-happy}.mood-sad .mood-face{animation-name:mood-face-sad}.mood-surprised .mood-face{animation-name:mood-face-surprised}.mood-laugh .mood-face{animation-name:mood-face-laugh}.mood-party .mood-face{animation-name:mood-face-party}.mood-thinking .mood-face{animation-name:mood-face-think}.mood-sleepy .mood-face{animation-name:mood-face-sleep}.mood-fire .mood-face{animation-name:mood-face-fire}.mood-starstruck .mood-face{animation-name:mood-face-star}.mood-cool .mood-face{animation-name:mood-face-cool}.mood-crying .mood-face{animation-name:mood-face-cry}.mood-hug .mood-face{animation-name:mood-face-hug}.mood-scream .mood-face{animation-name:mood-face-scream}.mood-eye-roll .mood-face{animation-name:mood-face-roll}.mood-grimace .mood-face{animation-name:mood-face-grimace}.mood-angel .mood-face{animation-name:mood-face-angel}.mood-devil .mood-face{animation-name:mood-face-devil}.mood-sick .mood-face{animation-name:mood-face-sick}.mood-cold .mood-face{animation-name:mood-face-cold}.mood-hot .mood-face{animation-name:mood-face-hot}.mood-silly .mood-face{animation-name:mood-face-silly}.mood-salute .mood-face{animation-name:mood-face-salute}.mood-mindblown .mood-face{animation-name:mood-face-blown}.mood-pleading .mood-face{animation-name:mood-face-pleading}.mood-smirk .mood-face{animation-name:mood-face-smirk}.mood-strong .mood-face{animation-name:mood-face-strong}.mood-heartbreak .mood-face{animation-name:mood-face-heartbreak}.mood-green-heart .mood-face{animation-name:mood-face-green}
.mood-happy .mood-effect-1{animation-name:mood-happy-rays}.mood-sad .mood-effect-1,.mood-crying .mood-effect-1{animation-name:mood-teardrops}.mood-surprised .mood-effect-1{animation-name:mood-surprise-burst}.mood-laugh .mood-effect-1{animation-name:mood-laugh-bounce}.mood-party .mood-effect-1{animation-name:mood-party-confetti}.mood-thinking .mood-effect-1{animation-name:mood-thought-bubbles}.mood-sleepy .mood-effect-1{animation-name:mood-sleepy-drift}.mood-fire .mood-effect-1,.mood-hot .mood-effect-1{animation-name:mood-flame-dance}.mood-starstruck .mood-effect-1{animation-name:mood-star-spin}.mood-cool .mood-effect-1{animation-name:mood-cool-shades}.mood-hug .mood-effect-1{animation-name:mood-hug-orbit}.mood-scream .mood-effect-1{animation-name:mood-scream-zigzag}.mood-eye-roll .mood-effect-1{animation-name:mood-eye-loop}.mood-grimace .mood-effect-1{animation-name:mood-nervous-twitch}.mood-angel .mood-effect-1{animation-name:mood-angel-wings}.mood-devil .mood-effect-1{animation-name:mood-devil-tail}.mood-sick .mood-effect-1{animation-name:mood-sick-swirl}.mood-cold .mood-effect-1{animation-name:mood-snowflake-spin}.mood-silly .mood-effect-1{animation-name:mood-silly-wiggle}.mood-salute .mood-effect-1{animation-name:mood-salute-flash}.mood-mindblown .mood-effect-1{animation-name:mood-mindburst}.mood-pleading .mood-effect-1{animation-name:mood-pleading-twinkle}.mood-smirk .mood-effect-1{animation-name:mood-smirk-slide}.mood-strong .mood-effect-1{animation-name:mood-strong-pulse}.mood-heartbreak .mood-effect-1{animation-name:mood-heartbreak-fall}.mood-green-heart .mood-effect-1{animation-name:mood-leaf-swirl}
@keyframes mood-button-breathe{50%{transform:scale(1.12) rotate(4deg)}}@keyframes mood-fx-rise{0%,100%{transform:translate(var(--mood-x),calc(var(--mood-y) + 8px)) scale(.72);opacity:.18}50%{transform:translate(var(--mood-x),calc(var(--mood-y) - 9px)) scale(1.12);opacity:1}}@keyframes mood-fx-float{0%,100%{transform:translate(var(--mood-x),calc(var(--mood-y) + 7px)) rotate(-12deg);opacity:.35}50%{transform:translate(var(--mood-x),calc(var(--mood-y) - 8px)) rotate(14deg) scale(1.15);opacity:1}}@keyframes mood-fx-orbit{0%{transform:translate(var(--mood-x),var(--mood-y)) rotate(0) translateX(5px);opacity:.45}50%{transform:translate(var(--mood-x),var(--mood-y)) rotate(180deg) translateX(-6px);opacity:1}100%{transform:translate(var(--mood-x),var(--mood-y)) rotate(360deg) translateX(5px);opacity:.45}}@keyframes mood-fx-pop{0%,100%{transform:translate(var(--mood-x),var(--mood-y)) scale(.65);opacity:.35}50%{transform:translate(var(--mood-x),var(--mood-y)) scale(1.22);opacity:1}}@keyframes mood-angry-smoke{0%{transform:translateY(5px) scale(.55);opacity:0}25%{opacity:.9}100%{transform:translateY(-19px) scale(1.25);opacity:0}}@keyframes mood-angry-flame{0%,100%{transform:translate(var(--mood-x),calc(var(--mood-y) + 5px)) scale(.78) rotate(-8deg)}50%{transform:translate(var(--mood-x),calc(var(--mood-y) - 13px)) scale(1.25) rotate(9deg)}}
@keyframes mood-face-happy{0%,100%{transform:translate(-50%,-50%) rotate(-4deg) scale(.96)}50%{transform:translate(-50%,-57%) rotate(4deg) scale(1.08)}}@keyframes mood-face-sad{0%,100%{transform:translate(-50%,-47%) rotate(-4deg)}50%{transform:translate(-50%,-43%) rotate(3deg)}}@keyframes mood-face-surprised{0%,100%{transform:translate(-50%,-50%) scale(.92)}35%{transform:translate(-50%,-55%) scale(1.2)}55%{transform:translate(-50%,-50%) scale(1)}}@keyframes mood-face-laugh{0%,100%{transform:translate(-50%,-50%) rotate(-7deg)}25%{transform:translate(-50%,-55%) rotate(7deg)}50%{transform:translate(-50%,-47%) rotate(-7deg)}}@keyframes mood-face-party{0%,100%{transform:translate(-50%,-50%) rotate(-8deg) scale(.96)}50%{transform:translate(-50%,-62%) rotate(9deg) scale(1.1)}}@keyframes mood-face-think{0%,100%{transform:translate(-50%,-50%) rotate(2deg)}50%{transform:translate(-48%,-53%) rotate(-8deg)}}@keyframes mood-face-sleep{0%,100%{transform:translate(-50%,-48%) rotate(-5deg)}50%{transform:translate(-50%,-53%) rotate(4deg)}}@keyframes mood-face-fire{0%,100%{transform:translate(-50%,-49%) scale(.96) rotate(-3deg)}50%{transform:translate(-50%,-58%) scale(1.12) rotate(3deg)}}@keyframes mood-face-star{0%,100%{transform:translate(-50%,-50%) rotate(-6deg) scale(.96)}50%{transform:translate(-50%,-54%) rotate(7deg) scale(1.12)}}@keyframes mood-face-cool{0%,100%{transform:translate(-50%,-50%) rotate(0)}50%{transform:translate(-50%,-50%) rotate(-8deg)}}@keyframes mood-face-cry{0%,100%{transform:translate(-50%,-49%) rotate(-3deg)}50%{transform:translate(-50%,-45%) rotate(3deg)}}@keyframes mood-face-hug{0%,100%{transform:translate(-50%,-50%) scale(.95)}50%{transform:translate(-50%,-50%) scale(1.12)}}@keyframes mood-face-scream{0%,100%{transform:translate(-50%,-50%) scale(.95) rotate(-3deg)}20%,60%{transform:translate(-50%,-50%) scale(1.12) rotate(3deg)}}@keyframes mood-face-roll{0%,100%{transform:translate(-50%,-50%) rotate(-4deg)}50%{transform:translate(-50%,-50%) rotate(5deg)}}@keyframes mood-face-grimace{0%,100%{transform:translate(-50%,-50%) skewX(-2deg)}25%,75%{transform:translate(-50%,-50%) skewX(3deg)}}@keyframes mood-face-angel{0%,100%{transform:translate(-50%,-50%) translateY(2px)}50%{transform:translate(-50%,-57%)}}@keyframes mood-face-devil{0%,100%{transform:translate(-50%,-50%) rotate(-4deg) scale(1)}50%{transform:translate(-50%,-53%) rotate(5deg) scale(1.08)}}@keyframes mood-face-sick{0%,100%{transform:translate(-50%,-50%) rotate(-2deg)}25%{transform:translate(-52%,-50%) rotate(4deg)}75%{transform:translate(-48%,-50%) rotate(-4deg)}}@keyframes mood-face-cold{0%,100%{transform:translate(-50%,-50%) rotate(-3deg)}50%{transform:translate(-50%,-55%) rotate(3deg)}}@keyframes mood-face-hot{0%,100%{transform:translate(-50%,-48%) scale(.98)}50%{transform:translate(-50%,-55%) scale(1.08)}}@keyframes mood-face-silly{0%,100%{transform:translate(-50%,-50%) rotate(-8deg)}25%{transform:translate(-50%,-55%) rotate(8deg)}75%{transform:translate(-50%,-45%) rotate(-5deg)}}@keyframes mood-face-salute{0%,100%{transform:translate(-50%,-50%) rotate(0)}25%{transform:translate(-50%,-50%) rotate(-10deg)}55%{transform:translate(-50%,-53%) rotate(4deg)}}@keyframes mood-face-blown{0%,100%{transform:translate(-50%,-50%) scale(.92)}35%{transform:translate(-50%,-50%) scale(1.18)}55%{transform:translate(-50%,-50%) scale(.96)}}@keyframes mood-face-pleading{0%,100%{transform:translate(-50%,-49%) scale(.97)}50%{transform:translate(-50%,-53%) scale(1.08)}}@keyframes mood-face-smirk{0%,100%{transform:translate(-50%,-50%) rotate(2deg)}50%{transform:translate(-47%,-50%) rotate(-4deg)}}@keyframes mood-face-strong{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.14)}}@keyframes mood-face-heartbreak{0%,100%{transform:translate(-50%,-50%) rotate(-5deg)}40%{transform:translate(-50%,-52%) rotate(5deg)}70%{transform:translate(-50%,-48%) rotate(-4deg)}}@keyframes mood-face-green{0%,100%{transform:translate(-50%,-50%) rotate(-3deg)}50%{transform:translate(-50%,-56%) rotate(3deg)}}
@keyframes mood-happy-rays{0%,100%{transform:translate(-75px,-13px) rotate(-22deg) scale(.7);opacity:.2}50%{transform:translate(-75px,-19px) rotate(22deg) scale(1.2);opacity:1}}@keyframes mood-teardrops{0%{transform:translate(-75px,-5px);opacity:0}30%{opacity:1}100%{transform:translate(-65px,22px);opacity:0}}@keyframes mood-surprise-burst{0%,100%{transform:translate(-75px,-13px) scale(.5) rotate(0);opacity:.25}50%{transform:translate(-75px,-13px) scale(1.3) rotate(55deg);opacity:1}}@keyframes mood-laugh-bounce{0%,100%{transform:translate(-75px,-13px) rotate(-16deg)}50%{transform:translate(-75px,-22px) rotate(18deg)}}@keyframes mood-party-confetti{0%{transform:translate(-75px,20px) rotate(0);opacity:0}25%{opacity:1}100%{transform:translate(-52px,-25px) rotate(240deg);opacity:0}}@keyframes mood-thought-bubbles{0%{transform:translate(-75px,14px) scale(.5);opacity:0}50%{transform:translate(-75px,-5px) scale(1.1);opacity:1}100%{transform:translate(-75px,-25px) scale(.8);opacity:0}}@keyframes mood-sleepy-drift{0%,100%{transform:translate(-75px,4px) rotate(-10deg);opacity:.35}50%{transform:translate(-66px,-16px) rotate(12deg);opacity:1}}@keyframes mood-flame-dance{0%,100%{transform:translate(-75px,-12px) scale(.8) rotate(-12deg)}50%{transform:translate(-75px,-24px) scale(1.25) rotate(12deg)}}@keyframes mood-star-spin{0%{transform:translate(-75px,-13px) rotate(0) scale(.6);opacity:.25}50%{transform:translate(-75px,-13px) rotate(180deg) scale(1.2);opacity:1}100%{transform:translate(-75px,-13px) rotate(360deg) scale(.6);opacity:.25}}@keyframes mood-cool-shades{0%,100%{transform:translate(-75px,-13px) rotate(-10deg)}50%{transform:translate(-75px,-13px) rotate(10deg)}}@keyframes mood-hug-orbit{0%,100%{transform:translate(-75px,-13px) rotate(-12deg) scale(.9)}50%{transform:translate(-75px,-13px) rotate(12deg) scale(1.2)}}@keyframes mood-scream-zigzag{0%,100%{transform:translate(-80px,-13px)}25%{transform:translate(-68px,-20px)}50%{transform:translate(-80px,-7px)}75%{transform:translate(-68px,-18px)}}@keyframes mood-eye-loop{0%{transform:translate(-75px,-13px) rotate(0)}100%{transform:translate(-75px,-13px) rotate(360deg)}}@keyframes mood-nervous-twitch{0%,100%{transform:translate(-75px,-13px)}20%{transform:translate(-71px,-15px)}40%{transform:translate(-78px,-11px)}60%{transform:translate(-72px,-14px)}}@keyframes mood-angel-wings{0%,100%{transform:translate(-75px,-13px) rotate(-25deg)}50%{transform:translate(-75px,-13px) rotate(25deg)}}@keyframes mood-devil-tail{0%,100%{transform:translate(-75px,-13px) rotate(-12deg)}50%{transform:translate(-75px,-13px) rotate(18deg)}}@keyframes mood-sick-swirl{0%{transform:translate(-75px,-13px) rotate(0) scale(.8)}100%{transform:translate(-75px,-13px) rotate(360deg) scale(1.1)}}@keyframes mood-snowflake-spin{0%{transform:translate(-75px,-13px) rotate(0) scale(.85)}50%{transform:translate(-75px,-13px) rotate(180deg) scale(1.2)}100%{transform:translate(-75px,-13px) rotate(360deg) scale(.85)}}@keyframes mood-silly-wiggle{0%,100%{transform:translate(-75px,-13px) rotate(-16deg)}50%{transform:translate(-75px,-13px) rotate(16deg)}}@keyframes mood-salute-flash{0%,100%{transform:translate(-75px,-13px) scale(.8);opacity:.3}50%{transform:translate(-75px,-13px) scale(1.25);opacity:1}}@keyframes mood-mindburst{0%{transform:translate(-75px,-13px) scale(.2) rotate(0);opacity:0}45%{transform:translate(-75px,-13px) scale(1.4) rotate(100deg);opacity:1}100%{transform:translate(-75px,-13px) scale(.8) rotate(180deg);opacity:.1}}@keyframes mood-pleading-twinkle{0%,100%{transform:translate(-75px,-13px) scale(.6);opacity:.3}50%{transform:translate(-75px,-13px) scale(1.2);opacity:1}}@keyframes mood-smirk-slide{0%,100%{transform:translate(-75px,-13px) translateX(-4px)}50%{transform:translate(-75px,-13px) translateX(7px)}}@keyframes mood-strong-pulse{0%,100%{transform:translate(-75px,-13px) scale(.8)}50%{transform:translate(-75px,-13px) scale(1.3)}}@keyframes mood-heartbreak-fall{0%{transform:translate(-75px,-20px) rotate(-15deg);opacity:.2}50%{opacity:1}100%{transform:translate(-75px,10px) rotate(18deg);opacity:0}}@keyframes mood-leaf-swirl{0%{transform:translate(-75px,-13px) rotate(0)}50%{transform:translate(-75px,-18px) rotate(180deg)}100%{transform:translate(-75px,-13px) rotate(360deg)}}@keyframes mood-heart-left{0%,100%{transform:translate(-78px,-10px) scale(.65) rotate(-15deg);opacity:.35}50%{transform:translate(-82px,-27px) scale(1.18) rotate(12deg);opacity:1}}@keyframes mood-heart-right{0%,100%{transform:translate(55px,-18px) scale(.72) rotate(12deg);opacity:.32}50%{transform:translate(65px,-2px) scale(1.2) rotate(-12deg);opacity:1}}@keyframes mood-heart-rise{0%{transform:translate(-38px,12px) scale(.65);opacity:0}35%{opacity:1}100%{transform:translate(-45px,-28px) scale(1.1);opacity:0}}@keyframes mood-heart-drift{0%,100%{transform:translate(42px,12px) scale(.65) rotate(-10deg);opacity:.25}50%{transform:translate(55px,-20px) scale(1.08) rotate(12deg);opacity:1}}
@media(max-width:767px){.mood-picker{max-width:calc(100vw - 16px)!important}.mood-face{font-size:clamp(32px,10vw,46px)}}
@media(prefers-reduced-motion:reduce){.mood-face,.mood-effect,.mood-angry .mood-face::before,.mood-angry .mood-face::after,.mood-button-face{animation-duration:6s!important;animation-iteration-count:infinite!important}.mood-picker-grid .mood-choice{transition:none}}
/* Perfil con el mismo cristal azul suave de los paneles de Brisa */
#profileModal .profile-modal{border:1px solid #9bc8ff55;background:linear-gradient(145deg,#17243be8,#101726ed)!important;color:#f5f7ff;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);box-shadow:0 18px 55px #0009,0 0 25px #519bff20}
#profileModal .profile-modal header{background:transparent!important;border-bottom:1px solid #ffffff14}
#profileModal .profile-modal header h2,#profileModal .profile-modal h3{color:#f5f7ff}
#profileModal .profile-modal header p,#profileModal .profile-modal small,#profileModal .profile-modal .profile-link-editor p{color:#bdc9dd}
#profileModal .profile-photo-row,#profileModal .profile-link-editor,#profileModal .profile-privacy-section,#profileModal .profile-security-section{padding:13px;border:1px solid #a4caff26;border-radius:16px;background:#ffffff08}
#profileModal .profile-photo-row{margin:12px 0;align-items:center}
#profileModal .profile-preview{border:1px solid #8edfff88;box-shadow:0 0 18px #518dff35}
#profileModal .profile-link-editor{margin-top:12px}
#profileModal .profile-link-row{border-color:#9abaff30;background:#ffffff08}
#profileModal .profile-modal input:not([type=checkbox]):not([type=file]):not([type=range]),#profileModal .profile-modal textarea{border-color:#9abaff40;background:#0c1425;color:#f7f8ff}
#profileModal .profile-modal input:focus,#profileModal .profile-modal textarea:focus{border-color:#82dcff;box-shadow:0 0 0 3px #63bfff18}
#profileModal .profile-modal .privacy-switch{border-color:#a4caff30;background:#ffffff09;color:#e8efff}
#profileModal .profile-modal .crop-actions button,#profileModal .profile-modal .photo-picker,#profileModal .profile-modal .text-button{color:#b8d9ff}
@media(max-width:650px){#profileModal .profile-modal{border-radius:22px 22px 0 0!important;background:linear-gradient(160deg,#17243bf2,#101726f5)!important}}
/* Más profundidad y cajas mejor definidas en Editar perfil */
#profileModal{background:rgba(5,9,20,.48)!important;backdrop-filter:blur(13px) saturate(125%);-webkit-backdrop-filter:blur(13px) saturate(125%)}
#profileModal .profile-modal{border-color:#a5c9ff65;background:linear-gradient(145deg,rgba(27,43,72,.84),rgba(14,20,37,.88) 55%,rgba(29,25,57,.86))!important;backdrop-filter:blur(34px) saturate(165%);-webkit-backdrop-filter:blur(34px) saturate(165%);box-shadow:0 24px 80px #000a,0 0 36px #568fff24,inset 0 1px #ffffff20}
#profileModal .privacy-presence-settings,#profileModal .security-settings,#profileModal .profile-settings-list,#profileModal .chat-wallpaper-settings,#profileModal .color-settings-panel{margin-top:12px;padding:14px;border:1px solid #a4caff32;border-radius:18px;background:linear-gradient(145deg,#ffffff0c,#ffffff05)!important;box-shadow:inset 0 1px #ffffff0a,0 9px 24px #0002}
#profileModal .private-handle{border-color:#9ccaff42;border-radius:14px;background:linear-gradient(135deg,#407fbb22,#9b68f41c)!important;box-shadow:inset 0 1px #ffffff12}
#profileModal .profile-photo-row{border-color:#9fdcff42;background:linear-gradient(120deg,#2773a51e,#7555ca22,#ffffff07)!important;box-shadow:inset 0 1px #ffffff16,0 8px 24px #0002}
#profileModal .profile-link-editor{border-color:#9acaff42;background:linear-gradient(145deg,#ffffff0a,#647dff0b)!important}
#profileModal .profile-setting-option,#profileModal .style-choice-group,#profileModal .chat-wallpaper-swatch{border-color:#a4caff32!important;background:linear-gradient(135deg,#ffffff0c,#ffffff05)!important;border-radius:14px}
#profileModal .profile-setting-option:hover,#profileModal .color-palette button:hover{border-color:#91deff86!important;background:#70b9ff16!important;box-shadow:0 0 18px #5bbcff17}
#profileModal .profile-modal input:not([type=checkbox]):not([type=file]):not([type=range]),#profileModal .profile-modal textarea,#profileModal .profile-modal select{border-color:#9fcaff45!important;border-radius:12px!important;background:rgba(8,16,31,.62)!important;box-shadow:inset 0 1px 4px #0003}
#profileModal .profile-modal input:focus,#profileModal .profile-modal textarea:focus,#profileModal .profile-modal select:focus{border-color:#8ce3ff!important;box-shadow:0 0 0 3px #63bfff24,0 0 18px #55c9ff17!important}
#profileModal .profile-modal .privacy-switch{border-radius:14px;background:linear-gradient(120deg,#ffffff0d,#ffffff06)!important}
#profileModal .profile-modal button.primary.wide{border:1px solid #a8dfff65;border-radius:14px;background:linear-gradient(110deg,#5345d8,#3979e8 58%,#219ab6);box-shadow:0 8px 24px #497cff35,inset 0 1px #ffffff44}
@media(max-width:650px){#profileModal .profile-modal{background:linear-gradient(160deg,rgba(27,43,72,.92),rgba(14,20,37,.95) 60%,rgba(29,25,57,.94))!important}}
/* Selección difuminada para la navegación inferior */
.mobile-bottom>button{position:relative;isolation:isolate;overflow:visible;transition:color .24s ease,transform .24s ease,background .24s ease!important}
.mobile-bottom>button::before{content:"";position:absolute;z-index:-1;inset:2px 5px;border:1px solid transparent;border-radius:24px;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--brisa-accent,#7f72ff) 26%,transparent),transparent 74%);filter:blur(8px);opacity:0;transform:scale(.82);transition:opacity .3s ease,transform .3s ease,border-color .3s ease}
.mobile-bottom>button.selected{background:linear-gradient(135deg,color-mix(in srgb,var(--brisa-accent,#8175ff) 16%,transparent),color-mix(in srgb,var(--brisa-accent,#8175ff) 7%,transparent))!important;border-radius:22px!important;box-shadow:inset 0 1px #ffffff14,0 0 18px color-mix(in srgb,var(--brisa-accent,#8175ff) 11%,transparent)!important;transform:translateY(-1px)}
.mobile-bottom>button.selected::before{opacity:1;transform:scale(1);border-color:color-mix(in srgb,var(--brisa-accent,#8175ff) 32%,transparent)}
.mobile-bottom>button.selected .tab-icon{color:var(--brisa-accent-ink,#e2e8ff)!important;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--brisa-accent,#8175ff) 36%,transparent))}
.mobile-bottom>button.selected::after{height:2px!important;bottom:-2px!important;left:32%!important;right:32%!important;border-radius:50%!important;filter:blur(1px);opacity:.82}
@keyframes brisa-nav-arrive{0%{transform:scale(.92);opacity:.65}65%{transform:scale(1.025)}100%{transform:scale(1);opacity:1}}
.mobile-bottom>button.selected{animation:brisa-nav-arrive .28s ease-out both}
@media(prefers-reduced-motion:reduce){.mobile-bottom>button,.mobile-bottom>button::before{transition:none!important}.mobile-bottom>button.selected{animation:none}}
/* La foto de perfil mantiene una posición fija al cambiar de sección. */
@media(max-width:767px){
  #app.calls-only .sidebar>.brand .header-profile-avatar,
  html.phone-preview #app.calls-only .sidebar>.brand .header-profile-avatar{top:24px!important}
  #app.calls-only .mobile-title,
  html.phone-preview #app.calls-only .mobile-title{position:relative!important;z-index:1!important;margin-top:7px!important}
  #app.calls-only #callsScreen{position:relative!important;z-index:0!important}
}
/* Paletas independientes para acento, fondo, superficies y texto. */
.color-settings-panel{display:grid;gap:12px;margin-top:12px;padding:14px;border:1px solid #3a3150;border-radius:15px;background:#14111e}
.color-settings-panel h3{margin:0;color:#f5efff;font-size:14px}
.color-settings-panel>p{margin:-6px 0 0;color:#aaa0ba;font-size:10px;line-height:1.45}
.color-settings-panel>small{color:#9e93ae;font-size:9px}
.style-choice-group{display:grid;gap:7px;padding-top:10px;border-top:1px solid #ffffff12}
.style-choice-group>strong{font-size:10px;color:#e6d9f6}
.color-palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.color-palette button{min-width:0;min-height:56px;display:grid;justify-items:center;align-content:center;gap:4px;padding:5px 3px;border:1px solid #ffffff14;border-radius:10px;background:#ffffff05;color:#c8bfd4}
.color-palette button span{width:21px;height:21px;border:1px solid #ffffff55;border-radius:50%;background:#8c56ff;box-shadow:0 0 9px #8c56ff35}
.color-palette button b{overflow:hidden;max-width:100%;font-size:8px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.color-palette button[aria-pressed="true"]{border-color:#b995ff;background:#8756ff18;color:#fff;box-shadow:0 0 12px #8651ff28}
.color-palette [data-style-kind="accent"][data-style-value="violeta"] span{background:linear-gradient(135deg,#a34aff,#315dff)}
.color-palette [data-style-kind="accent"][data-style-value="azul"] span{background:linear-gradient(135deg,#168cff,#00aee8)}
.color-palette [data-style-kind="accent"][data-style-value="turquesa"] span{background:linear-gradient(135deg,#10b8b7,#177fe8)}
.color-palette [data-style-kind="accent"][data-style-value="rosa"] span{background:linear-gradient(135deg,#ea54b7,#8c4df4)}
.color-palette [data-style-kind="accent"][data-style-value="verde"] span{background:linear-gradient(135deg,#35c987,#149b91)}
.color-palette [data-style-kind="accent"][data-style-value="ambar"] span{background:linear-gradient(135deg,#efaa45,#d96b43)}
.color-palette [data-style-kind="background"][data-style-value="noche"] span{background:#080b17}
.color-palette [data-style-kind="background"][data-style-value="azul-noche"] span{background:#07101d}
.color-palette [data-style-kind="background"][data-style-value="ciruela"] span{background:#100b18}
.color-palette [data-style-kind="background"][data-style-value="carbon"] span{background:#101114}
.color-palette [data-style-kind="surface"][data-style-value="ciruela"] span{background:#21182d}
.color-palette [data-style-kind="surface"][data-style-value="azul"] span{background:#19243a}
.color-palette [data-style-kind="surface"][data-style-value="carbon"] span{background:#252831}
.color-palette [data-style-kind="surface"][data-style-value="petroleo"] span{background:#163136}
.color-palette [data-style-kind="text"][data-style-value="blanco"] span{background:#f7f6ff}
.color-palette [data-style-kind="text"][data-style-value="lavanda"] span{background:#eee4ff}
.color-palette [data-style-kind="text"][data-style-value="hielo"] span{background:#e2f6ff}
.color-palette [data-style-kind="text"][data-style-value="calido"] span{background:#fff0dc}
html body,html .app{background-color:var(--brisa-page,#080b17)!important;color:var(--brisa-text,#f7f6ff)!important}
html .panel,html .modal,html .profile-settings-list,html .chat-wallpaper-settings,html .call-empty,html .composer,html .mobile-bottom,html .status-row,html .bubble:not(.mine){background-color:var(--brisa-surface,#171321)!important}
html .sidebar,html .chat,html .details{background-color:var(--brisa-page-raised,#0c1020)!important}
html .chat-header,html .composer-wrap,html .profile-modal header{background-color:var(--brisa-surface,#171321)!important}
html body,html .mobile-title,html .row-top strong,html .header-copy strong,html .status-heading h2,html .call-empty h3,html .details-person h2,html .message .bubble{color:var(--brisa-text,#f7f6ff)!important}
html .row-sub,html .row-time,html .header-copy span,html .status-heading span,html .call-empty p,html .composer-note,html .details-person p{color:var(--brisa-muted,#b7b4c2)!important}
html .primary,html .send,html .mobile-menu,html .new-chat-action{background:linear-gradient(135deg,var(--brisa-accent,#a34aff),var(--brisa-accent-2,#315dff))!important;color:#fff!important;border-color:var(--brisa-accent)!important}
html .nav.active{background:var(--brisa-accent-soft,#28163e)!important;color:var(--brisa-accent-ink,#f2e7ff)!important}
html .mobile-bottom button.selected{background:var(--brisa-accent-soft,#28163e)!important;color:var(--brisa-accent-ink,#f2e7ff)!important}
html .mobile-bottom button.selected span{color:var(--brisa-accent-ink,#f2e7ff)!important;text-shadow:0 0 12px var(--brisa-accent)!important}
html .mobile-bottom button.selected:after{background:var(--brisa-accent)!important;box-shadow:0 0 9px var(--brisa-accent)!important}
html .tip-button{border-color:var(--brisa-accent)!important;color:var(--brisa-accent-ink)!important}
html .call-button{border-color:var(--brisa-accent)!important;color:var(--brisa-accent-ink)!important}
/* Acciones de llamada y dinero: cristal azul-violeta con brillo suave en el contorno. */
html .call-button,html .tip-button{position:relative!important;isolation:isolate!important;overflow:visible!important;border:1px solid #9bdfff88!important;background:linear-gradient(145deg,#ffffff20,#8ccaff0b)!important;color:#eff8ff!important;backdrop-filter:blur(14px) saturate(155%)!important;-webkit-backdrop-filter:blur(14px) saturate(155%)!important;box-shadow:0 0 0 1px #75caff12,inset 0 1px #ffffff24,0 0 13px #397dff30!important;transition:transform .2s ease,border-color .25s ease,box-shadow .3s ease,background .3s ease!important;animation:brisa-action-glow 4.4s ease-in-out infinite}
html .call-button::before,html .tip-button::before{content:"";position:absolute;z-index:0;inset:-2px;border-radius:inherit;padding:1px;pointer-events:none;background:conic-gradient(from 0deg,transparent 0 245deg,#7ce7ff66 275deg,#d8c8ff 300deg,#75cbffcc 316deg,transparent 342deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.52;animation:brisa-action-edge 8s linear infinite}
html .call-button::after{content:"✦";position:absolute;z-index:3;top:-5px;right:-4px;color:#d9f7ff;font-size:9px;line-height:1;text-shadow:0 0 7px #64d8ff,0 0 13px #8a79ff;opacity:0;pointer-events:none;animation:brisa-action-spark 4.4s ease-in-out infinite}
html .call-button svg,html .tip-button>span{position:relative;z-index:1}
html .tip-button::after{z-index:3;filter:drop-shadow(0 0 5px #8be4ff);animation-duration:8s}
html .call-button:hover:not(:disabled),html .tip-button:hover:not(:disabled){transform:translateY(-1px) scale(1.04)!important;border-color:#b8f1ff!important;background:linear-gradient(145deg,#ffffff2e,#549fff20)!important;box-shadow:0 0 0 1px #96e7ff38,inset 0 1px #ffffff35,0 0 19px #45aaff66!important}
html .call-button:disabled,html .tip-button:disabled{filter:saturate(.55);animation:none;opacity:.48}
@keyframes brisa-action-glow{0%,100%{box-shadow:0 0 0 1px #75caff12,inset 0 1px #ffffff24,0 0 11px #397dff25}50%{box-shadow:0 0 0 1px #75caff30,inset 0 1px #ffffff35,0 0 17px #58bfff52}}
@keyframes brisa-action-edge{to{transform:rotate(360deg)}}
@keyframes brisa-action-spark{0%,12%,100%{opacity:0;transform:translate(-5px,5px) scale(.6)}30%,52%{opacity:1;transform:translate(0,0) scale(1)}72%{opacity:0;transform:translate(5px,-4px) scale(.7)}}
@media(prefers-reduced-motion:reduce){html .call-button,html .tip-button{animation:none!important}html .call-button::before,html .tip-button::before,html .call-button::after,html .tip-button::after{animation:none!important;opacity:.35}}
html .mine .bubble{background:linear-gradient(135deg,var(--brisa-accent),var(--brisa-accent-2))!important;border-color:var(--brisa-accent)!important;color:#fff!important}
html .status-form textarea,html .profile-modal textarea{background:var(--brisa-page)!important;color:var(--brisa-text)!important}
/* Acciones de borrado por mensaje y limpieza local del chat. */
.message{position:relative}.message-actions{display:flex;align-items:center;gap:5px}.message-delete-toggle{width:27px;height:25px;border:1px solid #8bcfff35;border-radius:9px;background:rgba(13,22,40,.72);color:#b9dfff;font-size:17px;line-height:1;opacity:.78;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.message-delete-toggle:hover,.message-delete-toggle:focus-visible{opacity:1;border-color:#83dfff9c;box-shadow:0 0 14px #56baff30}.message-delete-menu{position:absolute;z-index:20;right:0;bottom:calc(100% + 6px);min-width:168px;display:grid;gap:4px;padding:7px;border:1px solid #9acfff49;border-radius:14px;background:rgba(15,23,41,.94);box-shadow:0 12px 34px #0007;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.message:not(.mine) .message-delete-menu{right:auto;left:30px}.message-delete-menu button{padding:10px 11px;border-radius:9px;background:transparent;color:#f1f5ff;text-align:left;font-size:12px}.message-delete-menu button:hover,.message-delete-menu button:focus-visible{background:#68baff1e;color:#b5eaff}.message-delete-menu button:last-child:not(:first-child){color:#ffb5ca}.clear-chat-action{margin-top:16px;padding:14px;border:1px solid #9acfff35;border-radius:15px;background:linear-gradient(145deg,#ffffff0c,#68afff08)}.clear-chat-action h3{margin:0 0 7px;font-size:13px}.clear-chat-action p{margin:0 0 11px;color:#c1c9db;font-size:11px;line-height:1.5}.clear-chat-action button{padding:9px 12px;border:1px solid #ff8b9e50;border-radius:10px;background:#ef597c18;color:#ffc4d0;font-size:11px;font-weight:650}.clear-chat-action button:hover{background:#ef597c2c;box-shadow:0 0 16px #ef597c22}@media(max-width:650px){.message-actions{gap:3px}.message-delete-toggle{width:25px;height:24px}.message-delete-menu{position:fixed;right:12px!important;left:auto!important;bottom:calc(env(safe-area-inset-bottom) + 84px);min-width:190px}.clear-chat-action{margin-top:12px}}
/* Pagos externos: revisión visible antes de marcar un reporte como recibido. */
#externalPaymentModal .modal{border-color:#84c9ff52;background:linear-gradient(155deg,rgba(24,38,64,.97),rgba(13,19,35,.97));box-shadow:0 24px 80px #0009,0 0 35px #54b9ff18}#externalPaymentModal .modal header h2{color:#f4f8ff}#externalPaymentModal .modal header p,#externalPaymentModal .external-payment-warning{color:#b6c4dc;font-size:11px;line-height:1.5}#externalPaymentModal label:not(.dropzone){display:grid;gap:6px;margin:12px 0;color:#e5efff;font-size:11px;font-weight:650}#externalPaymentModal input:not([type=file]),#externalPaymentModal select{width:100%;height:42px;border:1px solid #89bfff3d;border-radius:11px;padding:0 11px;background:#0b1426;color:#f4f8ff}#externalPaymentModal input[type=file]{display:none}#externalPaymentModal .dropzone{display:grid;gap:7px;border-color:#8dd3ff55;background:#83cbff0c;color:#dceeff}#externalPaymentModal .external-payment-warning{margin:12px 0 0}#externalPaymentModal .primary{margin-top:14px}.external-payment-report-button{margin-top:12px}.external-payment-pending-section{display:grid;gap:10px;margin-bottom:14px}.external-payment-pending-section h3{margin:0;color:#dceaff;font-size:13px}.external-payment-pending-card{display:grid;gap:6px;padding:13px;border:1px solid #8ccfff3d;border-radius:14px;background:linear-gradient(145deg,#ffffff0b,#4faeff09)}.external-payment-pending-card strong{color:#eef6ff;font-size:12px}.external-payment-pending-card span,.external-payment-pending-card time,.external-payment-pending-card small{color:#afbdd4;font-size:10px}.external-payment-pending-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:5px}.external-payment-pending-actions button{padding:8px 10px;border:1px solid #85cfff42;border-radius:10px;background:#68bfff13;color:#dff2ff;font-size:10px}.external-payment-pending-actions button:last-child{border-color:#5de0aa65;background:#20bd781b;color:#9cf3c8}.external-payment-pending-actions button:nth-child(2){border-color:#ff9ca45c;color:#ffc5cc}
/* Acentos separados de los botones del encabezado. */
html .tip-button{border-color:#74e7a7!important;color:#b7ffd2!important;background:linear-gradient(145deg,#ffffff20,#25c87922)!important;box-shadow:0 0 15px #24c97924,inset 0 1px #ffffff30!important}html .tip-button::before{background:conic-gradient(from 0deg,transparent 0 245deg,#73e9a566 275deg,#c9ffde 300deg,#45d98ecc 316deg,transparent 342deg)}html .tip-button::after{filter:drop-shadow(0 0 5px #88ffc1);color:#d8ffe8}html .tip-button:hover:not(:disabled){border-color:#a7ffd0!important;background:linear-gradient(145deg,#ffffff2d,#24cb7930)!important;box-shadow:0 0 0 1px #9bffc540,inset 0 1px #ffffff35,0 0 20px #2ad78755!important}html .call-button{border-color:#ffc08b!important;color:#ffd0a5!important;background:linear-gradient(145deg,#ffffff1d,#ea874516)!important;box-shadow:0 0 14px #f2a35a1b,inset 0 1px #ffffff25!important}html .call-button::before{background:conic-gradient(from 0deg,transparent 0 245deg,#ffb57955 275deg,#ffe0bd 300deg,#f08d61cc 316deg,transparent 342deg)}html .call-button::after{color:#ffe1bf;text-shadow:0 0 7px #ffad66,0 0 13px #f27e55}html .call-button:hover:not(:disabled){border-color:#ffdab8!important;background:linear-gradient(145deg,#ffffff2e,#ffad5b20)!important;box-shadow:0 0 0 1px #ffcd9b35,inset 0 1px #ffffff35,0 0 19px #f0a45b45!important}

/* Aviso honesto de privacidad al abrir conversaciones. */
#messages .encryption-notice{width:min(100%,420px);margin:7px auto 10px;padding:11px 13px;display:flex;align-items:flex-start;gap:10px;border:1px solid rgba(115,205,174,.24);border-radius:14px;background:linear-gradient(135deg,rgba(43,119,94,.17),rgba(45,126,171,.1));color:#dceee9;box-shadow:inset 0 1px rgba(255,255,255,.045);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}#messages .encryption-notice-icon{width:28px;height:28px;flex:none;display:grid;place-items:center;border:1px solid rgba(115,205,174,.22);border-radius:9px;background:rgba(46,147,111,.14);font-size:13px}#messages .encryption-notice strong{display:block;margin:1px 0 4px;color:#d9f1e8;font-size:11px;font-weight:650}#messages .encryption-notice p{margin:0;color:#b7ccc8;font-size:10px;line-height:1.45}

/* Créditos internos claramente separados del dinero real. */
.credit-wallet-card{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 13px;padding:15px 16px;border:1px solid #83cfff38;border-radius:17px;background:linear-gradient(115deg,#163354bb,#26224dbc 58%,#113e48aa);box-shadow:inset 0 1px #ffffff18,0 10px 27px #0003;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.credit-wallet-card>div{display:grid;gap:4px}.credit-wallet-label{color:#b8cee1;font-size:10px}.credit-wallet-amount{color:#f5f8ff;font-size:25px;font-weight:720;letter-spacing:.01em}.credit-wallet-mark{display:grid;place-items:center;width:43px;height:43px;border:1px solid #77e0c766;border-radius:14px;background:linear-gradient(135deg,#24c28d31,#2c99d536);color:#8cf1cb;font-size:22px;box-shadow:0 0 17px #24cd9c20}.wallet-tip-balance{margin:8px 0;padding:10px 12px;border:1px solid #5acfa637;border-radius:12px;background:#28a97d12;color:#a7f1d5;font-size:12px;text-align:center}.wallet-tip-external{display:block;width:100%;margin-top:8px;text-align:center}.credit-topup-modal{width:min(390px,calc(100vw - 30px));max-height:min(78dvh,560px);overflow:auto;border:1px solid #7ecfff55;background:linear-gradient(145deg,#15253eeF,#101629f5 65%,#1b1934f2);box-shadow:0 20px 70px #0009,0 0 25px #428bff18}.credit-topup-modal header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.credit-topup-modal header p{margin:5px 0 0;color:#c4d9eb;font-size:11px}.credit-topup-options{display:grid;gap:8px;margin:15px 0 12px}.credit-topup-option{display:grid;gap:4px;width:100%;padding:12px 14px;border:1px solid #89cdff30;border-radius:14px;background:linear-gradient(115deg,#ffffff0c,#3daeff10);color:#edf6ff;text-align:left}.credit-topup-option:hover:not(:disabled){border-color:#91e4ff8a;background:linear-gradient(115deg,#398ff324,#35c7a11c);box-shadow:0 0 17px #52bdff16}.credit-topup-option strong{font-size:14px}.credit-topup-option small{color:#a9bed4;font-size:10px}.credit-topup-note{margin:0;padding:10px 11px;border:1px solid #ffc97435;border-radius:12px;background:#dd9d2410;color:#e5d4ad;font-size:10px;line-height:1.5}.credit-topup-pending{padding:14px;border:1px dashed #89bdf844;border-radius:12px;color:#becde1;font-size:12px;text-align:center}.credit-history-section{display:grid;gap:8px;margin:4px 0 12px}.credit-history-section h3{margin:0 0 2px;color:#c5d7ef;font-size:12px}.credit-history-row{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:10px 12px;border:1px solid #84cfff25;border-radius:13px;background:#ffffff08}.credit-history-row strong{color:#e9f2ff;font-size:11px}.credit-history-row b{color:#83edc1;font-size:12px}.credit-history-row time{grid-column:1/-1;color:#aab8cd;font-size:10px}
@media(max-width:767px){.credit-topup-modal{width:calc(100vw - 28px);max-width:430px;max-height:calc(75dvh - env(safe-area-inset-top));border-radius:20px}}

.wallet-tip-external-methods{margin-top:17px;padding-top:14px;border-top:1px solid #8dcfff26}.wallet-tip-external-methods h3{margin:0;color:#e5f0ff;font-size:13px}.wallet-tip-external-methods .external-tip-methods{margin:9px 0}.wallet-tip-external-methods .external-tip-note{margin:4px 0 9px;color:#b7c5d8;font-size:10px;line-height:1.45}.wallet-tip-external-methods .wallet-tip-report{width:100%;padding:10px;border:1px solid #85cfff45;border-radius:12px;background:#4089ff14;color:#d9edff}.wallet-tip-external-methods .wallet-tip-report:disabled{opacity:.5;cursor:not-allowed}#tipModal .modal{max-height:min(84dvh,720px);overflow-y:auto;overscroll-behavior:contain}

.empty-icon.brisa-empty-logo{overflow:hidden;width:64px;height:64px;border:1px solid #79cfff55;border-radius:21px;background:linear-gradient(145deg,#161a47,#062c4d 62%,#10233d);box-shadow:0 0 28px #347eff30,inset 0 1px #ffffff22}.brisa-empty-logo img{width:50px;height:50px;object-fit:contain;filter:drop-shadow(0 0 8px #42caff55)}
/* Acciones del mensaje: solo se muestran al mantenerlo pulsado o abrir el menú contextual. */
.message-actions{display:none!important}.message.message-selected .bubble{outline:1px solid #8ad8ff55;box-shadow:0 0 18px #58bfff18}.message-context-menu{position:absolute;z-index:40;right:0;bottom:calc(100% + 8px);width:min(258px,calc(100vw - 24px));display:grid;gap:5px;padding:10px;border:1px solid #9acfff55;border-radius:16px;background:rgba(15,23,41,.96);box-shadow:0 14px 38px #0008;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.message:not(.mine) .message-context-menu{right:auto;left:28px}.message-context-heading{padding:2px 4px;color:#b8c7df;font-size:10px;font-weight:700;letter-spacing:.03em}.message-context-reactions{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px}.message-context-reactions button{min-width:0;aspect-ratio:1;border:1px solid #9acfff17;border-radius:10px;background:#ffffff0a;color:#fff;font-size:19px;line-height:1;transition:transform .16s,background .16s}.message-context-reactions button:hover,.message-context-reactions button:focus-visible{transform:translateY(-2px) scale(1.06);background:#68baff22}.message-context-divider{height:1px;margin:2px 0;background:#ffffff18}.message-context-menu>button:not(.message-context-reactions button){min-height:36px;padding:8px 10px;border-radius:9px;background:transparent;color:#f1f5ff;text-align:left;font-size:12px}.message-context-menu>button:hover,.message-context-menu>button:focus-visible{background:#68baff1e;color:#b5eaff}.message-context-menu>button:last-child:not(:first-child){color:#ffb5ca}@media(max-width:650px){.message-context-menu{position:fixed;left:50%!important;right:auto!important;bottom:calc(env(safe-area-inset-bottom,0px) + 88px);transform:translateX(-50%);width:min(258px,calc(100vw - 24px));max-height:min(42vh,300px);overflow:auto}.message-context-reactions button{font-size:21px}}
.message-context-menu>button:last-child:not(.delete-for-everyone){color:#f1f5ff}.message-context-menu>button.delete-for-everyone{color:#ffb5ca!important}

/* Confirmación de propina de créditos y reglas futuras de pagos. */
.credit-tip-confirmation{margin:12px 0 4px;padding:15px;border:1px solid #65d6a75c;border-radius:16px;background:linear-gradient(145deg,#1747385c,#172a3cbb 65%,#24204788);box-shadow:inset 0 1px #ffffff17,0 12px 30px #0003;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.credit-tip-confirmation h3{margin:0 0 7px;color:#eafff4;font-size:15px}.credit-tip-confirm-copy{margin:0;color:#e4f4ee;font-size:13px;line-height:1.5}.credit-tip-confirm-disclaimer{margin:10px 0 13px;color:#b9d2c9;font-size:10px;line-height:1.5}.credit-tip-confirm-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:8px}.credit-tip-confirm-actions button{min-width:0;padding:10px 8px;border-radius:11px;font-size:11px}.credit-tip-confirm-actions .primary{background:linear-gradient(135deg,#31c889,#168c79)!important;border-color:#55e2ae!important}.credit-tip-confirmation.success{border-color:#65e8ad99;background:linear-gradient(145deg,#14573c88,#172a3cdd 72%,#24204788)}.brisa-fee-policy{display:grid;gap:5px;margin:-3px 0 13px;padding:12px 13px;border:1px solid #8fcfff2a;border-radius:14px;background:linear-gradient(130deg,#ffffff0a,#49aaff0b);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.brisa-fee-policy strong{color:#e8f4ff;font-size:11px}.brisa-fee-policy span{color:#d0deee;font-size:10px;line-height:1.45}.brisa-fee-policy small,.test-credit-disclaimer{color:#9eb2c8;font-size:9px;line-height:1.4}.transaction-card .test-credit-disclaimer{display:block;margin-top:2px}.payment-history-item-head b{max-width:54%;font-size:11px;text-align:right}.payment-demo-status{line-height:1.4}
@media(max-width:767px){.credit-tip-confirmation{margin:10px 0 3px;padding:13px}.credit-tip-confirm-actions button{font-size:10px}.brisa-fee-policy{padding:10px 11px}}

/* Indicador discreto del ánimo, aislado por fila de conversación. */
.conv-row.has-chat-mood{background:linear-gradient(100deg,color-mix(in srgb,var(--row-mood-a,#3c63c9) 16%,transparent),color-mix(in srgb,var(--row-mood-b,#7551bb) 7%,transparent) 48%,transparent)!important;box-shadow:inset 2px 0 0 color-mix(in srgb,var(--row-mood-c,#7bd8ef) 58%,transparent)}
.conv-row.has-chat-mood:hover,.conv-row.has-chat-mood.active{background:linear-gradient(100deg,color-mix(in srgb,var(--row-mood-a,#3c63c9) 23%,transparent),color-mix(in srgb,var(--row-mood-b,#7551bb) 12%,transparent) 48%,#ffffff08)!important}
.row-mood{display:flex;align-items:center;gap:4px;width:max-content;max-width:100%;height:12px;margin-top:1px;padding:0 5px 0 3px;border:1px solid color-mix(in srgb,var(--row-mood-c,#7bd8ef) 27%,transparent);border-radius:7px;background:color-mix(in srgb,var(--row-mood-a,#3c63c9) 10%,transparent);color:#d5e1f5;font-size:8px;line-height:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-mood-face{flex:none;font-size:9px;line-height:1}.row-mood-label{overflow:hidden;text-overflow:ellipsis}
@media(max-width:767px){.row-mood{height:10px;margin-top:0;padding:0 4px 0 2px;font-size:7px;line-height:8px}.row-mood-face{font-size:8px}.conv-row.has-chat-mood{box-shadow:inset 2px 0 0 color-mix(in srgb,var(--row-mood-c,#7bd8ef) 53%,transparent)}}

/* El ánimo queda en una línea propia bajo el último mensaje y legible en móvil. */
.row-mood{height:17px;margin-top:4px;padding:1px 8px 1px 5px;gap:5px;border-color:color-mix(in srgb,var(--row-mood-c,#7bd8ef) 42%,transparent);background:linear-gradient(105deg,color-mix(in srgb,var(--row-mood-a,#3c63c9) 24%,#0b1222),color-mix(in srgb,var(--row-mood-b,#7551bb) 17%,#0b1222));box-shadow:inset 0 1px #ffffff12,0 2px 8px color-mix(in srgb,var(--row-mood-a,#3c63c9) 12%,transparent);color:#e8f1ff;font-size:10px;font-weight:650;line-height:13px}
.row-mood-face{font-size:12px;line-height:1}.row-mood-label{line-height:13px}
@media(max-width:767px){.row-mood{height:16px;margin-top:3px;padding:1px 7px 1px 4px;gap:4px;font-size:9px;line-height:12px}.row-mood-face{font-size:11px}.row-mood-label{line-height:12px}}
.row-mood{position:relative;isolation:isolate;overflow:hidden;border-color:color-mix(in srgb,var(--row-mood-c,#7bd8ef) 46%,transparent);background:linear-gradient(100deg,color-mix(in srgb,var(--row-mood-a,#3c63c9) 19%,#0b1222),#10192b 42%,#10192b 58%,color-mix(in srgb,var(--row-mood-b,#7551bb) 20%,#0b1222));box-shadow:inset 0 0 0 1px #ffffff08,0 2px 8px color-mix(in srgb,var(--row-mood-a,#3c63c9) 16%,transparent)}
.row-mood:before{content:"";position:absolute;z-index:-1;inset:-1px;border-radius:inherit;background:linear-gradient(105deg,transparent 0%,color-mix(in srgb,var(--row-mood-c,#7bd8ef) 20%,transparent) 18%,transparent 38%,color-mix(in srgb,var(--row-mood-b,#7551bb) 18%,transparent) 68%,transparent 100%);background-size:220% 100%;animation:rowMoodDrift 5s ease-in-out infinite alternate;pointer-events:none}
@keyframes rowMoodDrift{from{background-position:0% 50%;filter:brightness(.88)}to{background-position:100% 50%;filter:brightness(1.12)}}
@media(prefers-reduced-motion:reduce){.row-mood:before{animation:none}}

/* Cada conversación lleva la misma animación gráfica que su cabecera, como fondo propio. */
html.phone-preview #app .conversation-item .conv-row.has-chat-mood,.conversation-item .conv-row.has-chat-mood{position:relative!important;isolation:isolate!important;overflow:hidden!important;border-bottom-color:transparent!important;background:linear-gradient(112deg,color-mix(in srgb,var(--row-mood-a,#3c63c9) 84%,#0c1220),color-mix(in srgb,var(--row-mood-b,#7551bb) 78%,#0c1220) 54%,color-mix(in srgb,var(--row-mood-c,#7bd8ef) 72%,#0c1220))!important;box-shadow:none!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual,.conversation-item .conv-row.has-chat-mood .row-mood-visual{position:absolute!important;inset:0!important;z-index:1!important;width:100%!important;height:100%!important;overflow:hidden!important;border-radius:inherit!important;opacity:1!important;transform:none!important;mask-image:none!important;pointer-events:none!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual::before,.conversation-item .conv-row.has-chat-mood .row-mood-visual::before{inset:-30%!important;background:radial-gradient(ellipse at 76% 50%,var(--mood-glow,#9b8aff99),transparent 52%),linear-gradient(112deg,var(--mood-a,#3c63c9),var(--mood-b,#7551bb) 55%,var(--mood-glow,#7bd8ef))!important;background-size:150% 150%!important;opacity:.42!important;animation:mood-row-aura 6s ease-in-out infinite alternate!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-face,.conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-face{left:76%!important;top:50%!important;font-size:32px!important;opacity:.88!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-effect,.conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-effect{font-size:17px!important;opacity:.92!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood>.avatar,html.phone-preview #app .conversation-item .conv-row.has-chat-mood>.row-copy,html.phone-preview #app .conversation-item .conv-row.has-chat-mood>.row-time,html.phone-preview #app .conversation-item .conv-row.has-chat-mood>.pin-chat-button,.conversation-item .conv-row.has-chat-mood>.avatar,.conversation-item .conv-row.has-chat-mood>.row-copy,.conversation-item .conv-row.has-chat-mood>.row-time,.conversation-item .conv-row.has-chat-mood>.pin-chat-button{position:relative!important;z-index:2!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-copy,.conversation-item .conv-row.has-chat-mood .row-copy{min-width:0!important;overflow:hidden!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-top,html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-sub,.conversation-item .conv-row.has-chat-mood .row-top,.conversation-item .conv-row.has-chat-mood .row-sub{min-width:0!important}
@keyframes mood-row-aura{0%{background-position:0% 50%;transform:translateX(-2%)}100%{background-position:100% 50%;transform:translateX(2%)}}
.conv-row.has-chat-mood[data-chat-mood="happy"]{--row-mood-a:#11659b;--row-mood-b:#168fc3;--row-mood-c:#35a98b}.conv-row.has-chat-mood[data-chat-mood="love"]{--row-mood-a:#1167bf;--row-mood-b:#bc5caa;--row-mood-c:#ee80b9}.conv-row.has-chat-mood[data-chat-mood="angry"]{--row-mood-a:#741b29;--row-mood-b:#e43632;--row-mood-c:#ff762f}.conv-row.has-chat-mood[data-chat-mood="sad"]{--row-mood-a:#163b75;--row-mood-b:#2868a9;--row-mood-c:#368caa}.conv-row.has-chat-mood[data-chat-mood="surprised"]{--row-mood-a:#573295;--row-mood-b:#674dde;--row-mood-c:#2488c1}.conv-row.has-chat-mood[data-chat-mood="laugh"]{--row-mood-a:#986317;--row-mood-b:#df9228;--row-mood-c:#c84e55}.conv-row.has-chat-mood[data-chat-mood="party"]{--row-mood-a:#a12e8a;--row-mood-b:#d94d82;--row-mood-c:#e69237}.conv-row.has-chat-mood[data-chat-mood="thinking"]{--row-mood-a:#293e77;--row-mood-b:#5667ae;--row-mood-c:#387d9b}.conv-row.has-chat-mood[data-chat-mood="sleepy"]{--row-mood-a:#29265e;--row-mood-b:#51488d;--row-mood-c:#725d9d}.conv-row.has-chat-mood[data-chat-mood="fire"]{--row-mood-a:#8a3718;--row-mood-b:#e65b1e;--row-mood-c:#dc9a27}.conv-row.has-chat-mood[data-chat-mood="starstruck"]{--row-mood-a:#253f9b;--row-mood-b:#6651d1;--row-mood-c:#ba55bb}.conv-row.has-chat-mood[data-chat-mood="cool"]{--row-mood-a:#12485c;--row-mood-b:#147b91;--row-mood-c:#386c9d}.conv-row.has-chat-mood[data-chat-mood="crying"]{--row-mood-a:#20356e;--row-mood-b:#3762a4;--row-mood-c:#5885b9}.conv-row.has-chat-mood[data-chat-mood="hug"]{--row-mood-a:#235a91;--row-mood-b:#7563bb;--row-mood-c:#cf6ca0}.conv-row.has-chat-mood[data-chat-mood="scream"]{--row-mood-a:#4d287d;--row-mood-b:#a83f8e;--row-mood-c:#d94d59}.conv-row.has-chat-mood[data-chat-mood="eye-roll"]{--row-mood-a:#4e456f;--row-mood-b:#74718b;--row-mood-c:#a0786d}.conv-row.has-chat-mood[data-chat-mood="grimace"]{--row-mood-a:#6a551e;--row-mood-b:#9a7b2c;--row-mood-c:#65733b}.conv-row.has-chat-mood[data-chat-mood="angel"]{--row-mood-a:#487d9d;--row-mood-b:#73abc0;--row-mood-c:#8b91cc}.conv-row.has-chat-mood[data-chat-mood="devil"]{--row-mood-a:#4a183f;--row-mood-b:#a32e4b;--row-mood-c:#d35b32}.conv-row.has-chat-mood[data-chat-mood="sick"]{--row-mood-a:#3f6141;--row-mood-b:#849344;--row-mood-c:#987d35}.conv-row.has-chat-mood[data-chat-mood="cold"]{--row-mood-a:#146987;--row-mood-b:#21a5c7;--row-mood-c:#7398dd}.conv-row.has-chat-mood[data-chat-mood="hot"]{--row-mood-a:#883044;--row-mood-b:#db5b35;--row-mood-c:#e39a36}.conv-row.has-chat-mood[data-chat-mood="silly"]{--row-mood-a:#247349;--row-mood-b:#46a66e;--row-mood-c:#b7a834}.conv-row.has-chat-mood[data-chat-mood="salute"]{--row-mood-a:#275476;--row-mood-b:#268eaa;--row-mood-c:#58a783}.conv-row.has-chat-mood[data-chat-mood="mindblown"]{--row-mood-a:#25308a;--row-mood-b:#583fc1;--row-mood-c:#a241a5}.conv-row.has-chat-mood[data-chat-mood="pleading"]{--row-mood-a:#5465a3;--row-mood-b:#9b79c6;--row-mood-c:#d28bab}.conv-row.has-chat-mood[data-chat-mood="smirk"]{--row-mood-a:#315561;--row-mood-b:#567d80;--row-mood-c:#977b54}.conv-row.has-chat-mood[data-chat-mood="strong"]{--row-mood-a:#49387c;--row-mood-b:#7759af;--row-mood-c:#bd5f77}.conv-row.has-chat-mood[data-chat-mood="heartbreak"]{--row-mood-a:#334978;--row-mood-b:#565b89;--row-mood-c:#98546f}.conv-row.has-chat-mood[data-chat-mood="green-heart"]{--row-mood-a:#126455;--row-mood-b:#168a79;--row-mood-c:#67a768}
.conv-row.has-chat-mood .row-mood-visual{--mood-a:var(--row-mood-a,#3c63c9);--mood-b:var(--row-mood-b,#7551bb);--mood-glow:var(--row-mood-c,#7bd8ef)}
html.phone-preview #app .conversation-item .conv-row>.avatar,.conversation-item .conv-row>.avatar{outline:2px solid #69c8ff!important;outline-offset:1px!important;box-shadow:0 0 11px #376dff68,0 0 14px #8b3bff32!important;transition:outline-color .35s ease,box-shadow .45s ease!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood>.avatar,.conversation-item .conv-row.has-chat-mood>.avatar{outline-color:var(--row-mood-c,#69c8ff)!important;box-shadow:0 0 10px color-mix(in srgb,var(--row-mood-a,#376dff) 64%,transparent),0 0 15px color-mix(in srgb,var(--row-mood-b,#8b3bff) 54%,transparent)!important}
@media(max-width:767px){html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-face,.conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-face{font-size:29px!important}html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-effect,.conversation-item .conv-row.has-chat-mood .row-mood-visual .mood-effect{font-size:15px!important}}
/* Promo queda guardado y oculto del menú hasta que se reactive. */
html.phone-preview #app .mobile-bottom>#mobilePromotions,#app .mobile-bottom>#mobilePromotions,#app .sidebar>#promotionsNav{display:none!important}
.mobile-bottom{grid-template-columns:repeat(4,minmax(0,1fr))!important}
html.phone-preview #app .mobile-bottom{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media(max-width:767px){html.phone-preview #app.messages-only #conversationList{width:calc(100% + 10px)!important;margin-left:-5px!important;margin-right:-5px!important}html.phone-preview #app.messages-only #conversationList .conversation-item{width:100%!important;min-width:0!important;overflow:hidden!important}html.phone-preview #app.messages-only #conversationList .conversation-item>.conv-row{width:100%!important;min-width:0!important;padding-left:7px!important;padding-right:37px!important;border-radius:14px!important;border-bottom-color:transparent!important}}
.row-mood-visual .row-mood-sparkles{z-index:1!important;overflow:hidden!important}.row-mood-visual .row-mood-sparkles span{z-index:1!important;font-size:calc(var(--spark-size) + 5px)!important;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--spark-color) 82%,transparent))!important;animation-name:brisa-row-mood-cross!important;animation-timing-function:linear!important}.row-mood-visual .row-mood-sparkles::after{display:none!important;content:none!important}
/* Pagos conserva el desplazamiento táctil, pero oculta la barra lateral visible. */
#paymentsScreen{scrollbar-width:none!important;-ms-overflow-style:none!important;overscroll-behavior-y:contain!important;touch-action:pan-y!important}
#paymentsScreen::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
/* En las conversaciones se oculta la barra, conservando el gesto de desplazamiento. */
.chat #messages,.chat .messages{scrollbar-width:none!important;-ms-overflow-style:none!important;overscroll-behavior-y:contain!important;touch-action:pan-y!important}
.chat #messages::-webkit-scrollbar,.chat .messages::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual::after,.conversation-item .conv-row.has-chat-mood .row-mood-visual::after{content:""!important;position:absolute!important;z-index:1!important;inset:-35% -48%!important;pointer-events:none!important;background:linear-gradient(112deg,transparent 42%,#ffffff08 47%,#ffffff32 50%,#ffffff0c 53%,transparent 59%)!important;mix-blend-mode:screen!important;transform:translateX(-62%)!important;animation:row-mood-white-reflection 6.4s ease-in-out infinite!important;opacity:.88!important}
@keyframes row-mood-white-reflection{0%,12%{transform:translateX(-62%)}88%,100%{transform:translateX(62%)}}
@media(prefers-reduced-motion:reduce){html.phone-preview #app .conversation-item .conv-row.has-chat-mood .row-mood-visual::after,.conversation-item .conv-row.has-chat-mood .row-mood-visual::after{animation-duration:16s!important}}
@keyframes brisa-row-mood-cross{0%{left:-10%;opacity:0;transform:translateY(3px) rotate(-15deg) scale(.8)}12%{opacity:.78}54%{opacity:.6}88%{opacity:.76}100%{left:108%;opacity:0;transform:translateY(-3px) rotate(16deg) scale(1.04)}}

/* Fichas de Promo quedan dentro de la pantalla, translúcidas y sin mover el avatar de perfil. */
.promotion-kind-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important;min-width:0}
.promotion-kind-tabs button{min-width:0;padding-inline:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.promotion-card,.promotion-top-card,.promotion-empty,.promotion-admin{background:linear-gradient(145deg,#ffffff12,#ffffff05 58%,#55caff0c)!important;border-color:#9ddcff30!important;backdrop-filter:blur(18px) saturate(135%);-webkit-backdrop-filter:blur(18px) saturate(135%)}
.promotion-card-copy,.promotion-top-copy{min-width:0;overflow:hidden}
.promotion-card-copy strong,.promotion-top-copy strong{max-width:100%;overflow-wrap:anywhere}
.promotion-heading,.promotions-heading{min-width:0}
.promotions-heading h2{line-height:1.15}
.promotion-card-type,.promotion-top-label{max-width:calc(100% - 14px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:767px){.mobile-bottom{grid-template-columns:repeat(5,minmax(0,1fr))!important}.mobile-bottom>button{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px!important}.mobile-bottom>button .tab-icon{flex:none}.app.calls-only .mobile-title,.app.promotions-only .mobile-title{position:relative!important;z-index:2!important;margin-top:14px!important;line-height:1.08!important}.app.calls-only #callsScreen,.app.promotions-only #promotionsScreen{min-width:0;overflow-x:hidden}.promotion-grid{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}.promotion-card{min-width:0}}

/* Promociones de Brisa: mosaico móvil y fichas de artículo/video. */
#app.promotions-only #promotionsScreen{display:flex!important}#app.promotions-only #statusScreen,#app.promotions-only #callsScreen,#app.promotions-only #paymentsScreen{display:none!important}#app.promotions-only .mobile-search,#app.promotions-only .side-head,#app.promotions-only #conversationList,#app.promotions-only #peopleList,#app.promotions-only .contact-lookup,#app.promotions-only>.sidebar>.nav,#app.promotions-only .account{display:none!important}#promotionsNav.active{border-color:#56d9f5!important;color:#e6fbff!important;background:linear-gradient(100deg,#22578b77,#24578136)!important}
.promotions-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.promotions-heading>div{min-width:0}.promotion-create-button{flex:none;min-height:34px;padding:7px 12px;border-radius:12px;font-size:11px}.promotion-kind-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:9px 0 12px;padding:4px;border:1px solid #ffffff13;border-radius:14px;background:#ffffff07}.promotion-kind-tabs button{min-height:34px;border:1px solid transparent;border-radius:10px;background:transparent;color:#aeb9ce;font-size:11px;font-weight:650}.promotion-kind-tabs button.selected{border-color:#61c9f544;background:linear-gradient(110deg,#29578a77,#34427466);color:#edf9ff;box-shadow:inset 0 1px #ffffff15,0 3px 12px #24a8e51a}.promotion-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:10px;width:100%;min-width:0;max-height:100%;overflow:auto;padding:2px 1px 15px;scrollbar-width:thin}.promotion-card{position:relative;display:grid;grid-template-rows:auto 1fr;min-width:0;overflow:hidden;padding:0;border:1px solid #93b9ed20;border-radius:16px;background:linear-gradient(150deg,#131b30e8,#0e1423e8 78%);color:#edf4ff;text-align:left;box-shadow:0 8px 20px #0003,inset 0 1px #ffffff0d;transition:transform .18s,border-color .18s,box-shadow .18s}.promotion-card:active{transform:scale(.98)}.promotion-card:hover{border-color:#70cbf855;box-shadow:0 8px 22px #1e8cd026,inset 0 1px #ffffff15}.promotion-card-cover{display:block;width:100%;aspect-ratio:1.4;object-fit:cover;background:linear-gradient(140deg,#202b4d,#101624)}.promotion-card-type{position:absolute;top:7px;left:7px;padding:4px 7px;border:1px solid #ffffff2d;border-radius:20px;background:#080d1dcc;color:#e7f6ff;font-size:8px;font-weight:700;backdrop-filter:blur(10px)}.promotion-card-copy{display:grid;gap:3px;min-width:0;padding:8px}.promotion-card-copy strong{display:-webkit-box;overflow:hidden;color:#f1f6ff;font-size:11px;line-height:1.28;-webkit-line-clamp:2;-webkit-box-orient:vertical}.promotion-card-copy small{overflow:hidden;color:#aebbd0;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.promotion-card-copy .promotion-card-location{color:#d4e4fa;font-size:9px}.promotion-empty{grid-column:1/-1;display:grid;justify-items:center;align-content:center;gap:7px;min-height:180px;padding:20px;border:1px dashed #7da6d233;border-radius:18px;background:linear-gradient(145deg,#ffffff06,#4ab4f308);text-align:center}.promotion-empty>span{font-size:24px;color:#77dcff;text-shadow:0 0 18px #37c8ff66}.promotion-empty strong{font-size:13px}.promotion-empty p{max-width:270px;margin:0;color:#aab7cb;font-size:10px;line-height:1.5}.promotion-composer{max-height:min(88dvh,760px);overflow:auto}.promotion-composer form{display:grid;gap:10px}.promotion-composer form>label{display:grid;gap:5px;color:#dce8f7;font-size:11px}.promotion-composer input,.promotion-composer select,.promotion-composer textarea{width:100%;min-width:0;padding:10px 11px;border:1px solid #a2c8ee25;border-radius:11px;background:#0b1321d9;color:#eff6ff;font:inherit}.promotion-composer textarea{min-height:88px;resize:vertical}.promotion-price-fields{display:grid;grid-template-columns:minmax(0,1fr) 95px;gap:7px}.promotion-cover-picker{display:grid;gap:4px}.promotion-cover-picker input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.promotion-cover-preview{overflow:hidden;margin-top:-3px;border:1px solid #8edbff30;border-radius:13px}.promotion-cover-preview img{display:block;width:100%;max-height:180px;object-fit:cover}.promotion-detail{max-height:88dvh;overflow:auto}.promotion-detail header{align-items:flex-start}.promotion-detail-kind{display:inline-block;margin-bottom:4px;color:#7be0ff;font-size:9px;font-weight:800;letter-spacing:.1em}.promotion-detail header h2{margin:0}.promotion-detail-cover{display:block;width:100%;max-height:38dvh;margin:12px 0;border:1px solid #98cfff24;border-radius:15px;object-fit:cover;background:#10192a}.promotion-detail-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;color:#b9c9dc;font-size:10px}.promotion-detail-meta strong{width:100%;color:#a4ffd6;font-size:18px}.promotion-detail-description{margin:12px 0;color:#e1eaf5;font-size:12px;line-height:1.55;white-space:pre-wrap}.promotion-detail-actions{display:grid;gap:6px}.promotion-delete{color:#ffc0d0!important}
@media(max-width:767px){.mobile-bottom{grid-template-columns:repeat(6,minmax(0,1fr))!important}.mobile-bottom button{font-size:8px!important}.mobile-bottom button span{font-size:16px!important}.app.promotions-only .mobile-bottom{display:grid}.app.promotions-only .account{display:none}.app.promotions-only #promotionsScreen{display:flex!important;padding-bottom:8px}.promotion-grid{gap:8px}.promotion-card{border-radius:14px}.promotion-card-copy{padding:7px}.promotion-card-copy strong{font-size:10px}.promotion-create-button{padding:7px 10px;font-size:10px}.promotion-detail{width:min(100%,430px);padding:15px}.promotion-detail-cover{max-height:34dvh}}

/* Cola destacada, moderación y estados claros de publicaciones. */
.promotion-top{min-width:0;margin:3px 0 12px;padding:10px 0 4px;overflow:hidden;border-top:1px solid #ffffff12}.promotion-top-heading{display:flex;justify-content:space-between;gap:8px;padding:0 2px 8px;color:#ebf6ff;font-size:11px}.promotion-top-heading span{color:#9bb0cb;font-size:9px}.promotion-top-track{display:flex;gap:9px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x mandatory;scrollbar-width:thin}.promotion-top-card{position:relative;display:grid;flex:0 0 42%;grid-template-rows:auto 1fr;min-width:125px;max-width:190px;overflow:hidden;padding:0;border:1px solid #9d8cff45;border-radius:14px;background:linear-gradient(140deg,#18213beF,#0d1423);color:#f2f6ff;text-align:left;scroll-snap-align:start;box-shadow:0 5px 18px #6155df20}.promotion-top-cover{width:100%;aspect-ratio:1.65;object-fit:cover}.promotion-top-label{position:absolute;top:6px;left:6px;padding:3px 6px;border:1px solid #ffffff36;border-radius:10px;background:#11172cdd;color:#f3efff;font-size:8px;font-weight:750}.promotion-top-copy{display:grid;gap:3px;padding:7px}.promotion-top-copy strong{display:-webkit-box;overflow:hidden;font-size:10px;line-height:1.25;-webkit-line-clamp:2;-webkit-box-orient:vertical}.promotion-top-copy small{color:#b1c1d7;font-size:8px}.promotion-video-fields{display:grid;gap:7px;padding:10px 11px;border:1px solid #a99dff2c;border-radius:13px;background:linear-gradient(130deg,#6555a41b,#15b4e212)}.promotion-video-fields label{display:grid;gap:5px;color:#e4e9ff;font-size:11px}.promotion-plan-price{margin:0;color:#bcf5df;font-size:12px;font-weight:700}.promotion-video-fields>small,.promotion-product-notice{color:#aebed2;font-size:9px;line-height:1.5}.promotion-product-notice{margin:0;padding:9px 10px;border:1px solid #65d3a622;border-radius:11px;background:#39c88a0a}.promotion-admin{display:grid;gap:9px;margin:13px 0;padding:12px;border:1px solid #9acbff2b;border-radius:15px;background:linear-gradient(145deg,#162543d9,#111a2bd9);box-shadow:inset 0 1px #ffffff10}.promotion-admin-heading{display:grid;gap:4px}.promotion-admin-heading strong{font-size:12px;color:#f1f6ff}.promotion-admin-heading small,.promotion-admin>small{font-size:9px;line-height:1.45;color:#adbed4}.promotion-admin h3{margin:3px 0 0;color:#deebff;font-size:10px}.promotion-admin-prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.promotion-admin-prices label{display:grid;gap:4px;color:#c9d8eb;font-size:9px}.promotion-admin-prices input,.promotion-admin select{min-width:0;width:100%;padding:7px;border:1px solid #aac8ed2d;border-radius:8px;background:#0b1220;color:#f1f6ff;font:inherit}.promotion-admin>button{padding:8px}.promotion-review-row{display:grid;gap:5px;padding:9px;border:1px solid #ffffff12;border-radius:11px;background:#ffffff05}.promotion-review-row strong{font-size:10px}.promotion-review-row small{color:#aebdd0;font-size:9px;line-height:1.4}.promotion-review-actions{display:flex;gap:6px}.promotion-review-actions button{min-height:30px;padding:6px 8px;font-size:9px}.promotion-status-note{padding:9px;border:1px solid #d2b26a3d;border-radius:10px;background:#a1782014;color:#f0d99a;font-size:10px;line-height:1.45}.promotion-video-player{overflow:hidden;margin:10px 0;border:1px solid #92bfff2c;border-radius:14px;background:#090e18}.promotion-play-inline{width:100%;min-height:42px;border:0;background:linear-gradient(110deg,#263c6a,#3e2c74);color:#f4f6ff;font-size:11px;font-weight:700}.promotion-video-player iframe{display:block;width:100%;aspect-ratio:16/9;border:0}.promotion-detail-actions .promotion-open-link{display:flex;align-items:center;justify-content:center;gap:7px}.youtube-mark{display:grid;place-items:center;width:21px;height:15px;border-radius:5px;background:#ff2638;color:white;font-size:10px}
@media(max-width:767px){.promotion-top-card{flex-basis:46%;min-width:132px}.promotion-admin{margin:10px 0;padding:10px}.promotion-admin-prices input{padding:6px 4px;font-size:10px}.promotion-review-actions button{flex:1}.promotion-video-player iframe{min-height:190px}}

/* Búsqueda compacta de mensajes en la conversación activa. */
.chat-search-toggle{display:grid!important;place-items:center!important;flex:none!important;width:30px!important;height:30px!important;padding:0!important;border:1px solid #ffffff38!important;border-radius:50%!important;background:linear-gradient(145deg,#ffffff19,#ffffff08)!important;color:#effaff!important;box-shadow:inset 0 1px #ffffff14,0 0 12px #71d8ff16!important}
.chat-search-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-search-toggle:hover:not(:disabled),.chat-search-toggle[aria-expanded=true]{border-color:#b7ecffb0!important;background:linear-gradient(145deg,#ffffff2a,#ffffff10)!important;box-shadow:0 0 14px #6bcfff32,inset 0 1px #ffffff28!important}
.chat-search-toggle:disabled{opacity:.45;cursor:default}
.chat-search-panel{z-index:4;display:flex;align-items:center;gap:6px;min-width:0;padding:7px 10px;border-bottom:1px solid #77cfff2a;background:linear-gradient(120deg,#101b31f2,#15152af2);box-shadow:0 5px 16px #0002;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.chat-search-panel.hidden{display:none!important}
.chat-search-panel input{flex:1;min-width:0;height:34px;padding:0 11px;border:1px solid #8ccfff38;border-radius:18px;outline:none;background:#080f1dc9;color:#f3f8ff;font:inherit;font-size:12px}
.chat-search-panel input::placeholder{color:#9eafc5}.chat-search-panel input:focus{border-color:#8ae3ffad;box-shadow:0 0 0 2px #66caff18}
.chat-search-count{flex:none;min-width:60px;color:#b8c9df;font-size:10px;text-align:center;white-space:nowrap}
.chat-search-step,.chat-search-close{display:grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid #a2d9ff2e;border-radius:50%;background:#ffffff0a;color:#e8f6ff;font-size:15px;line-height:1}
.chat-search-step:disabled{opacity:.4;cursor:default}.chat-search-close{font-size:19px}
#messages .message.search-hit .bubble,#messages .message.search-hit .content-card,#messages .message.search-hit .call-event-card{outline:1px solid #8cddff8a;outline-offset:2px}
#messages .message.search-current .bubble,#messages .message.search-current .content-card,#messages .message.search-current .call-event-card{outline:2px solid #d9f6ff!important;outline-offset:3px!important;box-shadow:0 0 16px #68cfff4a,0 0 0 4px #ffffff0c!important}
@media(max-width:767px){.chat-search-panel{gap:4px;padding:6px 7px}.chat-search-panel input{height:32px;padding:0 9px;font-size:11px}.chat-search-count{min-width:50px;font-size:9px}.chat-search-step,.chat-search-close{width:26px;height:26px}}

/* La búsqueda vive en una esquina del área de conversación y deja libre la cabecera. */
.chat{position:relative}
.chat-search-float{position:absolute;top:calc(68px + env(safe-area-inset-top));right:12px;z-index:8;width:min(360px,calc(100% - 24px));display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;pointer-events:none}
.chat-search-float .chat-search-toggle,.chat-search-float .chat-search-panel{pointer-events:auto}
.chat-search-float .chat-search-toggle{width:28px!important;height:28px!important;opacity:.82}
.chat-search-float .chat-search-panel{width:100%;border:1px solid #77cfff2a;border-radius:16px}
@media(max-width:767px){.chat-search-float{top:calc(58px + env(safe-area-inset-top));right:10px;width:min(320px,calc(100% - 20px))}.chat-search-float .chat-search-toggle{width:25px!important;height:25px!important}.chat-search-float .chat-search-panel{border-radius:14px}}

.header-copy #contactName[role=button]{cursor:pointer;max-width:min(42vw,260px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-copy #contactName[role=button]:focus-visible{outline:1px solid #8bdcff;border-radius:5px;outline-offset:3px}
.contact-profile-modal{border:1px solid #79cfff38!important;background:linear-gradient(145deg,#0a1428d9,#11152bd9 52%,#1c1230dc)!important;box-shadow:0 22px 70px #0009,0 0 30px #508cff28,inset 0 1px #ffffff12!important;backdrop-filter:blur(28px) saturate(145%);-webkit-backdrop-filter:blur(28px) saturate(145%)}
.contact-profile-modal>header{background:linear-gradient(110deg,#101b32d9,#1b1530d9)!important;border-bottom:1px solid #83cfff20!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.contact-profile-modal .chat-expiry-settings,.contact-profile-modal .contact-profile-actions,.contact-profile-modal .clear-chat-action{border:1px solid #72cfff24!important;border-radius:17px!important;background:linear-gradient(135deg,#101b31a8,#2017319c)!important;box-shadow:inset 0 1px #ffffff0c,0 10px 26px #0002!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.contact-profile-modal .chat-expiry-settings p,.contact-profile-modal .clear-chat-action p{color:#b8c9df!important}.contact-profile-modal .chat-expiry-settings select{border:1px solid #79cfff3b!important;background:#091224bb!important;color:#eff6ff!important}.contact-profile-modal>h3{margin-top:16px;padding:12px 13px 0;border:1px solid #72cfff20;border-bottom:0;border-radius:16px 16px 0 0;background:#101a2ca8}.contact-profile-modal .profile-link-list{margin-top:0;padding:10px 12px 12px;border:1px solid #72cfff20;border-top:0;border-radius:0 0 16px 16px;background:#101a2ca8;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.contact-profile-modal .contact-profile-head{position:relative;isolation:isolate;overflow:hidden;padding:0 18px 15px;border:1px solid #ffffff16;border-radius:22px;background:linear-gradient(145deg,#ffffff0c,#ffffff04);box-shadow:inset 0 1px #ffffff12,0 12px 28px #0003}
.contact-profile-mood{position:absolute;z-index:-1;inset:0;overflow:hidden;border-radius:inherit;opacity:.82;background:linear-gradient(115deg,#115bb8,#3345a2 54%,#217ab3)}
.contact-profile-mood::after{content:"";position:absolute;inset:-40% -60%;background:linear-gradient(110deg,transparent 42%,#ffffff08 47%,#ffffff38 50%,#ffffff0a 54%,transparent 60%);mix-blend-mode:screen;animation:contact-profile-reflection 7s ease-in-out infinite;pointer-events:none}
.contact-profile-mood[data-mood="angry"]{background:linear-gradient(112deg,#741b29,#e43632 47%,#ff762f)}.contact-profile-mood[data-mood="love"]{background:linear-gradient(112deg,#1167bf,#416dd2 34%,#bc5caa 68%,#ee80b9)}.contact-profile-mood[data-mood="happy"]{background:linear-gradient(110deg,#11659b,#168fc3 50%,#35a98b)}
.contact-profile-mood-visual{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;opacity:.82!important;pointer-events:none!important}
.contact-profile-mood-visual::before{opacity:.28!important}.contact-profile-mood-visual .mood-face{left:78%!important;top:52%!important;font-size:45px!important}.contact-profile-mood-visual .mood-effect{font-size:22px!important}
.contact-profile-head .profile-preview{position:relative;z-index:1;margin-top:16px;border:2px solid #ffffffa8;box-shadow:0 0 0 4px #ffffff14,0 0 24px #76cfff55}
.contact-profile-head h2,.contact-profile-head .handle,.contact-profile-head p{position:relative;z-index:1;color:#f6f8ff;text-shadow:0 2px 12px #050a19a8}
.contact-profile-head p{max-width:100%;padding:7px 12px;border:1px solid #ffffff20;border-radius:14px;background:#080d1b65;backdrop-filter:blur(12px)}
.contact-identity-actions{display:grid;gap:7px;margin:0 0 14px;padding:13px;border:1px solid #73cfff25;border-radius:17px;background:linear-gradient(130deg,#ffffff0b,#ffffff04);box-shadow:inset 0 1px #ffffff0e}
.contact-identity-actions h3{margin:0 0 3px;color:#edf5ff;font-size:13px}.contact-alias-label{color:#c1cee0;font-size:11px}.contact-alias-row{display:flex;gap:7px;min-width:0}.contact-alias-row input{flex:1;min-width:0;height:38px;padding:0 11px;border:1px solid #7dcfff38;border-radius:12px;background:#091225a8;color:#f6f8ff;font:inherit;font-size:12px;outline:none}.contact-alias-row input:focus{border-color:#8ce4ff;box-shadow:0 0 0 3px #68cfff18}.contact-alias-row button,.contact-identity-buttons button{min-height:38px;padding:0 13px;border:1px solid #79d2ff48;border-radius:12px;background:linear-gradient(130deg,#1a75ba55,#713fba55);color:#f1f8ff;font:inherit;font-size:11px;font-weight:700}.contact-alias-note{color:#a8b9ce;font-size:10px}.contact-identity-buttons{display:flex;gap:8px}.contact-identity-buttons button{width:100%;text-align:left}
@keyframes contact-profile-reflection{0%,22%{transform:translateX(-45%);opacity:.28}60%,100%{transform:translateX(45%);opacity:.85}}
@media(max-width:767px){.contact-profile-modal{max-height:calc(100dvh - env(safe-area-inset-top) - 18px)!important;padding:16px!important}.contact-profile-modal .contact-profile-head{padding-inline:12px}.contact-profile-mood-visual .mood-face{font-size:38px!important}}

/* Oculta indicadores de desplazamiento en toda Brisa, sin desactivar scroll táctil o con rueda. */
html,body,*{scrollbar-width:none!important;-ms-overflow-style:none!important}
*::-webkit-scrollbar,*::-webkit-scrollbar-button{display:none!important;width:0!important;height:0!important;background:transparent!important}
#onlineVisibility:disabled{opacity:.48;cursor:not-allowed}

@media(max-width:767px){html.phone-preview #app.calls-only .mobile-title,html.phone-preview #app.promotions-only .mobile-title{margin-top:14px!important;line-height:1.08!important}.app.calls-only .status-heading,.app.promotions-only .promotions-heading{position:relative;z-index:1;align-items:center;min-width:0;padding-top:7px}.app.calls-only .status-heading h2,.app.promotions-only .promotions-heading h2{position:relative;margin:0;line-height:1.12;overflow-wrap:anywhere}.app.promotions-only .promotions-heading>div{min-width:0;max-width:calc(100% - 94px)}.app.promotions-only .promotion-create-button{flex:none;max-width:90px;white-space:nowrap}}

/* Creación de grupos */
.create-group-button{display:flex;align-items:center;gap:9px;width:calc(100% - 18px);margin:6px 9px 10px;padding:10px 13px;border:1px solid color-mix(in srgb,var(--accent,#56cfff) 36%,transparent);border-radius:14px;background:linear-gradient(110deg,color-mix(in srgb,var(--accent,#56cfff) 15%,transparent),rgba(255,255,255,.035));color:var(--text,#f5f4ff);font:inherit;font-weight:650;text-align:left;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}.create-group-button:hover{background:color-mix(in srgb,var(--accent,#56cfff) 20%,transparent);border-color:color-mix(in srgb,var(--accent,#56cfff) 60%,transparent);transform:translateY(-1px)}.create-group-button>span:first-child{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:color-mix(in srgb,var(--accent,#56cfff) 22%,transparent);color:var(--accent,#56cfff);font-size:20px;line-height:1}.group-create-overlay{z-index:1200}.group-create-modal{width:min(460px,calc(100vw - 30px));max-height:min(760px,calc(100dvh - 32px));overflow:auto}.group-create-modal header{position:sticky;top:0;z-index:2}.group-create-modal form{display:grid;gap:14px}.group-create-modal form>label{display:grid;gap:7px;color:var(--muted,#b9b7cb)}.group-create-modal input.group-name-input{width:100%;box-sizing:border-box;border:1px solid rgba(193,185,255,.2);border-radius:13px;padding:12px 14px;background:rgba(8,12,27,.55);color:var(--text,#f5f4ff);font:inherit;outline:none}.group-create-modal input.group-name-input:focus{border-color:var(--accent,#56cfff);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#56cfff) 16%,transparent)}.group-members-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.group-members-heading small{color:var(--muted,#b9b7cb)}.group-contact-options{display:grid;gap:5px;max-height:min(42vh,330px);overflow:auto;padding:4px 2px;overscroll-behavior:contain}.group-contact-option{display:flex;align-items:center;gap:11px;padding:9px 10px;border:1px solid transparent;border-radius:13px;background:rgba(255,255,255,.035);cursor:pointer}.group-contact-option:has(input:checked){border-color:color-mix(in srgb,var(--accent,#56cfff) 45%,transparent);background:color-mix(in srgb,var(--accent,#56cfff) 12%,transparent)}.group-contact-option input{accent-color:var(--accent,#56cfff);width:18px;height:18px;margin:0 2px 0 0}.group-contact-option .avatar{width:39px;height:39px;flex:none}.group-contact-copy{display:grid;gap:2px;min-width:0}.group-contact-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-contact-copy small{color:var(--muted,#b9b7cb)}.group-create-error:empty{display:none}
.app:not(.contacts-only) .create-group-button{display:none}
@media(max-width:767px){.group-create-modal{width:calc(100vw - 24px);max-height:calc(100dvh - env(safe-area-inset-top) - 24px);padding:16px}.group-contact-options{max-height:40dvh}.create-group-button{margin-top:4px}}

/* El acceso para publicar estado queda como un pequeño botón redondo. */
#statusList .own-status-group .status-add-mark{box-sizing:border-box!important;width:34px!important;min-width:34px!important;max-width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;border:1px solid #72d5ff90!important;border-radius:50%!important;background:linear-gradient(135deg,#5544ed,#168ff5)!important;color:#fff!important;font-size:20px!important;font-weight:500!important;line-height:1!important;letter-spacing:0!important;box-shadow:0 3px 12px #167ef944!important}

/* Inicio de configuración y apartados independientes. */
#profileModal .profile-modal{padding:20px}.settings-home-intro{margin:3px 0 12px;color:#bdc9dd;font-size:12px}.settings-home-list{display:grid;gap:8px}.settings-home-row{display:flex;align-items:center;gap:12px;width:100%;min-width:0;padding:12px;border:1px solid #9abaff24;border-radius:15px;background:linear-gradient(135deg,#ffffff0b,#8fbaff08);color:#f5f7ff;text-align:left;cursor:pointer;transition:background .18s,border-color .18s,transform .18s}.settings-home-row:hover,.settings-home-row:focus-visible{border-color:#83cfff75;background:linear-gradient(135deg,#63bbff18,#ad8dff12);outline:none;transform:translateY(-1px)}.settings-home-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border:1px solid #8acbff32;border-radius:13px;background:linear-gradient(145deg,#398add30,#8c5cf329);color:#b7e5ff;font-size:20px}.settings-home-copy{display:grid;gap:3px;min-width:0;flex:1}.settings-home-copy strong{font-size:13px}.settings-home-copy small{color:#bdc9dd;font-size:10px;line-height:1.35}.settings-home-arrow{color:#a9c7e7;font-size:24px}.settings-back{width:32px;height:32px;margin-right:8px;border:0;border-radius:50%;background:#ffffff0a;color:#d7e7ff;font-size:26px;line-height:1;cursor:pointer}.settings-pane{display:grid;gap:12px;padding:6px 0 12px}.settings-profile-details{display:grid;gap:10px}.settings-privacy-controls{display:grid;gap:10px}.settings-pane .privacy-presence-settings{margin-top:0}.settings-pane .profile-link-editor{margin-top:4px}.settings-pane .security-settings{margin-top:0}.settings-pane>.primary.wide{margin-top:5px}
@media(max-width:650px){#profileModal .profile-modal{padding:17px!important}.settings-home-row{padding:10px}.settings-home-icon{width:36px;height:36px}.settings-pane{padding-top:3px}}

/* Preferencias de tonos y destello breve en la línea inferior del chat. */
.sound-choice{display:grid;grid-template-columns:minmax(0,1fr) minmax(115px,145px) auto;align-items:center;gap:9px;padding:12px;border:1px solid #9abaff28;border-radius:15px;background:linear-gradient(135deg,#ffffff0d,#6eaaff09);color:#f5f7ff}
.sound-choice>span{display:grid;gap:4px;min-width:0}.sound-choice strong{font-size:12px}.sound-choice small,.sound-settings-note{color:#bdc9dd;font-size:10px;line-height:1.4}
.sound-choice select{width:100%;min-width:0;height:36px;padding:0 9px;border:1px solid #8ccfff38;border-radius:11px;background:#101a2bd9;color:#eff7ff;font:inherit;font-size:11px}
.sound-preview{min-height:34px;padding:0 10px!important;white-space:nowrap;font-size:10px!important}
.sound-settings-note{margin-top:-4px}
@media(max-width:520px){.sound-choice{grid-template-columns:minmax(0,1fr) auto;gap:7px}.sound-choice>span{grid-column:1/-1}.sound-choice select{grid-column:1}.sound-choice .sound-preview{grid-column:2;grid-row:2}}
.chat-search-float{top:78px}
@media(max-width:767px){.chat-search-float{top:calc(88px + env(safe-area-inset-top))!important;right:10px!important;width:min(320px,calc(100% - 20px))!important}.chat-search-float .chat-search-toggle{width:25px!important;height:25px!important}}
@keyframes brisa-header-magic-flash{0%,72%,100%{opacity:.62;filter:brightness(1) drop-shadow(0 0 1px color-mix(in srgb,var(--brisa-accent,#61cfff) 45%,transparent))}78%{opacity:1;filter:brightness(1.65) drop-shadow(0 0 7px color-mix(in srgb,var(--brisa-accent,#61cfff) 85%,transparent))}84%{opacity:.72;filter:brightness(1.12) drop-shadow(0 0 3px color-mix(in srgb,var(--brisa-accent-2,#8c72ff) 70%,transparent))}}
.chat-header::after{background:linear-gradient(90deg,transparent,var(--brisa-accent,#61cfff),#fff,var(--brisa-accent-2,#8c72ff),transparent)!important;background-size:220% 100%!important;animation:brisa-header-line 8s linear infinite,brisa-header-magic-flash 4.6s ease-in-out infinite!important}
/* Suaviza la luz que cada ánimo proyecta debajo de la cabecera. */
html body .chat-header{box-shadow:0 2px 6px #05081738,inset 0 1px #ffffff12!important}
html body .chat-header[class*="mood-header"]{box-shadow:0 2px 7px #05081742,inset 0 1px #ffffff14!important}
.chat-header.mood-header-extra{box-shadow:0 2px 7px #05081742,inset 0 1px #ffffff14!important}
.animation-choice{display:grid;grid-template-columns:minmax(0,1fr) minmax(135px,185px);align-items:center;gap:12px;padding:12px;border:1px solid #9abaff28;border-radius:15px;background:linear-gradient(135deg,#ffffff0d,#6eaaff09);color:#f5f7ff}
.animation-choice>span{display:grid;gap:4px;min-width:0}.animation-choice strong{font-size:12px}.animation-choice small{color:#bdc9dd;font-size:10px;line-height:1.4}.animation-choice select{width:100%;min-width:0;height:38px;padding:0 10px;border:1px solid #8ccfff38;border-radius:11px;background:#101a2bd9;color:#eff7ff;font:inherit;font-size:11px}
@media(max-width:520px){.animation-choice{grid-template-columns:minmax(0,1fr) minmax(115px,145px);gap:8px;padding:10px}.animation-choice strong{font-size:11px}}
.mobile-bottom{isolation:isolate}
.mobile-bottom-mood-layer{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;border-radius:inherit;isolation:isolate;contain:layout paint;background:linear-gradient(112deg,color-mix(in srgb,var(--mood-a,#39cfff) 13%,transparent),transparent 44%,color-mix(in srgb,var(--mood-b,#8875ff) 13%,transparent))}
.mobile-bottom-mood-layer::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,var(--mood-glow,#71dfff40),transparent 72%);opacity:.34;animation:mood-aura-in .45s ease-out both}
.mobile-bottom-mood-layer .mood-face{left:50%;top:48%;z-index:1;font-size:23px;opacity:.4;filter:drop-shadow(0 1px 4px #05091b88)}
.mobile-bottom-mood-layer .mood-effect{z-index:1;font-size:12px;opacity:.62;filter:drop-shadow(0 1px 3px #040718aa)}
.mobile-bottom-mood-layer .mood-effect-1{left:19%;top:40%}.mobile-bottom-mood-layer .mood-effect-2{left:81%;top:40%}.mobile-bottom-mood-layer .mood-effect-3{left:34%;top:74%}.mobile-bottom-mood-layer .mood-effect-4{left:66%;top:74%}
.mobile-bottom>button{position:relative;z-index:2}
.chat-preference-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px;border:1px solid #9abaff28;border-radius:15px;background:linear-gradient(135deg,#ffffff0d,#6eaaff09);color:#f3f6ff;cursor:pointer}
.chat-preference-row>span{display:grid;gap:4px;min-width:0}.chat-preference-row strong,.chat-preference-hint strong{font-size:11px}.chat-preference-row small,.chat-preference-hint span{color:#bdc9dd;font-size:10px;line-height:1.45}
.chat-preference-row input{width:19px;height:19px;flex:none;accent-color:#5ebaff}
.chat-preference-hint{display:grid;gap:4px;padding:12px 13px;border:1px solid #9abaff20;border-radius:14px;background:#ffffff08}
/* Animación Brisa predeterminada para conversaciones sin un ánimo elegido. */
@keyframes brisa-default-face{0%,100%{transform:translate(-50%,-50%) rotate(-4deg) scale(.96)}50%{transform:translate(-50%,-57%) rotate(4deg) scale(1.08)}}
@keyframes brisa-default-aura{0%,100%{opacity:.16;transform:scale(.96)}50%{opacity:.42;transform:scale(1.04)}}
@keyframes brisa-default-drift-1{0%,100%{transform:translate(-50%,-50%) translateY(5px) rotate(-10deg) scale(.72);opacity:.28}50%{transform:translate(-50%,-50%) translateY(-10px) rotate(12deg) scale(1.1);opacity:.98}}
@keyframes brisa-default-drift-2{0%,100%{transform:translate(-50%,-50%) translateY(4px) rotate(10deg) scale(.78);opacity:.3}50%{transform:translate(-50%,-50%) translateY(-9px) rotate(-14deg) scale(1.08);opacity:.95}}
@keyframes brisa-default-drift-3{0%,100%{transform:translate(-50%,-50%) translateY(6px) rotate(-8deg) scale(.76);opacity:.25}50%{transform:translate(-50%,-50%) translateY(-8px) rotate(15deg) scale(1.12);opacity:1}}
@keyframes brisa-default-drift-4{0%,100%{transform:translate(-50%,-50%) translateY(4px) rotate(12deg) scale(.72);opacity:.3}50%{transform:translate(-50%,-50%) translateY(-11px) rotate(-12deg) scale(1.06);opacity:.96}}
.mood-brisa-default .mood-face{animation:brisa-default-face 3s ease-in-out infinite!important}
.mood-brisa-default::before{animation:brisa-default-aura 5.2s ease-in-out infinite!important}
.mood-brisa-default .mood-effect-1{animation:brisa-default-drift-1 2.5s ease-in-out -.2s infinite!important}
.mood-brisa-default .mood-effect-2{animation:brisa-default-drift-2 2.9s ease-in-out -.8s infinite!important}
.mood-brisa-default .mood-effect-3{animation:brisa-default-drift-3 3.2s ease-in-out -1.1s infinite!important}
.mood-brisa-default .mood-effect-4{animation:brisa-default-drift-4 2.7s ease-in-out -1.6s infinite!important}
.row-mood-visual.mood-brisa-default .mood-effect-1{left:68%!important;top:22%!important}
.row-mood-visual.mood-brisa-default .mood-effect-2{left:91%!important;top:22%!important}
.row-mood-visual.mood-brisa-default .mood-effect-3{left:68%!important;top:78%!important}
.row-mood-visual.mood-brisa-default .mood-effect-4{left:91%!important;top:78%!important}
/* La barra usa el cristal azul-violeta del encabezado; la pestaña activa queda translúcida. */
html #app .mobile-bottom,html.phone-preview #app .mobile-bottom{border:1px solid #79d9ff9c!important;background:linear-gradient(112deg,rgba(15,79,166,.78),rgba(54,53,151,.76) 52%,rgba(5,114,158,.78))!important;background-size:220% 220%!important;animation:brisa-header-flow 18s ease-in-out infinite!important;box-shadow:0 8px 24px #0006,0 0 16px #388dff35,0 0 22px #7665ff24,inset 0 1px #ffffff35!important;backdrop-filter:blur(12px) saturate(175%)!important;-webkit-backdrop-filter:blur(12px) saturate(175%)!important}
html #app .mobile-bottom>button,html.phone-preview #app .mobile-bottom>button{border:1px solid transparent!important;border-radius:24px!important;background:transparent!important;color:#d4e9ff!important;transition:color .25s ease,border-color .3s ease,background .3s ease,box-shadow .3s ease,transform .25s ease!important}
html #app .mobile-bottom>button.selected,html.phone-preview #app .mobile-bottom>button.selected{border-color:#b5eaff90!important;background:linear-gradient(125deg,#ffffff20,#71dcff20 48%,#a17cff20)!important;color:#fff!important;box-shadow:inset 0 1px #ffffff45,0 0 12px #57caff44,0 0 19px #8b71ff30!important;backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important;transform:translateY(-1px)!important}
html #app .mobile-bottom>button.selected .tab-icon,html #app .mobile-bottom>button.selected span,html.phone-preview #app .mobile-bottom>button.selected .tab-icon,html.phone-preview #app .mobile-bottom>button.selected span{color:#f4fbff!important;text-shadow:0 0 9px #67d9ff9c,0 0 14px #9e7bff55!important;filter:drop-shadow(0 0 4px #6dcfff66)!important}
html #app .mobile-bottom>button.selected::before,html.phone-preview #app .mobile-bottom>button.selected::before{inset:1px 3px!important;border-color:#8ce1ff48!important;background:radial-gradient(ellipse at 50% 45%,#71d7ff26,#8c70ff10 56%,transparent 78%)!important;filter:blur(4px)!important;opacity:1!important;transform:scale(1)!important}
html #app .mobile-bottom>button.selected::after,html.phone-preview #app .mobile-bottom>button.selected::after{content:""!important;left:38%!important;right:38%!important;bottom:0!important;height:2px!important;border-radius:50%!important;background:linear-gradient(90deg,transparent,#a5f0ff,#d2b1ff,transparent)!important;box-shadow:0 0 8px #77dfffaa!important;filter:blur(.4px)!important;opacity:.88!important}
@media(prefers-reduced-motion:reduce){html #app .mobile-bottom,html.phone-preview #app .mobile-bottom{animation:none!important}}
/* El ánimo de navegación lleva su propia paleta, independiente de cada conversación. */
html #app .mobile-bottom[data-nav-mood],html.phone-preview #app .mobile-bottom[data-nav-mood]{background:linear-gradient(112deg,color-mix(in srgb,var(--nav-mood-a) 76%,#10182b),color-mix(in srgb,var(--nav-mood-b) 72%,#141329) 52%,color-mix(in srgb,var(--nav-mood-c) 74%,#071623))!important;border-color:color-mix(in srgb,var(--nav-mood-c) 66%,#ffffff55)!important;box-shadow:0 8px 24px #0006,0 0 19px color-mix(in srgb,var(--nav-mood-c) 25%,transparent),inset 0 1px #ffffff42!important}
.mobile-bottom[data-nav-mood] .mobile-bottom-mood-layer{background:linear-gradient(112deg,color-mix(in srgb,var(--mood-a) 38%,transparent),transparent 42%,color-mix(in srgb,var(--mood-b) 34%,transparent))}
.mobile-bottom[data-nav-mood] .mobile-bottom-mood-layer::before{background:radial-gradient(ellipse at 50% 50%,var(--mood-glow),transparent 72%);opacity:.5}
/* Barra nítida: paleta completa y sin desenfoque que apague los colores. */
html #app .mobile-bottom,html.phone-preview #app .mobile-bottom{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html #app .mobile-bottom[data-nav-mood],html.phone-preview #app .mobile-bottom[data-nav-mood]{background:linear-gradient(112deg,var(--nav-mood-a),var(--nav-mood-b) 52%,var(--nav-mood-c))!important;background-size:220% 220%!important;border-color:color-mix(in srgb,var(--nav-mood-c) 78%,white)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 7px 22px #0005,0 0 15px color-mix(in srgb,var(--nav-mood-c) 34%,transparent),inset 0 1px #ffffff65!important}
html #app .mobile-bottom>button.selected,html.phone-preview #app .mobile-bottom>button.selected,html #app .mobile-bottom[data-nav-mood]>button.selected,html.phone-preview #app .mobile-bottom[data-nav-mood]>button.selected{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:linear-gradient(135deg,#ffffff32,#ffffff14)!important;border-color:#ffffffbd!important;box-shadow:inset 0 1px #ffffff8c,0 0 11px #ffffff42!important}
html #app .mobile-bottom>button.selected .tab-icon,html #app .mobile-bottom>button.selected span,html.phone-preview #app .mobile-bottom>button.selected .tab-icon,html.phone-preview #app .mobile-bottom>button.selected span{filter:none!important;text-shadow:0 1px 2px #0710208c!important}
html #app .mobile-bottom>button.selected::before,html.phone-preview #app .mobile-bottom>button.selected::before{inset:2px!important;border:1px solid #ffffff40!important;border-radius:inherit!important;background:#ffffff0d!important;filter:none!important;box-shadow:none!important}
html #app .mobile-bottom>button.selected::after,html.phone-preview #app .mobile-bottom>button.selected::after{filter:none!important}
.mobile-bottom[data-nav-mood] .mobile-bottom-mood-layer{background:linear-gradient(112deg,color-mix(in srgb,var(--mood-a) 17%,transparent),transparent 44%,color-mix(in srgb,var(--mood-b) 19%,transparent))}
.mobile-bottom[data-nav-mood] .mobile-bottom-mood-layer::before{opacity:.24}
html #messages .message.mine .bubble{background:linear-gradient(135deg,var(--brisa-message-out-a),var(--brisa-message-out-b))!important;border-color:var(--brisa-message-out-border)!important;color:var(--brisa-message-out-ink)!important}
html #messages .message:not(.mine) .bubble{background:linear-gradient(135deg,var(--brisa-message-in-a),var(--brisa-message-in-b))!important;border-color:var(--brisa-message-in-border)!important;color:var(--brisa-message-in-ink)!important}
.message-color-group>small{font-size:9px;color:#b7c2d3;line-height:1.4}
.brisa-call-mark{position:relative;isolation:isolate;overflow:visible!important;display:grid;place-items:center;width:64px;height:64px;border:1px solid #70dcff72;border-radius:22px;background:linear-gradient(145deg,#121b3c,#102d4b 60%,#173044)!important;box-shadow:0 0 26px #39bfff35,inset 0 1px #ffffff33;color:#b7f2ff!important}
.brisa-call-mark svg{width:42px;height:42px;overflow:visible;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px #54d8ff88)}
.brisa-call-mark .call-orbit{transform-origin:32px 32px;stroke:#62dfff75;stroke-width:1.1;stroke-dasharray:3 8;animation:brisa-call-orbit 8s linear infinite}
.brisa-call-mark .call-orbit-two{stroke:#ad91ff88;stroke-dasharray:2 10;animation-direction:reverse;animation-duration:11s}
.brisa-call-mark .call-handset{fill:#a7efff28;transform-origin:32px 32px;animation:brisa-call-pulse 2.8s ease-in-out infinite}
.brisa-call-mark .call-signal{stroke:#adf4ff;stroke-width:2;stroke-dasharray:15 24;animation:brisa-call-signal 2.2s ease-in-out infinite}
@keyframes brisa-call-orbit{to{transform:rotate(360deg)}}
@keyframes brisa-call-pulse{0%,72%,100%{transform:rotate(0) scale(1)}78%{transform:rotate(-7deg) scale(1.07)}84%{transform:rotate(6deg) scale(1.03)}90%{transform:rotate(-3deg) scale(1)}}
@keyframes brisa-call-signal{0%,100%{opacity:.35;stroke-dashoffset:0}50%{opacity:1;stroke-dashoffset:-18}}
@media(prefers-reduced-motion:reduce){.brisa-call-mark *{animation:none!important}}
/* El teléfono cobra vida al abrir la pestaña Llamadas. */
#mobileCalls .tab-icon{position:relative;overflow:visible}
#mobileCalls.selected .tab-icon svg{transform-origin:48% 54%;animation:brisa-call-receiver 2.7s ease-in-out infinite!important}
#mobileCalls.selected .tab-icon::after{content:"";position:absolute;inset:-4px;border:1px solid #8fe7ff7a;border-radius:50%;pointer-events:none;opacity:0;animation:brisa-call-wave 2.7s ease-out infinite}
@keyframes brisa-call-receiver{0%,78%,100%{transform:rotate(0) scale(1)}82%{transform:rotate(-9deg) scale(1.04)}86%{transform:rotate(8deg) scale(1.06)}90%{transform:rotate(-6deg) scale(1.03)}94%{transform:rotate(4deg) scale(1)}}
@keyframes brisa-call-wave{0%,76%{transform:scale(.7);opacity:0}82%{opacity:.65}100%{transform:scale(1.55);opacity:0}}
@media(prefers-reduced-motion:reduce){#mobileCalls.selected .tab-icon svg,#mobileCalls.selected .tab-icon::after{animation-duration:6s!important}}

.first-profile-card{width:min(420px,calc(100vw - 30px));max-height:calc(100dvh - 30px);overflow:auto}.first-profile-photo{display:grid;justify-items:center;gap:8px;margin:4px 0 12px;cursor:pointer;color:#ece6ff;text-align:center}.first-profile-photo>span:last-child{font-size:12px}.first-profile-photo small{color:#a89db9;font-size:10px}.first-profile-photo-frame{position:relative;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;overflow:hidden;border:2px solid #72dfff;background:linear-gradient(140deg,#31204c,#0d253c);box-shadow:0 0 18px #2daaff45;color:#c9f4ff;font-size:30px}.first-profile-photo-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.first-profile-photo-frame b{font-weight:400}

/* Acceso unificado: selector internacional de país y teléfono */
.phone-field-row{display:flex;gap:7px;align-items:stretch;width:100%}.phone-field-row .country-flag-display{flex:0 0 29px;width:29px;height:42px;display:flex;align-items:center;justify-content:center;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden}.phone-field-row .country-flag-display img{display:block;width:25px;height:17px;object-fit:cover;border-radius:2px;box-shadow:0 1px 3px #0008}.phone-field-row .country-flag-display.flag-fallback{font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif;font-size:15px;line-height:1}.phone-field-row select{flex:0 0 68px;width:68px;min-width:64px;max-width:68px;height:42px;padding:0 8px;border:1px solid #3a3148;border-radius:10px;background:#100d17;color:#f5efff;font:inherit;font-size:12px;outline:none}.phone-field-row input{flex:1;min-width:0}.phone-field-row select:focus{border-color:#36bfff;box-shadow:0 0 0 3px #1a85ff20}.auth-card #scanDeviceQRLogin{margin-top:14px}.auth-card #showDeviceLink{text-align:center;display:block;width:100%;margin-top:9px}
@media(max-width:420px){.phone-field-row{gap:5px}.phone-field-row .country-flag-display{flex-basis:25px;width:25px;height:42px}.phone-field-row .country-flag-display img{width:23px;height:16px}.phone-field-row .country-flag-display.flag-fallback{font-size:14px}.phone-field-row select{flex-basis:62px;width:62px;min-width:58px;max-width:62px;padding:0 5px;font-size:12px}}

/* Animated Brisa glass treatment for the sign-in actions. */
.auth-card .auth-motion-button{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;border:1px solid #73d8ff78;border-radius:14px;background:linear-gradient(112deg,#114b9288,#4d39a866 52%,#087a9b88);background-size:220% 220%;color:#f5faff;font-size:12px;font-weight:700;box-shadow:0 6px 20px #080f264d,0 0 15px #3aaeff24,inset 0 1px #ffffff30;backdrop-filter:blur(12px) saturate(160%);-webkit-backdrop-filter:blur(12px) saturate(160%);animation:brisa-header-flow 18s ease-in-out infinite;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.auth-card .auth-motion-button::before{content:"";position:absolute;z-index:-1;top:-40%;bottom:-40%;left:-45%;width:34%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,#ffffff22,transparent);animation:auth-button-glint 6.4s ease-in-out infinite;pointer-events:none}
.auth-card .auth-motion-button>span[aria-hidden="true"]{font-size:17px;line-height:1;color:#b9efff;text-shadow:0 0 11px #62ccff77}
.auth-card .auth-motion-button>span:not([aria-hidden]){font-size:12px;line-height:1.25;color:inherit;text-shadow:none}
.auth-card .auth-motion-button:hover:not(:disabled){transform:translateY(-1px);border-color:#9ce8ffb5;box-shadow:0 8px 24px #080f265c,0 0 19px #3aaeff39,inset 0 1px #ffffff48}
.auth-card .auth-motion-button:disabled{opacity:.58;cursor:wait;animation-play-state:paused}
.auth-card .auth-qr-button{margin-top:14px;background:linear-gradient(112deg,#16467488,#293c8588 52%,#15385899)}
.auth-card .auth-sms-button{margin-top:4px}
.auth-card .auth-qr-help{display:block;margin:6px 4px 0;text-align:center;color:#a99fbd;font-size:9px;line-height:1.45}
@keyframes auth-button-glint{0%,28%{left:-45%;opacity:0}38%{opacity:.9}58%{left:120%;opacity:0}100%{left:120%;opacity:0}}
@media(prefers-reduced-motion:reduce){.auth-card .auth-motion-button{animation:none}.auth-card .auth-motion-button::before{animation:none}}

/* Searchable country selector with compact graphic flags. */
.phone-field-row{position:relative;z-index:5}
.phone-field-row .country-code-button{flex:0 0 70px;width:70px;min-width:65px;height:42px;display:flex;align-items:center;justify-content:center;gap:5px;padding:0 6px;border:1px solid #3a3148;border-radius:10px;background:#100d17;color:#f5efff;font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.phone-field-row .country-code-button:focus-visible{outline:2px solid #36bfff;outline-offset:2px}
.country-code-chevron{font-size:10px;color:#aab7d1}
.phone-field-row .country-code-native{display:none!important}
.country-picker-popover{position:absolute;z-index:120;top:calc(100% + 7px);left:0;width:min(300px,calc(100vw - 54px));max-height:min(360px,52vh);padding:9px;border:1px solid #6a58ad88;border-radius:17px;background:linear-gradient(145deg,#11172bf2,#171127f5);box-shadow:0 18px 45px #0009,0 0 24px #4c7fff20;backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);overflow:hidden}
.country-picker-popover[hidden]{display:none}
.country-search-label{display:flex;align-items:center;gap:8px;height:39px;padding:0 11px;border:1px solid #555078;border-radius:11px;background:#ffffff0a;color:#aab7d1}
.country-search-label input{width:100%;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;color:#f5efff;font:inherit;font-size:13px}
.country-search-label input::placeholder{color:#a8a5ba}
.country-options{max-height:min(285px,42vh);margin-top:7px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#7464ad66 transparent}
.country-option{width:100%;min-height:40px;display:flex;align-items:center;gap:10px;padding:6px 9px;border:0;border-radius:9px;background:transparent;color:#f4f2ff;text-align:left;font:inherit;font-size:13px;cursor:pointer}
.country-option:hover,.country-option:focus-visible,.country-option[aria-selected="true"]{outline:0;background:linear-gradient(100deg,#24619b66,#753bdd55)}
.country-option img{flex:0 0 24px;width:24px;height:16px;object-fit:cover;border-radius:2px;box-shadow:0 1px 3px #0008}
.country-option-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.country-option-dial{color:#c0c4d8;font-variant-numeric:tabular-nums}
.country-options-empty{margin:0;padding:15px 10px;color:#bcb8cb;font-size:13px;text-align:center}
@media(max-width:420px){.phone-field-row .country-code-button{flex-basis:64px;width:64px;min-width:60px}.country-picker-popover{width:min(290px,calc(100vw - 48px))}}
.country-search-label svg{flex:0 0 15px;width:15px;height:15px;color:#aab7d1}


/* Onboarding: perfil con el ambiente gráfico Brisa completo. */
.first-profile-card{position:relative;isolation:isolate;overflow:auto;width:min(420px,calc(100vw - 30px));max-height:calc(100dvh - 30px);border:1px solid #4a3a60;background:linear-gradient(145deg,#15111feb,#0b101aec);color:#f5efff;backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);box-shadow:0 22px 70px #0009,0 0 34px #248cff22}
.first-profile-card>header,.first-profile-card>form{position:relative;z-index:1}
.first-profile-card>header{text-align:center;padding:35px 8px 16px}
.first-profile-card>header h2{margin:0 0 6px;color:#f4f0ff;font:800 23px Manrope,sans-serif;letter-spacing:-.5px}
.first-profile-card>header p{margin:0;color:#b9b0c9;font-size:12px;line-height:1.5}
.first-profile-mood-graphic.chat-header-mood-layer{inset:0 0 auto!important;height:175px!important;z-index:0!important;border-radius:inherit;opacity:.66}
.first-profile-mood-graphic.chat-header-mood-layer::before{background:radial-gradient(ellipse at 50% 24%,#62d9f455,transparent 72%),linear-gradient(112deg,#176eb84a,#3769d646,#62d9f42b);opacity:.8}
.first-profile-card .mood-face{font-size:clamp(42px,10vw,58px);filter:drop-shadow(0 0 18px #62d9f4aa)}
.first-profile-card .mood-effect{filter:drop-shadow(0 0 8px #62d9f4aa)}
.first-profile-card label:not(.first-profile-photo){color:#e8e0f3;font-size:12px}
.first-profile-card input:not([type=file]),.first-profile-card textarea{border-color:#41364f;background:#100d19;color:#f5efff}
.first-profile-card input:not([type=file]):focus,.first-profile-card textarea:focus{border-color:#62d9f4;box-shadow:0 0 0 3px #42b9ff20}
.first-profile-card textarea{min-height:88px;resize:vertical}
.first-profile-photo-frame{border-color:#62d9f4;box-shadow:0 0 18px #2daaff45,0 0 0 4px #62d9f41c}

/* El QR y el código manual son dos caminos dentro de la misma vinculación. */
.auth-device-link-card{display:grid;gap:7px;margin-top:14px;padding:10px;border:1px solid #54bdff38;border-radius:18px;background:linear-gradient(145deg,#142443a6,#17172da8);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:inset 0 1px #ffffff12,0 8px 24px #0b56aa1b}
.auth-card .auth-device-link-card #scanDeviceQRLogin{margin-top:0}
.auth-device-link-card .auth-qr-help{display:block;margin:6px 4px 0;text-align:center;color:#b8afc9;font-size:10px;line-height:1.45}
.auth-device-manual{display:grid;gap:2px;justify-items:center;padding-top:8px;border-top:1px solid #ffffff12;color:#c4b9d2;font-size:10px}
.auth-device-manual .text-button{width:auto;margin:0;text-align:center;color:#b7dcff;font-size:11px}
.auth-device-link-card .device-pair-form{padding:8px;border:1px solid #ffffff12;border-radius:12px;background:#ffffff08}
@media(prefers-reduced-motion:reduce){.first-profile-card *{scroll-behavior:auto!important}}

.profile-signout{display:grid;gap:12px;margin:20px 0 4px;padding:15px;border:1px solid #ff7e9340;border-radius:16px;background:linear-gradient(135deg,#7e243216,#ffffff08);box-shadow:inset 0 1px #ffffff10}
.profile-signout h3{margin:0 0 4px;color:#f4efff;font-size:13px}
.profile-signout p{margin:0;color:#bdb3ca;font-size:11px;line-height:1.5}
.profile-signout button{min-height:42px;border-color:#ff8a9b66;background:linear-gradient(105deg,#7d243936,#48203c55);color:#ffe9ed}
.profile-signout button:hover{border-color:#ff9eae;background:linear-gradient(105deg,#9a30484d,#55214366)}
.profile-signout button span{margin-right:7px;color:#ffb0be}

/* Acceso visible a publicar estados en escritorio y móvil. */
.status-main-heading{display:flex!important;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.status-main-heading>div{min-width:0}
.status-add-button{position:relative;isolation:isolate;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:0 12px;border:1px solid #72d8ff70;border-radius:12px;background:linear-gradient(115deg,#174a7b90,#40378d88);color:#f4f9ff;font-family:inherit;font-size:11px;font-weight:600;line-height:1.2;box-shadow:0 4px 15px #287ed01f,inset 0 1px #ffffff24;backdrop-filter:blur(12px) saturate(145%);-webkit-backdrop-filter:blur(12px) saturate(145%);cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.status-add-button>span{font-size:17px;color:#b8edff;line-height:1;text-shadow:0 0 9px #64cfff80}
.status-add-button:hover{transform:translateY(-1px);border-color:#9eeaffbd;box-shadow:0 6px 19px #287ed036,inset 0 1px #ffffff38}
.status-add-button:focus-visible{outline:2px solid #8cdbff;outline-offset:3px}

/* Archivados usa el mismo vidrio azul/lavanda de Brisa con un destello muy suave. */
.archived-chats-toggle{position:relative;isolation:isolate;overflow:hidden;border:1px solid #8edfff66!important;background:linear-gradient(115deg,#174b7a77,#362d775e 58%,#14788755)!important;color:#eaf7ff!important;box-shadow:0 4px 16px #287ed01a,inset 0 1px #ffffff20;backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
.archived-chats-toggle::after{content:"";position:absolute;z-index:-1;top:-45%;bottom:-45%;left:-42%;width:26%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,#ffffff26,transparent);animation:archive-glass-glint 8s ease-in-out infinite;pointer-events:none}
.archived-chats-toggle:hover{border-color:#9ae9ffad!important;box-shadow:0 5px 18px #287ed02b,inset 0 1px #ffffff30}
@keyframes archive-glass-glint{0%,34%{left:-42%;opacity:0}43%{opacity:.8}62%{left:125%;opacity:0}100%{left:125%;opacity:0}}

/* Cerrar sesión queda al final de la portada de Configuración, con confirmación. */
.settings-logout-button{display:flex;align-items:center;justify-content:flex-start;gap:8px;width:100%;min-height:42px;margin:18px 0 3px;padding:0 13px;border:1px solid #b85d7b42;border-radius:12px;background:#6b294018;color:#d8a4b3;font-family:inherit;font-size:12px;font-weight:600;line-height:1.2;text-align:left;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease}
.settings-logout-button:hover{border-color:#d5789375;background:#742d432b;color:#ffd3dc}
.settings-logout-button:focus-visible{outline:2px solid #dc8ea5;outline-offset:3px}
@media(max-width:767px){.status-main-heading{padding-inline:2px!important}.status-add-button{min-height:32px;padding-inline:10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.archived-chats-toggle::after{animation:none}.status-add-button,.archived-chats-toggle,.settings-logout-button{transition:none}}

/* Evita que una fila con el gráfico de ánimo se encoja al ancho de su contenido en la ventana PC. */
html.phone-preview #conversationList{width:100%!important;min-width:0!important;align-self:stretch!important}
html.phone-preview #conversationList>.conversation-item{width:100%!important;min-width:0!important;align-self:stretch!important}
html.phone-preview #conversationList>.conversation-item>.conv-row{width:100%!important;min-width:0!important;flex:1 1 100%!important;align-self:stretch!important}

/* La vista Contactos usa el lenguaje animado de Brisa en toda la pantalla. */
html.phone-preview #app>.sidebar{position:relative!important;isolation:isolate!important}
.contact-mood-scene{position:absolute;z-index:0;inset:0;overflow:hidden;border-radius:inherit;opacity:0;pointer-events:none;transition:opacity .45s ease;background:radial-gradient(ellipse at 78% 16%,#277ec02c,transparent 42%),radial-gradient(ellipse at 20% 68%,#9a42b72a,transparent 47%),linear-gradient(155deg,#111525 0%,#0a0b13 62%,#11101b 100%)}
.contact-mood-scene::before{content:"";position:absolute;inset:-20%;background:radial-gradient(ellipse at 28% 18%,#55cfff16,transparent 40%),radial-gradient(ellipse at 78% 76%,#a95bff13,transparent 45%);animation:contact-scene-glow 12s ease-in-out infinite alternate}
.contact-symbol-field{position:absolute;inset:0;overflow:hidden}
.contact-mood-symbol{position:absolute;left:var(--contact-x);top:var(--contact-y);display:block;font-size:var(--contact-size);line-height:1;color:var(--contact-glow);opacity:.3;text-shadow:0 0 10px color-mix(in srgb,var(--contact-glow) 70%,transparent);filter:drop-shadow(0 0 7px color-mix(in srgb,var(--contact-glow) 55%,transparent));animation:contact-symbol-drift var(--contact-duration) ease-in-out var(--contact-delay) infinite;will-change:transform,opacity}
.contact-mood-particle{position:absolute;left:var(--contact-x);top:var(--contact-y);display:grid;place-items:center;width:var(--contact-size);height:var(--contact-size);opacity:var(--contact-opacity);color:#f6f5ff;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--contact-glow) 62%,transparent));animation:contact-mood-drift var(--contact-duration) ease-in-out var(--contact-delay) infinite;will-change:transform,opacity}
.contact-mood-face{font-size:var(--contact-size);line-height:1;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--contact-glow) 72%,transparent))}
.contact-mood-accent{position:absolute;top:0;right:-2px;color:var(--contact-glow);font-size:11px;font-style:normal;text-shadow:0 0 10px var(--contact-glow);animation:contact-accent-pulse 2.2s ease-in-out infinite alternate}
.contacts-only .contact-mood-scene{opacity:1}
.contacts-only .sidebar>:not(.contact-mood-scene){position:relative;z-index:1}
.contacts-only .sidebar>.mobile-bottom{z-index:5}
.contacts-only .mobile-search{border:1px solid #77dfff68!important;background:linear-gradient(112deg,#15294cbb,#292044bb 58%,#153748aa)!important;box-shadow:0 0 20px #289ee526,inset 0 1px #ffffff30!important;backdrop-filter:blur(20px) saturate(150%)!important;-webkit-backdrop-filter:blur(20px) saturate(150%)!important}
.contacts-only .mobile-search:focus-within{border-color:#94e9ff!important;box-shadow:0 0 0 3px #56cfff20,0 0 24px #33b5ff3b,inset 0 1px #ffffff40!important}
.contacts-only .contact-lookup{position:relative;isolation:isolate;overflow:hidden;flex:none;min-height:58px;align-items:center;gap:8px;margin:6px 0 11px;padding:7px;border:1px solid #77dfff78;border-radius:20px;background:linear-gradient(112deg,#14294bc9,#292047bf 56%,#103342b8);box-shadow:0 8px 24px #0004,0 0 20px #369ee51c,inset 0 1px #ffffff32;backdrop-filter:blur(22px) saturate(155%);-webkit-backdrop-filter:blur(22px) saturate(155%);transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease}
.contacts-only .contact-lookup::before{content:"";position:absolute;z-index:-1;inset:-70% -20%;background:linear-gradient(105deg,transparent 36%,#ffffff12 48%,#6be3ff1a 53%,transparent 65%);transform:translateX(-65%) rotate(-8deg);animation:contact-form-sheen 8s ease-in-out infinite;pointer-events:none}
.contacts-only .contact-lookup:focus-within{border-color:#a3edff;box-shadow:0 0 0 3px #4fcfff1c,0 0 25px #40bdff36,inset 0 1px #ffffff40}
.contacts-only .contact-lookup input{height:40px;padding-inline:12px;color:#f5f4ff;font-size:14px}
.contacts-only .contact-lookup input::placeholder{color:#b8bad0}
.contacts-only .contact-lookup button{width:42px;height:40px;flex:none;border:1px solid #c096ff73;border-radius:14px;background:linear-gradient(135deg,#9b42ee,#455fff);color:white;font-size:24px;box-shadow:0 0 16px #7650ff4a,inset 0 1px #ffffff45;transition:transform .2s ease,filter .2s ease}
.contacts-only .contact-lookup button:hover{transform:translateY(-1px) scale(1.04);filter:brightness(1.12)}
.contacts-only .contact-lookup #scanContactQR{width:40px;height:40px;border:1px solid #77dfff80;border-radius:14px;background:#12304dcc;color:#c4f3ff;box-shadow:inset 0 1px #ffffff25}
.contacts-only .create-group-button{position:relative;z-index:1;flex:none;border-color:#73dbff68;background:linear-gradient(110deg,#16344fc4,#252044c4);box-shadow:0 7px 20px #0003,inset 0 1px #ffffff24;backdrop-filter:blur(16px) saturate(145%);-webkit-backdrop-filter:blur(16px) saturate(145%)}
.contacts-only .people-list{position:relative;z-index:1}

/* Revisión móvil: archivados en vidrio y filas con ancho estable en cualquier vista. */
.archived-chats-toggle{min-height:44px!important;padding:10px 14px!important;border-radius:15px!important;border-color:#a4e8ff80!important;background:linear-gradient(115deg,#1639588c,#3026587a 58%,#18475b70)!important;color:#f2f8ff!important;font-size:14px!important;box-shadow:0 6px 20px #0003,inset 0 1px #ffffff30!important;backdrop-filter:blur(18px) saturate(155%)!important;-webkit-backdrop-filter:blur(18px) saturate(155%)!important;transition:max-height .28s cubic-bezier(.2,.75,.25,1),opacity .2s ease,transform .28s cubic-bezier(.2,.75,.25,1),padding .28s ease,margin .28s ease,border-color .2s ease!important}
@media(max-width:767px){
  #app #conversationList{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-auto-columns:minmax(0,1fr)!important;width:100%!important;min-width:0!important;align-self:stretch!important}
  #app #conversationList>.conversation-item{display:flex!important;width:100%!important;max-width:100%!important;min-width:0!important;align-self:stretch!important;overflow:hidden!important}
  #app #conversationList>.conversation-item>.conv-row{display:flex!important;flex:1 1 100%!important;width:100%!important;max-width:100%!important;min-width:0!important;align-self:stretch!important}
  #app #conversationList>.conversation-item>.conv-row>.avatar,#app #conversationList>.conversation-item>.conv-row>.row-copy{position:relative!important;z-index:2!important}
  #app #conversationList>.conversation-item>.conv-row>.row-mood-visual{z-index:0!important}
  #app #conversationList>.conversation-item>.chat-swipe-actions{z-index:3!important}
  #app .conversation-item,#app .conversation-item .conv-row{height:72px!important;min-height:72px!important}
  #app .conversation-item .conv-row{padding:7px 42px 7px 8px!important;gap:12px!important;border-radius:15px!important}
  #app .conversation-item .avatar{width:49px!important;height:49px!important;flex:0 0 49px!important}
  #app .conversation-item .row-top strong{font-size:14px!important}
  #app .conversation-item .row-sub{font-size:12px!important;margin-top:3px!important}
  #app .conversation-item .row-time{font-size:10px!important}
  .archived-chats-toggle.archive-pull-hidden{max-height:0!important;padding-block:0!important;margin-block:0!important;border-width:0!important;opacity:0;transform:translateY(-5px);filter:blur(2px);pointer-events:none}
  .app.archive-pull-armed .archived-chats-toggle.archive-pull-hidden{max-height:30px!important;padding-block:6px!important;opacity:.65;transform:translateY(0);filter:blur(0)}
}
@media(prefers-reduced-motion:reduce){.archived-chats-toggle{transition:none!important}}

/* Cabecera móvil: retrato central y accesos superiores más grandes y bajos. */
@media(max-width:767px){
  #app>.sidebar>.brand{position:relative!important;flex:0 0 96px!important;min-height:96px!important;padding:0!important;overflow:visible!important}
  #app>.sidebar>.brand .header-profile-avatar{top:14px!important;left:50%!important;width:70px!important;height:70px!important;transform:translateX(-50%)!important;font-size:20px!important;border-width:2px!important;box-shadow:0 0 22px #376dff80,0 0 26px #8b3bff4a!important}
  #app>.sidebar>.brand .mobile-top-actions{top:20px!important;right:2px!important;gap:12px!important;align-items:center!important}
  #app>.sidebar>.brand .mobile-top-actions .mobile-round-action{width:46px!important;height:46px!important;min-width:46px!important;border-radius:50%!important}
  #app>.sidebar>.brand #mobileMore.mobile-round-action{font-size:19px!important;letter-spacing:1px!important;box-shadow:0 0 16px #8b5bff55,inset 0 1px #ffffff38!important}
  #app>.sidebar>.brand #newChat.mobile-round-action{box-shadow:0 0 18px #147fff78,inset 0 1px #ffffff48!important}
  #app>.sidebar>.brand #newChat.mobile-round-action svg{width:23px!important;height:23px!important}
}
@media(min-width:768px){
  html.phone-preview #app>.sidebar>.brand{flex:0 0 96px!important;min-height:96px!important;padding:0!important;overflow:visible!important}
  html.phone-preview #app>.sidebar>.brand .header-profile-avatar{top:14px!important;left:50%!important;width:70px!important;height:70px!important;transform:translateX(-50%)!important;font-size:20px!important;border-width:2px!important;box-shadow:0 0 22px #376dff80,0 0 26px #8b3bff4a!important}
  html.phone-preview #app>.sidebar>.brand .mobile-top-actions{top:20px!important;right:2px!important;gap:12px!important}
  html.phone-preview #app>.sidebar>.brand .mobile-top-actions .mobile-round-action{width:46px!important;height:46px!important;min-width:46px!important}
  html.phone-preview #app>.sidebar>.brand #mobileMore.mobile-round-action{font-size:19px!important;letter-spacing:1px!important}
  html.phone-preview #app>.sidebar>.brand #newChat.mobile-round-action svg{width:23px!important;height:23px!important}
}
@media(max-width:767px){
  #app #conversationList>.conversation-item,#app #conversationList>.conversation-item>.conv-row{height:92px!important;min-height:92px!important}
  #app #conversationList>.conversation-item>.conv-row{padding:9px 44px 9px 10px!important;gap:14px!important;border-radius:18px!important}
  #app #conversationList>.conversation-item .avatar{width:58px!important;height:58px!important;flex-basis:58px!important}
  #app #conversationList>.conversation-item .row-top strong{font-size:15px!important}
  #app #conversationList>.conversation-item .row-sub{font-size:13px!important;margin-top:4px!important}
  #app #conversationList>.conversation-item .row-mood-visual .mood-face{font-size:38px!important}
  #app #conversationList>.conversation-item .row-mood-visual .mood-effect{font-size:20px!important}
}
@media(min-width:768px){
  html.phone-preview #app #conversationList>.conversation-item,html.phone-preview #app #conversationList>.conversation-item>.conv-row{height:92px!important;min-height:92px!important}
  html.phone-preview #app #conversationList>.conversation-item>.conv-row{padding:9px 44px 9px 10px!important;gap:14px!important;border-radius:18px!important}
  html.phone-preview #app #conversationList>.conversation-item .avatar{width:58px!important;height:58px!important;flex-basis:58px!important}
  html.phone-preview #app #conversationList>.conversation-item .row-top strong{font-size:15px!important}
  html.phone-preview #app #conversationList>.conversation-item .row-sub{font-size:13px!important;margin-top:4px!important}
  html.phone-preview #app #conversationList>.conversation-item .row-mood-visual .mood-face{font-size:38px!important}
  html.phone-preview #app #conversationList>.conversation-item .row-mood-visual .mood-effect{font-size:20px!important}
}
@keyframes contact-mood-drift{0%,100%{transform:translate3d(0,0,0) rotate(0) scale(.78);opacity:calc(var(--contact-opacity)*.48)}50%{transform:translate3d(var(--contact-dx),var(--contact-dy),0) rotate(var(--contact-turn)) scale(1.16);opacity:var(--contact-opacity)}}
@keyframes contact-symbol-drift{0%,100%{transform:translate3d(0,0,0) rotate(-8deg) scale(.78);opacity:.12}50%{transform:translate3d(var(--contact-dx),var(--contact-dy),0) rotate(12deg) scale(1.14);opacity:.43}}
@keyframes contact-accent-pulse{from{transform:translateY(2px) scale(.7);opacity:.3}to{transform:translateY(-3px) scale(1.12);opacity:.92}}
@keyframes contact-scene-glow{from{transform:translate3d(-2%,1%,0) scale(.98);opacity:.7}to{transform:translate3d(2%,-1%,0) scale(1.04);opacity:1}}
@keyframes contact-form-sheen{0%,55%{transform:translateX(-65%) rotate(-8deg);opacity:0}67%{opacity:.8}88%,100%{transform:translateX(65%) rotate(-8deg);opacity:0}}
.settings-signout-wrap{display:grid;justify-items:center;gap:6px;margin:18px 0 4px;padding:9px 10px 0;border-top:1px solid #ffffff0c}
.settings-signout-wrap .settings-logout-button{width:auto;min-height:34px;margin:0;padding:0 12px;border-radius:11px;font-size:11px}
.settings-signout-wrap>small{color:#9998a8;font-size:10px;line-height:1.4;text-align:center}
@media(prefers-reduced-motion:reduce){.contact-mood-scene,.contact-mood-scene::before,.contact-symbol-field,.contact-mood-symbol,.contact-mood-particle,.contact-mood-accent,.contact-lookup::before{animation:none!important;transition:none!important}}

/* Búsqueda limpia para Chats y Contactos: texto visible, fondo de cristal y luz solo en la línea. */
html.phone-preview #app .mobile-search{position:relative!important;isolation:isolate;overflow:visible!important;min-height:44px!important;padding:0 10px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;color:#d9d8ee!important}
html.phone-preview #app .mobile-search>span{color:#c2c9e6!important;text-shadow:0 0 9px #74dfff55}
html.phone-preview #app .mobile-search::before{content:"";position:absolute;z-index:-1;left:8px;right:8px;bottom:1px;height:1px;border-radius:999px;background:linear-gradient(90deg,transparent,#8f68ed55 18%,#55d9ff80 50%,#a56dff55 82%,transparent);opacity:.58;pointer-events:none}
html.phone-preview #app .mobile-search::after{content:"";position:absolute;z-index:0;left:12px;right:12px;bottom:0;height:2px;border-radius:999px;background:linear-gradient(90deg,transparent 0%,#79e8ff 38%,#c9a4ff 52%,#79e8ff 66%,transparent 100%);background-size:220% 100%;opacity:0;filter:drop-shadow(0 0 4px #67dfff) drop-shadow(0 0 9px #9a65ff);transform:scaleX(.22);transform-origin:center;transition:opacity .22s ease,transform .22s ease;pointer-events:none}
html.phone-preview #app .mobile-search:focus-within::after,html.phone-preview #app .mobile-search.has-query::after{opacity:.95;transform:scaleX(1);animation:brisa-search-line 2.2s ease-in-out infinite}
html.phone-preview #app .mobile-search input,html.phone-preview #app .mobile-search input[type=search]{width:100%!important;min-width:0!important;height:42px!important;padding:0 5px!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#fbfaff!important;font-size:14px!important;caret-color:#8feaff;-webkit-appearance:none;appearance:none}
html.phone-preview #app .mobile-search input::placeholder{color:#aaa9c1!important;opacity:1}
html.phone-preview #app .mobile-search input:focus,html.phone-preview #app .mobile-search input:focus-visible{outline:0!important;border:0!important;box-shadow:none!important}
html.phone-preview #app.contacts-only .mobile-search{border:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.phone-preview #app.contacts-only .mobile-search:focus-within{border:0!important;box-shadow:none!important}
@keyframes brisa-search-line{0%,100%{background-position:100% 50%;filter:drop-shadow(0 0 3px #67dfff) drop-shadow(0 0 6px #9a65ff);opacity:.72}50%{background-position:0 50%;filter:drop-shadow(0 0 5px #67dfff) drop-shadow(0 0 11px #9a65ff);opacity:1}}
@media(prefers-reduced-motion:reduce){html.phone-preview #app .mobile-search:focus-within::after,html.phone-preview #app .mobile-search.has-query::after{animation:none!important}}

/* Escena de Contactos: figuras dispersas y movimientos propios por emoción. */
.contacts-only .contact-mood-scene{background:radial-gradient(ellipse at 76% 18%,#245bb633,transparent 43%),radial-gradient(ellipse at 20% 72%,#9a42b738,transparent 48%),linear-gradient(155deg,#111525 0%,#0a0b13 62%,#11101b 100%)}
.contact-mood-symbol{opacity:.44;text-shadow:0 0 12px color-mix(in srgb,var(--contact-glow) 78%,transparent);animation-duration:var(--contact-duration);animation-timing-function:cubic-bezier(.42,0,.58,1)}
.contact-mood-symbol.symbol-motion-1{animation-name:contact-symbol-orbit}.contact-mood-symbol.symbol-motion-2{animation-name:contact-symbol-sway}.contact-mood-symbol.symbol-motion-3{animation-name:contact-symbol-pop}.contact-mood-symbol.symbol-motion-4{animation-name:contact-symbol-rise}.contact-mood-symbol.symbol-motion-5{animation-name:contact-symbol-turn}
.contact-mood-particle{opacity:var(--contact-opacity);animation-duration:var(--contact-duration);animation-timing-function:cubic-bezier(.42,0,.58,1);filter:drop-shadow(0 0 12px color-mix(in srgb,var(--contact-glow) 58%,transparent))}
.contact-mood-face{display:block;position:relative;z-index:1;transform-origin:50% 70%;filter:drop-shadow(0 0 9px color-mix(in srgb,var(--contact-glow) 68%,transparent));animation-duration:var(--contact-face-duration,3.4s);animation-iteration-count:infinite;animation-timing-function:ease-in-out}
.contact-mood-particle.motion-0 .contact-mood-face{animation-name:contact-face-bounce}.contact-mood-particle.motion-1 .contact-mood-face{animation-name:contact-face-sway}.contact-mood-particle.motion-2 .contact-mood-face{animation-name:contact-face-pulse}.contact-mood-particle.motion-3 .contact-mood-face{animation-name:contact-face-spin}.contact-mood-particle.motion-4 .contact-mood-face{animation-name:contact-face-nod}.contact-mood-particle.motion-5 .contact-mood-face{animation-name:contact-face-wiggle}.contact-mood-particle.motion-6 .contact-mood-face{animation-name:contact-face-float}.contact-mood-particle.motion-7 .contact-mood-face{animation-name:contact-face-squash}
.contact-mood-effect{position:absolute;z-index:2;display:block;font-size:var(--contact-effect-size,14px);line-height:1;font-style:normal;pointer-events:none;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--contact-glow) 60%,transparent))}
.contact-mood-effect.effect-1{left:70%;top:-13%;animation:contact-effect-drift 2.1s ease-in-out infinite}.contact-mood-effect.effect-2{left:-15%;top:14%;animation:contact-effect-drift 2.8s ease-in-out -.9s infinite reverse}.contact-mood-effect.effect-3{left:55%;top:69%;animation:contact-effect-drift 3.2s ease-in-out -1.5s infinite}
.mood-kiss .contact-mood-face{animation:contact-kiss-face 2.3s ease-in-out infinite!important}.mood-kiss .contact-mood-effect.effect-1{left:72%;top:4%;animation:contact-kiss-blow 2.5s ease-out infinite}.mood-kiss .contact-mood-effect.effect-2{left:72%;top:4%;animation:contact-kiss-heart 2.7s ease-out -.8s infinite}.mood-kiss .contact-mood-effect.effect-3{left:66%;top:11%;animation:contact-kiss-heart 3s ease-out -1.6s infinite}
.mood-angry .contact-mood-face,.mood-annoyed .contact-mood-face,.mood-frustrated .contact-mood-face,.mood-furious .contact-mood-face{animation:contact-angry-tremble .82s ease-in-out infinite!important;filter:drop-shadow(0 0 10px #ff583c9c)}
.mood-angry .contact-mood-effect.effect-1,.mood-annoyed .contact-mood-effect.effect-1,.mood-frustrated .contact-mood-effect.effect-2,.mood-furious .contact-mood-effect.effect-1{left:73%;top:-19%;animation:contact-smoke-rise 2s ease-out infinite}
.mood-angry .contact-mood-effect.effect-2,.mood-annoyed .contact-mood-effect.effect-2,.mood-frustrated .contact-mood-effect.effect-2,.mood-furious .contact-mood-effect.effect-2{left:42%;top:-18%;animation:contact-smoke-rise 2.5s ease-out -1.1s infinite}
.mood-angry .contact-mood-effect.effect-3,.mood-annoyed .contact-mood-effect.effect-3,.mood-furious .contact-mood-effect.effect-3{left:82%;top:2%;animation:contact-anger-flash .9s ease-in-out infinite}
.mood-happy .contact-mood-effect,.mood-party .contact-mood-effect{animation-name:contact-confetti-burst;animation-duration:2.2s}
.mood-sad .contact-mood-effect.effect-1,.mood-crying .contact-mood-effect.effect-1{left:70%;top:42%;animation:contact-tear-drop 1.8s ease-in infinite}.mood-sad .contact-mood-effect.effect-2,.mood-crying .contact-mood-effect.effect-2{left:52%;top:38%;animation:contact-tear-drop 2s ease-in -1s infinite}
.mood-love .contact-mood-effect,.mood-adore .contact-mood-effect,.mood-hug .contact-mood-effect,.mood-heart-hands .contact-mood-effect,.mood-finger-heart .contact-mood-effect{animation-name:contact-heart-orbit;animation-duration:3s}
.mood-sleepy .contact-mood-effect,.mood-drowsy .contact-mood-effect{animation-name:contact-zzz-rise;animation-duration:3.5s}.mood-cold .contact-mood-effect{animation-name:contact-snow-swirl;animation-duration:4s}.mood-hot .contact-mood-effect,.mood-fire .contact-mood-effect{animation-name:contact-flame-flicker;animation-duration:1.4s}.mood-thinking .contact-mood-effect{animation-name:contact-thought-pop;animation-duration:2.7s}.mood-dizzy .contact-mood-effect{animation-name:contact-dizzy-orbit;animation-duration:2.2s}.mood-shy .contact-mood-effect{animation-name:contact-blush-pulse;animation-duration:2s}
@keyframes contact-symbol-orbit{0%,100%{transform:translate(0,0) rotate(-18deg) scale(.82)}50%{transform:translate(var(--contact-dx),var(--contact-dy)) rotate(28deg) scale(1.2)}}
@keyframes contact-symbol-sway{0%,100%{transform:translate(0,0) rotate(12deg)}50%{transform:translate(var(--contact-dx-reverse),var(--contact-dy)) rotate(-22deg) scale(1.2)}}
@keyframes contact-symbol-pop{0%,100%{transform:translate(0,0) scale(.72);opacity:.15}50%{transform:translate(var(--contact-dx),var(--contact-dy)) scale(1.35);opacity:.62}}
@keyframes contact-symbol-rise{0%{transform:translate(0,14px) rotate(-14deg);opacity:.16}55%{opacity:.55}100%{transform:translate(var(--contact-dx),-28px) rotate(18deg);opacity:.12}}
@keyframes contact-symbol-turn{0%,100%{transform:translate(0,0) rotate(0) scale(.85)}50%{transform:translate(var(--contact-dx),var(--contact-dy)) rotate(180deg) scale(1.18)}}
@keyframes contact-face-bounce{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(-8px) scale(1.08)}65%{transform:translateY(1px) scale(.94)}}
@keyframes contact-face-sway{0%,100%{transform:rotate(-10deg) translateY(1px)}50%{transform:rotate(10deg) translateY(-4px)}}
@keyframes contact-face-pulse{0%,100%{transform:scale(.9)}50%{transform:scale(1.18)}}
@keyframes contact-face-spin{0%,82%,100%{transform:rotate(0) scale(1)}90%{transform:rotate(16deg) scale(1.13)}}
@keyframes contact-face-nod{0%,100%{transform:rotate(0) translateY(0)}35%{transform:rotate(-8deg) translateY(-5px)}70%{transform:rotate(6deg) translateY(1px)}}
@keyframes contact-face-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-12deg)}50%{transform:rotate(9deg)}75%{transform:rotate(-5deg)}}
@keyframes contact-face-float{0%,100%{transform:translateY(2px) rotate(4deg)}50%{transform:translateY(-7px) rotate(-7deg)}}
@keyframes contact-face-squash{0%,100%{transform:scale(1)}45%{transform:scale(1.12,.88)}65%{transform:scale(.91,1.1)}}
@keyframes contact-effect-drift{0%,100%{transform:translate3d(0,0,0) scale(.65);opacity:.2}50%{transform:translate3d(8px,-9px,0) scale(1.16);opacity:.92}}
@keyframes contact-kiss-face{0%,100%{transform:rotate(0) scale(1,1)}28%{transform:rotate(-10deg) scale(.92,1.08)}47%{transform:translateX(3px) scale(1.14,.92)}68%{transform:rotate(8deg) scale(1)}}
@keyframes contact-kiss-blow{0%{transform:translate(0,0) scale(.35) rotate(-16deg);opacity:0}18%{opacity:1}100%{transform:translate(30px,-25px) scale(1.1) rotate(18deg);opacity:0}}
@keyframes contact-kiss-heart{0%{transform:translate(0,0) scale(.25);opacity:0}20%{opacity:1}100%{transform:translate(32px,-35px) scale(1.1);opacity:0}}
@keyframes contact-angry-tremble{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-2px) rotate(-5deg)}65%{transform:translateX(2px) rotate(5deg)}}
@keyframes contact-smoke-rise{0%{transform:translate(0,5px) scale(.35) rotate(-12deg);opacity:0}24%{opacity:.95}100%{transform:translate(7px,-24px) scale(1.25) rotate(14deg);opacity:0}}
@keyframes contact-anger-flash{0%,100%{transform:scale(.65) rotate(-14deg);opacity:.25}50%{transform:scale(1.2) rotate(12deg);opacity:1}}
@keyframes contact-confetti-burst{0%{transform:translate(0,0) rotate(0) scale(.25);opacity:0}20%{opacity:1}100%{transform:translate(16px,-25px) rotate(95deg) scale(1);opacity:0}}
@keyframes contact-tear-drop{0%,20%{transform:translateY(-3px) scale(.7);opacity:0}35%{opacity:.95}100%{transform:translateY(24px) scale(1.08);opacity:0}}
@keyframes contact-heart-orbit{0%,100%{transform:translate(0,0) scale(.65) rotate(-12deg);opacity:.26}50%{transform:translate(12px,-13px) scale(1.2) rotate(18deg);opacity:1}}
@keyframes contact-zzz-rise{0%{transform:translate(0,8px) scale(.55);opacity:0}20%{opacity:.9}100%{transform:translate(13px,-26px) scale(1.15);opacity:0}}
@keyframes contact-snow-swirl{0%,100%{transform:translate(0,-3px) rotate(0);opacity:.35}50%{transform:translate(11px,9px) rotate(150deg);opacity:1}}
@keyframes contact-flame-flicker{0%,100%{transform:translateY(0) scale(.78) rotate(-8deg);opacity:.45}50%{transform:translateY(-11px) scale(1.2) rotate(8deg);opacity:1}}
@keyframes contact-thought-pop{0%,100%{transform:translateY(5px) scale(.6);opacity:.25}50%{transform:translateY(-9px) scale(1.16);opacity:1}}
@keyframes contact-dizzy-orbit{0%{transform:rotate(0) translateX(0) scale(.7);opacity:.3}50%{transform:rotate(180deg) translateX(11px) scale(1.1);opacity:1}100%{transform:rotate(360deg) translateX(0) scale(.7);opacity:.3}}
@keyframes contact-blush-pulse{0%,100%{transform:scale(.7);opacity:.2}50%{transform:scale(1.15);opacity:1}}
@media(prefers-reduced-motion:reduce){.contact-mood-scene,.contact-mood-scene::before,.contact-symbol-field,.contact-mood-symbol,.contact-mood-particle,.contact-mood-face,.contact-mood-effect{animation-duration:12s!important}}

/* Las burbujas siguen el ánimo activo de cada conversación, con un brillo suave como el encabezado. */
.messages[data-chat-mood] .message .bubble,.messages[data-chat-mood] .message .chat-file-card{background-size:220% 220%;animation:brisa-message-mood-flow 11s ease-in-out infinite;transition:border-color .35s ease,box-shadow .35s ease}
.messages[data-chat-mood] .message:not(.mine) .bubble,.messages[data-chat-mood] .message:not(.mine) .chat-file-card{background-image:radial-gradient(ellipse at 12% 5%,color-mix(in srgb,var(--chat-mood-a) 22%,transparent),transparent 62%),linear-gradient(112deg,color-mix(in srgb,var(--chat-mood-a) 24%,#101423),color-mix(in srgb,var(--chat-mood-b) 18%,#151625) 56%,color-mix(in srgb,var(--chat-mood-c) 15%,#141827))!important;border-color:color-mix(in srgb,var(--chat-mood-c) 34%,#ffffff1e)!important;box-shadow:0 4px 16px #02040b44,0 0 12px color-mix(in srgb,var(--chat-mood-c) 12%,transparent)!important}
.messages[data-chat-mood] .message.mine .bubble,.messages[data-chat-mood] .message.mine .chat-file-card{background-image:radial-gradient(ellipse at 88% 2%,color-mix(in srgb,var(--chat-mood-c) 30%,transparent),transparent 61%),linear-gradient(112deg,color-mix(in srgb,var(--chat-mood-a) 55%,#17152b),color-mix(in srgb,var(--chat-mood-b) 56%,#17162b) 55%,color-mix(in srgb,var(--chat-mood-c) 43%,#111e2c))!important;border-color:color-mix(in srgb,var(--chat-mood-c) 55%,#ffffff22)!important;box-shadow:0 4px 17px #05142c72,0 0 15px color-mix(in srgb,var(--chat-mood-c) 20%,transparent)!important}
.bubble-message-text{position:relative;z-index:1}
@keyframes brisa-message-mood-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.chat-file-card.voice-note-card{width:min(310px,78vw);grid-template-columns:42px minmax(0,1fr);align-items:center;gap:10px;padding:10px 12px;border-radius:18px 18px 18px 5px;overflow:hidden}
.mine .chat-file-card.voice-note-card{border-radius:18px 18px 5px 18px}
.voice-note-play{display:grid;place-items:center;width:40px;height:40px;border:1px solid #9be7ff66;border-radius:50%;background:linear-gradient(145deg,#39bfff,#6574ff 66%,#aa63ff);color:white;font-size:15px;padding-left:2px;box-shadow:0 0 15px #57cfff44;transition:transform .18s ease,box-shadow .18s ease}
.voice-note-play:hover{transform:scale(1.06);box-shadow:0 0 20px #73dfff7a}
.voice-note-content{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;min-width:0}
.voice-note-label{color:#eaf5ff;font-size:10px;font-weight:700;letter-spacing:.02em}
.voice-note-waveform{display:flex;align-items:center;justify-content:space-between;gap:2px;width:100%;height:27px;cursor:pointer;touch-action:manipulation;outline:none}
.voice-note-waveform i{display:block;width:3px;min-width:2px;height:var(--wave-height);max-height:22px;border-radius:8px;background:linear-gradient(180deg,#e8fbff,#78cfff 62%,#9b82ff);opacity:.58;transition:opacity .15s,filter .15s}
.voice-note-waveform i:nth-child(3n){height:calc(var(--wave-height)*.76)}.voice-note-waveform i:nth-child(4n){height:calc(var(--wave-height)*1.13)}
.voice-note-waveform i.heard{opacity:1;filter:drop-shadow(0 0 4px #76dcffb8)}
.voice-note-waveform:focus-visible{filter:drop-shadow(0 0 5px #8fe7ff)}
.voice-note-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#cfddf4;font-size:9px;font-variant-numeric:tabular-nums}
.voice-note-speed{padding:3px 6px;border:1px solid #a5ddff35;border-radius:8px;background:#ffffff10;color:#e7f8ff;font-size:9px;font-weight:750;line-height:1.2;cursor:pointer}
.voice-note-speed:hover,.voice-note-speed:focus-visible{border-color:#a5ddff9c;background:#ffffff20;outline:none}
.voice-note-seek{min-width:29px;padding:3px 4px;border:1px solid #a5ddff35;border-radius:8px;background:#ffffff0d;color:#dff5ff;font-size:9px;font-weight:750;line-height:1.2;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,transform .15s}
.voice-note-seek:hover,.voice-note-seek:focus-visible{border-color:#a5ddff9c;background:#ffffff20;outline:none}
.voice-note-seek:active{transform:scale(.94)}
.voice-note-stamp{margin:0;color:#d4dff1!important;font-size:8px}
.voice-note-audio{display:none!important}
.voice-note-card.is-playing .voice-note-play{animation:voice-note-pulse 1.7s ease-in-out infinite}
@keyframes voice-note-pulse{50%{box-shadow:0 0 20px #74ddff9c,0 0 28px #8371ff50}}
@media(max-width:767px){.chat-file-card.voice-note-card{width:min(280px,79vw);padding:9px 11px}.voice-note-waveform{height:25px}.voice-note-waveform i{width:2.5px}}
@media(prefers-reduced-motion:reduce){.messages[data-chat-mood] .message .bubble,.messages[data-chat-mood] .message .chat-file-card,.voice-note-card.is-playing .voice-note-play{animation:none!important}}
@media(max-width:767px){html body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),html body select,html body textarea{font-size:16px!important}}
.avatar-viewer img{touch-action:none;transform-origin:center;transition:transform .12s ease-out;cursor:zoom-in;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}

/* Rendimiento móvil: anima la sección visible y evita capas GPU innecesarias. */
@media(max-width:767px){
  #app:not(.contacts-only) .contact-mood-scene,
  #app:not(.contacts-only) .contact-mood-scene *,
  #app:not(.contacts-only) .contact-mood-scene::before,
  #app:not(.contacts-only) .contact-lookup::before{animation-play-state:paused!important}
  #app:not(.messages-only) #conversationList .row-mood-visual,
  #app:not(.messages-only) #conversationList .row-mood-visual *,
  #app:not(.chat-open) .chat .chat-header-mood-layer,
  #app:not(.chat-open) .chat .chat-header-mood-layer *,
  #app:not(.chat-open) .chat #messages .message .bubble,
  #app:not(.chat-open) .chat #messages .message .chat-file-card{animation-play-state:paused!important}
  #app:not(.statuses-only) #statusScreen *,
  #app:not(.calls-only) #callsScreen *,
  #app:not(.payments-only) #paymentsScreen *,
  #app:not(.promotions-only) #promotionsScreen *{animation-play-state:paused!important}
  #app .contact-mood-symbol,#app .contact-mood-particle{will-change:auto!important;filter:none!important}
  .contact-mood-symbol{text-shadow:0 0 8px color-mix(in srgb,var(--contact-glow) 60%,transparent)!important}
  #app .contact-mood-face{filter:none!important;text-shadow:0 2px 5px #05091b88}
  #app .contact-mood-effect{filter:none!important;text-shadow:0 1px 4px #05091b99}
  .contact-mood-scene::before{inset:0!important}
  #app #conversationList>.conversation-item{content-visibility:auto;contain-intrinsic-size:auto 104px}
}

.contact-add-modal{width:min(460px,calc(100vw - 28px));}.contact-add-modal form{display:grid;gap:14px}.contact-add-modal form label{display:grid;gap:7px;font-weight:700}.contact-add-modal form input{width:100%;min-height:48px;padding:12px 14px;border:1px solid #ffffff25;border-radius:13px;background:#0c1120;color:#f5f2ff;outline:none}.contact-add-modal form input:focus{border-color:#62d9f4;box-shadow:0 0 0 3px #62d9f426}.contact-add-note{margin:0;color:#aaa8bd;font-size:13px;line-height:1.45}

/* Editor de estados: cámara, galería, voz, texto y previsualización inmediata. */
.status-form{gap:12px!important;padding:0 5px 18px!important}
.status-tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.status-tool{min-height:66px;display:grid;justify-items:center;align-content:center;gap:5px;border:1px solid #ffffff1c;border-radius:15px;background:linear-gradient(145deg,#111a2a,#181329);color:#d5d9ea;font-size:10px;font-weight:700;transition:transform .18s,border-color .18s,background .18s,box-shadow .18s}
.status-tool:hover{transform:translateY(-2px);border-color:#62d9f477}
.status-tool.active{border-color:#65daf4;background:linear-gradient(145deg,#14375b,#32205a);color:#fff;box-shadow:0 0 16px #55caff28,inset 0 1px #ffffff24}
.status-tool-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,#2a5d9b,#814ce0);color:#fff;font-size:20px;text-shadow:0 0 10px #aeeaff}
.status-icon-camera{background:linear-gradient(145deg,#147d9b,#5b55cb)}.status-icon-gallery{background:linear-gradient(145deg,#7a4cb7,#d64c9a)}.status-icon-voice{background:linear-gradient(145deg,#25876c,#36b6ad)}.status-icon-text{font-weight:900;font-family:Manrope,sans-serif}
.status-stage{--status-a:#163e75;--status-b:#2059a7;--status-glow:#62d9f4;position:relative;isolation:isolate;overflow:hidden;min-height:205px;display:flex;align-items:center;justify-content:center;padding:18px;border:1px solid #ffffff35;border-radius:21px;background:radial-gradient(ellipse at 20% 5%,color-mix(in srgb,var(--status-glow) 32%,transparent),transparent 54%),linear-gradient(135deg,var(--status-a),var(--status-b));box-shadow:0 10px 30px #0509165c,inset 0 1px #ffffff35;transition:background .3s,border-color .3s}
.status-stage[data-status-style="sunset"]{--status-a:#742f62;--status-b:#be4d71;--status-glow:#ffb45e}.status-stage[data-status-style="berry"]{--status-a:#63265f;--status-b:#b1408a;--status-glow:#f18bbd}.status-stage[data-status-style="forest"]{--status-a:#174c47;--status-b:#287e68;--status-glow:#9fe09a}.status-stage[data-status-style="lavender"]{--status-a:#40336f;--status-b:#7558a5;--status-glow:#d5a4ff}.status-stage[data-status-style="midnight"]{--status-a:#151a38;--status-b:#293a68;--status-glow:#7a9fff}
.status-stage::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 88% 92%,color-mix(in srgb,var(--status-glow) 23%,transparent),transparent 43%)}
.status-stage-mood{z-index:1!important;opacity:.48}.status-stage-mood .mood-face{font-size:78px!important;opacity:.38!important}.status-stage-mood .mood-effect{font-size:25px!important}
.status-stage-text{position:relative;z-index:3;max-width:100%;max-height:165px;overflow:auto;padding:10px 15px;border:1px solid #ffffff25;border-radius:15px;background:#05081750;color:#fff;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;font-size:clamp(18px,4vw,25px);font-weight:750;line-height:1.28;text-shadow:0 2px 8px #000a;backdrop-filter:blur(5px)}
.status-stage-text.empty{background:transparent;border-color:transparent;color:#ffffffa8;font-size:14px;font-weight:600;text-shadow:none}
.status-stage:has(.status-upload-preview:not(.hidden)){align-items:flex-end;min-height:250px;padding:0}.status-stage .status-upload-preview{position:absolute;inset:0;z-index:0;max-height:none!important;margin:0!important;border:0!important;border-radius:inherit;background:#070b18!important}.status-stage .status-upload-preview-media{width:100%;height:100%;max-height:none!important;object-fit:cover}.status-stage:has(.status-upload-preview:not(.hidden)) .status-stage-text{width:100%;max-height:40%;margin:12px;border-radius:14px;background:linear-gradient(0deg,#050817d9,#05081775);font-size:clamp(16px,3.7vw,22px)}
.status-stage-link{position:absolute;z-index:4;left:12px;right:12px;bottom:10px;display:flex;align-items:center;gap:10px;min-height:58px;padding:7px;border:1px solid #ffffff42;border-radius:13px;background:#080d1dcc;color:#fff;backdrop-filter:blur(10px)}.status-stage-link.hidden{display:none!important}.status-stage-link:has(.status-link-thumb){bottom:10px}.status-stage:has(.status-stage-link:not(.hidden)) .status-stage-text{align-self:flex-start;margin-bottom:74px}.status-link-thumb{width:74px;height:44px;flex:none;border-radius:8px;object-fit:cover}.status-link-meta{display:grid;min-width:0;gap:3px}.status-link-meta strong{font-size:11px}.status-link-meta small{overflow:hidden;color:#c3cde0;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.status-text-wrap{position:relative}.status-text-wrap textarea{width:100%;padding-right:48px!important;min-height:86px!important}.status-emoji-toggle{position:absolute;right:8px;bottom:8px;width:32px;height:32px;border:1px solid #ffffff25;border-radius:10px;background:#222442;color:#fff;font-size:20px}.status-emoji-picker{display:flex;flex-wrap:wrap;gap:5px;padding:7px;border:1px solid #ffffff20;border-radius:12px;background:#101425}.status-emoji-picker.hidden{display:none!important}.status-emoji-picker button{width:34px;height:34px;border-radius:9px;background:transparent;font-size:22px}.status-emoji-picker button:hover{background:#ffffff18;transform:scale(1.08)}
.status-style-panel{display:grid;gap:9px;padding:11px;border:1px solid #ffffff18;border-radius:15px;background:linear-gradient(145deg,#101727c9,#18142ac9)}.status-style-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#eaf5ff;font-size:11px}.status-animate-toggle{display:flex;align-items:center;gap:6px;color:#c8d8ed!important;font-size:10px!important}.status-animate-toggle input{accent-color:#35c7ed}.status-color-options{display:flex;gap:9px}.status-color-chip{width:31px;height:31px;border:2px solid #ffffff55;border-radius:50%;background:linear-gradient(135deg,#163e75,#62d9f4);box-shadow:0 2px 8px #0005}.status-color-chip[data-status-style="sunset"]{background:linear-gradient(135deg,#742f62,#ffb45e)}.status-color-chip[data-status-style="berry"]{background:linear-gradient(135deg,#63265f,#f18bbd)}.status-color-chip[data-status-style="forest"]{background:linear-gradient(135deg,#174c47,#9fe09a)}.status-color-chip[data-status-style="lavender"]{background:linear-gradient(135deg,#40336f,#d5a4ff)}.status-color-chip[data-status-style="midnight"]{background:linear-gradient(135deg,#151a38,#7a9fff)}.status-color-chip.selected{outline:2px solid #fff;outline-offset:2px;transform:scale(1.08)}.status-mood-select-label{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:9px;color:#d9def0!important;font-size:10px!important}.status-mood-select-label select{min-width:0;height:36px;padding:0 10px;border:1px solid #ffffff2b;border-radius:10px;background:#0c1322;color:#f2f6ff}.status-mood-select-label select:disabled{opacity:.5}.status-record-row{min-height:16px}.status-record-row #statusRecordLabel{color:#bed5e8;font-size:10px}
.status-viewer-card{position:relative;isolation:isolate;overflow:hidden}.status-viewer-card[data-status-style="ocean"]{background:linear-gradient(145deg,#163e75,#2059a7)!important}.status-viewer-card[data-status-style="sunset"]{background:linear-gradient(145deg,#742f62,#be4d71)!important}.status-viewer-card[data-status-style="berry"]{background:linear-gradient(145deg,#63265f,#b1408a)!important}.status-viewer-card[data-status-style="forest"]{background:linear-gradient(145deg,#174c47,#287e68)!important}.status-viewer-card[data-status-style="lavender"]{background:linear-gradient(145deg,#40336f,#7558a5)!important}.status-viewer-card[data-status-style="midnight"]{background:linear-gradient(145deg,#151a38,#293a68)!important}.status-viewer-card>*:not(.status-viewer-mood){position:relative;z-index:2}.status-viewer-mood{position:absolute!important;inset:0!important;z-index:0!important;opacity:.58}.status-viewer-mood .mood-face{font-size:clamp(90px,24vw,190px)!important;opacity:.3!important}.status-viewer-caption{position:relative;z-index:2;max-width:95%;padding:12px 16px;border:1px solid #ffffff32;border-radius:15px;background:#07101fcc;color:#fff!important;text-align:center;text-shadow:0 1px 5px #0009;backdrop-filter:blur(9px)}.status-viewer-link-card{display:grid;grid-template-columns:minmax(80px,150px) 1fr auto;align-items:center;gap:10px;width:min(540px,100%);padding:10px!important;text-align:left!important;text-decoration:none!important}.status-viewer-link-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px}.status-viewer-link-copy{display:grid;gap:4px;min-width:0}.status-viewer-link-copy strong{color:#fff;font-size:13px}.status-viewer-link-copy small{overflow:hidden;color:#d4d9e8;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.status-viewer-link-card>b{color:#89e6ff;font-size:10px;white-space:nowrap}
@media(max-width:767px){.status-stage{min-height:190px}.status-stage:has(.status-upload-preview:not(.hidden)){min-height:220px}.status-tools{gap:6px}.status-tool{min-height:59px}.status-tool-icon{width:27px;height:27px}.status-viewer-link-card{grid-template-columns:86px minmax(0,1fr);}.status-viewer-link-card>b{grid-column:2}}
@media(prefers-reduced-motion:reduce){.status-stage,.status-tool{transition:none!important}}

.status-tool-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.status-tool-icon .icon-glint{stroke:#cbf6ff;stroke-width:1.5}.status-tool-icon .icon-fill{fill:#9af3ff;stroke:none}.status-icon-camera svg{filter:drop-shadow(0 0 4px #70e7ff85)}.status-icon-gallery svg{filter:drop-shadow(0 0 4px #f59ee585)}.status-icon-voice svg{filter:drop-shadow(0 0 4px #84ffd185)}
.brisa-payment-methods{display:grid;gap:10px;margin:3px 2px 14px;padding:14px;border:1px solid #8acfff38;border-radius:18px;background:linear-gradient(135deg,#172b46c9,#1b1935c9 58%,#142c3bbd);box-shadow:inset 0 1px #ffffff12,0 12px 32px #0003;backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%)}.brisa-payment-methods-heading h3{margin:0;color:#f0f6ff;font-size:14px}.brisa-payment-methods-heading p{margin:4px 0 0;color:#bfcae0;font-size:10px;line-height:1.45}.brisa-payment-method-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.brisa-payment-method-card{display:grid;align-content:start;gap:7px;min-width:0;padding:11px;border:1px solid #89cfff28;border-radius:14px;background:linear-gradient(140deg,#ffffff0a,#15213a9c)}.brisa-payment-method-head{display:flex;align-items:center;gap:8px;color:#eff5ff;font-size:12px}.brisa-payment-method-icon{display:grid;place-items:center;flex:0 0 29px;height:29px;border:1px solid #99d7ff42;border-radius:10px;background:linear-gradient(135deg,#1b66a544,#6733a344);font-weight:750}.brisa-payment-method-card input{width:100%;min-width:0;height:38px;padding:0 9px;border:1px solid #91caff38;border-radius:10px;background:#0b1224aa;color:#f3f7ff;font:inherit;font-size:10px;outline:none}.brisa-payment-method-card input:focus{border-color:#8ce4ff;box-shadow:0 0 0 3px #58bbff1c}.brisa-payment-method-card>small{min-height:27px;color:#aebbd1;font-size:9px;line-height:1.4}.brisa-payment-method-actions{display:flex;align-items:center;justify-content:space-between;gap:5px}.brisa-payment-method-actions button{min-height:30px;padding:6px 9px;border-radius:9px;font-size:10px}.brisa-payment-method-actions .text-button{color:#ffc2d0}.brisa-payment-method-status{margin:0;color:#aee9d0;font-size:10px;line-height:1.45;overflow-wrap:anywhere}
@media(max-width:440px){.brisa-payment-methods{padding:11px}.brisa-payment-method-grid{grid-template-columns:1fr}.brisa-payment-method-card{padding:10px}.brisa-payment-method-card>small{min-height:0}}
#statusScreen.status-compose-active{position:fixed!important;inset:0!important;z-index:1600!important;display:flex!important;width:100vw!important;height:100dvh!important;max-height:100dvh!important;min-height:0!important;box-sizing:border-box!important;gap:0!important;overflow:hidden!important;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)!important;border:0!important;border-radius:0!important;background:radial-gradient(ellipse at 15% 0%,#1769a044,transparent 48%),linear-gradient(155deg,#111b30f7,#0a0e1bf9 62%,#171128f7)!important;backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%)}
#statusScreen.status-compose-active .status-heading{display:none!important}
#statusScreen.status-compose-active .status-form:not(.hidden){display:grid!important;flex:1 1 auto!important;grid-template-rows:auto auto minmax(180px,1fr) auto auto auto auto auto auto!important;align-content:stretch!important;gap:12px!important;min-height:0!important;max-height:100%!important;overflow-y:auto!important;overscroll-behavior:contain!important;padding:12px 16px 18px!important;border:0!important;animation:status-compose-in .2s ease-out both}
#statusScreen.status-compose-active .status-compose-header{position:sticky;top:0;z-index:8;display:flex;align-items:center;justify-content:space-between;min-height:48px;margin:-12px -16px 0;padding:7px 14px;border-bottom:1px solid #9bdcff2b;background:#0c1425ef;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
#statusScreen.status-compose-active .status-compose-header h3{margin:0;color:#f4f8ff;font-size:17px}
#statusScreen.status-compose-active #cancelStatusCompose{width:40px;height:40px;border:1px solid #8bd2ff45;border-radius:50%;background:#ffffff0b;color:#eaf7ff;font-size:22px}
#statusScreen.status-compose-active .status-tools{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
#statusScreen.status-compose-active .status-tool{min-height:68px}
#statusScreen.status-compose-active .status-stage{min-height:180px;height:100%;max-height:38dvh}
#statusScreen.status-compose-active .status-style-panel{display:grid;gap:8px}
#statusScreen.status-compose-active .status-color-options{display:flex;flex-wrap:wrap;gap:8px}
#statusScreen.status-compose-active .status-record-row{min-height:22px}
#statusScreen.status-compose-active #publishStatusButton{position:sticky;bottom:0;z-index:6;min-height:50px;margin:0;padding-bottom:max(12px,env(safe-area-inset-bottom));box-shadow:0 -10px 25px #080b17aa}
@media(min-width:768px){#statusScreen.status-compose-active .status-form:not(.hidden){width:min(720px,100%);margin:0 auto;padding-left:24px!important;padding-right:24px!important}#statusScreen.status-compose-active .status-compose-header{margin-left:-24px;margin-right:-24px;padding-left:22px;padding-right:22px}#statusScreen.status-compose-active .status-stage{max-height:42dvh}}
@media(prefers-reduced-motion:reduce){#statusScreen.status-compose-active .status-form{animation:none!important}}
#paymentTopupAction:disabled{opacity:.56!important;filter:saturate(.55);cursor:not-allowed!important}#paymentTopupAction:disabled small{color:#bdc8da!important}
.voice-recording-bar{position:absolute!important;right:14px!important;bottom:42px!important;z-index:35!important;width:max-content!important;max-width:min(250px,75vw)!important;min-height:46px!important;margin:0!important;padding:6px 8px!important;border:1px solid #8adfff70!important;border-radius:999px!important;background:linear-gradient(120deg,#142d49f2,#261b48f2)!important;box-shadow:0 8px 28px #02061188,0 0 19px #42c8ff28,inset 0 1px #ffffff24!important;backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%)}.voice-mic-bubble{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border:1px solid #a9eaffb3;border-radius:50%;background:radial-gradient(circle at 35% 25%,#68e2ff,#237ed0 65%,#5850c4);color:white;box-shadow:0 0 13px #46cfff8a,inset 0 1px #ffffffa0;animation:voice-bubble-pulse 1.25s ease-in-out infinite}.voice-mic-bubble svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.voice-recording-bar.voice-preview-ready .voice-mic-bubble{animation:none;background:radial-gradient(circle at 35% 25%,#83f2c7,#17a989 70%,#13818d)}.voice-recording-bar .voice-recording-dot{width:6px;height:6px}.voice-recording-bar.voice-preview-ready .voice-recording-dot{display:none}.voice-recording-bar.voice-preview-ready .voice-lock-actions{display:flex}.voice-recording-bar.voice-preview-ready #voiceRecordingStatus{max-width:135px}.voice-recording-bar.voice-preview-ready #voiceSendNow{border-color:#59edbd;background:linear-gradient(135deg,#18b987,#1388a5);box-shadow:0 0 12px #3ce2b866}.send.voice-pending-send{background:linear-gradient(135deg,#27bf98,#167daa)!important;color:white!important}@keyframes voice-bubble-pulse{50%{transform:scale(1.08);box-shadow:0 0 19px #46cfffbb,inset 0 1px #ffffffa0}}
@media(max-width:767px){.voice-recording-bar{right:12px!important;bottom:calc(42px + env(safe-area-inset-bottom))!important;max-width:78vw!important}}
@media(prefers-reduced-motion:reduce){.voice-mic-bubble{animation:none!important}}
/* Publicación de estados: lienzo completo y animación visible también en estados de texto. */
#statusScreen.status-compose-active .status-stage-mood{opacity:.82!important;animation-play-state:running!important}
#statusScreen.status-compose-active .status-stage-mood *{animation-play-state:running!important}
#statusScreen.status-compose-active .status-stage-text{animation:status-text-glow 3.8s ease-in-out infinite alternate}
#statusScreen.status-compose-active .status-tools{position:sticky;top:48px;z-index:7;padding:5px 0 8px;background:linear-gradient(180deg,#0b1222f2 72%,transparent)}
#statusScreen.status-compose-active .status-tool{border-radius:16px;background:linear-gradient(145deg,#111a2eeb,#171b31e8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#statusScreen.status-compose-active .status-tool.active{background:linear-gradient(145deg,#174c70f2,#563181ed);box-shadow:0 0 20px #53caff38,inset 0 0 0 1px #d1f7ff55}
.status-viewer-card.status-text-view .status-viewer-body{position:relative;justify-content:center;overflow:hidden;padding:24px}
.status-viewer-card.status-text-view .status-viewer-caption{max-width:min(88%,560px);padding:0;border:0;border-radius:0;background:transparent!important;color:#fff;text-align:center;font-size:clamp(27px,7vw,46px);font-weight:750;line-height:1.24;text-shadow:0 3px 14px #0009;backdrop-filter:none;animation:status-text-glow 3.8s ease-in-out infinite alternate}
.status-viewer-card.status-text-view .status-viewer-caption a{color:inherit;text-decoration:underline;text-decoration-color:#ffffff90;text-underline-offset:3px}
.status-viewer-card.status-text-view .status-viewer-mood{opacity:.9!important}
.status-viewer-card.status-text-view .status-viewer-mood *{animation-play-state:running!important}
.status-view-controls{display:none!important}
@keyframes status-text-glow{from{filter:drop-shadow(0 0 0 #ffffff00);transform:scale(1)}to{filter:drop-shadow(0 0 13px #ffffff29);transform:scale(1.012)}}
@media(prefers-reduced-motion:reduce){#statusScreen.status-compose-active .status-stage-text,.status-viewer-card.status-text-view .status-viewer-caption{animation:none!important}}
/* Mantén el fondo de Contactos dentro de su marco y elimina el barrido que causaba una costura al entrar. */
#app>.sidebar>.contact-mood-scene{inset:0!important;width:auto!important;height:auto!important;max-width:100%!important;box-sizing:border-box!important;contain:paint!important;overflow:hidden!important;transition:none!important}
#app.contacts-only>.sidebar>.contact-mood-scene{opacity:1!important}
#app>.sidebar>.contact-mood-scene::before{inset:0!important;transform:none!important;animation:contact-scene-glow-soft 12s ease-in-out infinite alternate!important}
@keyframes contact-scene-glow-soft{from{opacity:.58}to{opacity:.88}}
#statusScreen.status-compose-active .status-tools,.status-tools{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px!important}
#statusScreen.status-compose-active .status-tool{min-width:0;min-height:66px;padding:6px 3px;font-size:clamp(8px,2.5vw,10px)}
.status-icon-animation{background:linear-gradient(145deg,#773ad1,#e34f9c)!important}.status-icon-animation svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;filter:drop-shadow(0 0 5px #f4a6ff99)}
@media(max-width:390px){#statusScreen.status-compose-active .status-tools,.status-tools{gap:3px!important}#statusScreen.status-compose-active .status-tool{min-height:60px;padding:5px 1px;font-size:8px}.status-tool-icon{width:25px;height:25px}}


/* Ajustes puntuales solicitados: el ánimo predeterminado no se pausa dentro del chat. */
#app.chat-open .chat .chat-header-mood-layer.mood-brisa-default,
#app.chat-open .chat .chat-header-mood-layer.mood-brisa-default .mood-face{animation-play-state:running!important;animation-iteration-count:infinite!important}

/* Editor de Estados: escribir directamente sobre el lienzo a pantalla completa. */
#statusScreen.status-compose-active .status-tools{grid-template-columns:repeat(4,minmax(0,1fr))!important}
#statusScreen.status-compose-active .status-compose-field{display:none!important}
#statusScreen.status-compose-active .status-stage{min-height:clamp(230px,38dvh,430px)!important;height:auto!important;max-height:none!important;flex:none!important}
#statusStage.status-composer .status-stage-text{display:none!important}
#statusStage .status-text-wrap{position:absolute;inset:10px;z-index:3;display:grid;place-items:center;pointer-events:none}
#statusStage .status-text-wrap textarea{width:100%;height:100%;min-height:0!important;max-height:100%;resize:none;overflow:auto;padding:16px 48px 16px 16px!important;border:0!important;border-radius:16px!important;background:transparent!important;box-shadow:none!important;color:#fff!important;text-align:center;font-size:clamp(23px,6vw,34px)!important;font-weight:750;line-height:1.25;text-shadow:0 2px 12px #000b;pointer-events:auto}
#statusStage .status-text-wrap textarea::placeholder{color:#ffffffb8;text-shadow:0 1px 8px #0008}
#statusStage .status-text-wrap textarea:focus{outline:0!important}
#statusStage .status-emoji-toggle{right:3px;bottom:3px;z-index:5;border-color:#ffffff75;background:#10182bbd;backdrop-filter:blur(12px)}
#statusStage #statusEmojiPicker{position:absolute;left:8px;right:8px;bottom:48px;z-index:6;max-height:112px;overflow:auto;border-color:#ffffff6b;background:#10182be8;backdrop-filter:blur(16px)}
.status-stage-camera{position:absolute;top:10px;right:10px;z-index:5;display:grid;place-items:center;width:42px;height:42px;border:1px solid #d8f5ff88;border-radius:50%;background:#10182bbd;color:white;font-size:21px;box-shadow:0 0 16px #52cfff55;backdrop-filter:blur(14px)}
.status-stage-camera:active{transform:scale(.94)}
#statusScreen.status-voice-recording .status-tools,
#statusScreen.status-voice-recording .status-style-panel,
#statusScreen.status-voice-recording .status-link-field,
#statusScreen.status-voice-recording .status-text-wrap,
#statusScreen.status-voice-recording .status-stage-camera{display:none!important}
#statusScreen.status-compose-active.status-voice-recording .status-stage{min-height:52dvh!important;height:52dvh!important;max-height:60dvh!important}
#statusScreen.status-voice-recording .status-record-row{display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px}
#stopStatusAudio{min-height:40px;padding:0 20px;border:1px solid #ffb6c9aa;border-radius:999px;background:linear-gradient(135deg,#d93469,#8938a7);color:#fff;font-weight:750;box-shadow:0 0 18px #f4589860}
#statusScreen.status-compose-active #statusMediaName{color:#d8efff;font-size:11px}
@media(max-width:390px){#statusScreen.status-compose-active .status-stage{min-height:clamp(210px,35dvh,350px)!important}#statusScreen.status-compose-active.status-voice-recording .status-stage{min-height:48dvh!important;height:48dvh!important}}

/* Editor de estados en formato vertical Brisa: lienzo de teléfono, controles integrados y paleta sobre el lienzo. */
#statusScreen.status-compose-active{left:50%!important;right:auto!important;width:min(100vw,480px)!important;transform:translateX(-50%)!important;}
#statusScreen.status-compose-active .status-form:not(.hidden){grid-template-rows:auto auto minmax(280px,1fr) auto auto auto!important;gap:9px!important;width:100%!important;max-height:100%!important;padding:8px 14px max(12px,env(safe-area-inset-bottom))!important;overflow-x:hidden!important;}
#statusScreen.status-compose-active .status-compose-header{margin:-8px -14px 0!important;padding:5px 13px!important;}
#statusScreen.status-compose-active .status-tools{position:relative!important;top:auto!important;padding:0 0 2px!important;}
#statusScreen.status-compose-active .status-tool{min-height:62px!important;}
#statusScreen.status-compose-active .status-stage{width:min(100%,calc((100dvh - 270px)*9/16))!important;min-width:min(100%,210px)!important;height:100%!important;max-height:calc(100dvh - 270px)!important;min-height:280px!important;aspect-ratio:9/16!important;justify-self:center!important;align-self:stretch!important;border-radius:24px!important;}
#statusScreen.status-compose-active .status-compose-field{display:none!important;}
#statusScreen.status-compose-active #statusMediaName{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;}
#statusScreen.status-compose-active #statusStage .status-style-panel{position:absolute!important;left:10px!important;right:10px!important;bottom:10px!important;z-index:9!important;display:grid!important;gap:5px!important;margin:0!important;padding:8px 10px!important;border-color:#d7edff50!important;border-radius:16px!important;background:linear-gradient(135deg,#0b1427d9,#211538d9)!important;box-shadow:0 8px 25px #03071466,inset 0 1px #ffffff24!important;backdrop-filter:blur(18px) saturate(140%)!important;-webkit-backdrop-filter:blur(18px) saturate(140%)!important;}
#statusScreen.status-compose-active #statusStage .status-style-heading{font-size:10px!important;}
#statusScreen.status-compose-active #statusStage .status-color-options{flex-wrap:nowrap!important;gap:10px!important;}
#statusScreen.status-compose-active #statusStage .status-color-chip{width:27px!important;height:27px!important;flex:0 0 27px!important;}
#statusScreen.status-compose-active #statusStage .status-mood-select-label{grid-template-columns:auto minmax(0,1fr)!important;font-size:9px!important;}
#statusScreen.status-compose-active #statusStage .status-mood-select-label select{height:30px!important;font-size:10px!important;}
#statusScreen.status-compose-active #statusStage .status-text-wrap{inset:16px 12px 150px!important;}
#statusScreen.status-compose-active #statusStage .status-text-wrap textarea{padding:12px 40px!important;font-size:clamp(24px,7vw,36px)!important;}
#statusScreen.status-compose-active #statusStage #statusEmojiPicker{bottom:154px!important;}
#statusScreen.status-compose-active #statusStageCamera{top:10px!important;right:10px!important;bottom:auto!important;z-index:8!important;}
#statusScreen.status-compose-active .status-record-row{min-height:20px!important;}
#statusScreen.status-compose-active #publishStatusButton{position:relative!important;min-height:48px!important;padding:10px!important;}
@media(max-height:700px){#statusScreen.status-compose-active .status-form:not(.hidden){grid-template-rows:auto auto minmax(220px,1fr) auto auto auto!important;gap:6px!important;padding-top:4px!important}#statusScreen.status-compose-active .status-stage{min-height:220px!important;max-height:calc(100dvh - 235px)!important}#statusScreen.status-compose-active .status-tool{min-height:54px!important}}
.unread-count{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:28px;height:24px;padding:0 7px;border:1px solid #d5f8ffb5;border-radius:999px;background:linear-gradient(135deg,#38c9d9,#6c63f1 58%,#bc5acb);color:#fff;font-size:10px;font-weight:850;line-height:1;letter-spacing:.1px;text-shadow:0 1px 4px #10153b88;box-shadow:0 0 12px #59d9ff55,inset 0 1px #ffffff99;animation:unread-bubble-pop .34s cubic-bezier(.2,.9,.3,1.3) both}.unread-count::after{content:"";position:absolute;right:5px;bottom:-4px;z-index:-1;width:8px;height:8px;transform:rotate(35deg);border-right:1px solid #d5f8ffb5;border-bottom:1px solid #d5f8ffb5;border-radius:0 0 4px 0;background:#7562e8}.conv-row .unread-count{margin-left:auto}@keyframes unread-bubble-pop{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.unread-count{animation:none}}
/* Brisa animated scenes inside the create-group and add-contact dialogs. */
.group-create-modal,.contact-add-modal{position:relative;isolation:isolate;border:1px solid #7edfff55!important;background:linear-gradient(145deg,#101c32f5,#14112af2 62%,#102637f2)!important;box-shadow:0 24px 85px #000b,0 0 34px #50cfff17!important}
.group-create-modal .modal-mood-scene,.contact-add-modal .modal-mood-scene{position:absolute;z-index:0;inset:0;overflow:hidden;border-radius:inherit;opacity:.86!important;pointer-events:none;background:radial-gradient(ellipse at 78% 15%,#277ec02c,transparent 42%),radial-gradient(ellipse at 20% 68%,#9a42b72a,transparent 47%),linear-gradient(155deg,#111525 0%,#0a0b13 62%,#11101b 100%)}
.group-create-modal .modal-mood-scene::before,.contact-add-modal .modal-mood-scene::before{inset:-10%;animation:contact-scene-glow 12s ease-in-out infinite alternate!important}
.group-create-modal .modal-mood-scene *,.contact-add-modal .modal-mood-scene *{animation-play-state:running!important}
.group-create-modal .modal-mood-content,.contact-add-modal .modal-mood-content{position:relative;z-index:1}
.group-create-modal header,.contact-add-modal header{background:linear-gradient(90deg,#10182be8,#14112ae5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.contact-add-modal form{padding:2px 1px 0}
.group-create-modal .group-contact-option,.contact-add-modal input:not([type=file]){backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.has-brisa-status{outline:2px solid #64ddff!important;outline-offset:2px;box-shadow:0 0 0 4px #a34dff52,0 0 17px #52cfff80!important;animation:brisa-status-ring-pulse 2.3s ease-in-out infinite;cursor:pointer}
@keyframes brisa-status-ring-pulse{0%,100%{filter:brightness(1);box-shadow:0 0 0 4px #a34dff42,0 0 12px #52cfff66!important}50%{filter:brightness(1.18);box-shadow:0 0 0 5px #a34dff70,0 0 21px #52cffff0!important}}
.usd-tip-notice{display:grid;gap:6px;margin:12px 0;padding:13px 14px;border:1px solid #75dfff55;border-radius:15px;background:linear-gradient(120deg,#174171bb,#3c2868bb 60%,#124c50aa);color:#edf7ff;box-shadow:inset 0 1px #ffffff25,0 0 20px #51c9ff1a;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.usd-tip-notice strong{font-size:13px}.usd-tip-notice span{color:#c6d9ee;font-size:11px;line-height:1.5}
@media(prefers-reduced-motion:reduce){.has-brisa-status{animation:none!important}.group-create-modal .modal-mood-scene *,.contact-add-modal .modal-mood-scene *{animation-duration:12s!important}}

/* Estados: espacio central para el texto; animaciones a los bordes y cancelación de notas. */
#statusScreen.status-compose-active #statusStageMood .mood-face{left:9%!important;top:15%!important;font-size:clamp(38px,10vw,58px)!important;opacity:.78!important}
#statusScreen.status-compose-active #statusStageMood .mood-effect{font-size:clamp(20px,6vw,30px)!important;opacity:.9!important}
#statusScreen.status-compose-active #statusStageMood .mood-effect-1{left:9%!important;top:43%!important}
#statusScreen.status-compose-active #statusStageMood .mood-effect-2{left:89%!important;top:31%!important}
#statusScreen.status-compose-active #statusStageMood .mood-effect-3{left:12%!important;top:77%!important}
#statusScreen.status-compose-active #statusStageMood .mood-effect-4{left:87%!important;top:72%!important}
#statusScreen.status-compose-active #statusStage[data-active-tool="text"] .status-text-wrap{inset:22px 24px 150px!important}
#statusScreen.status-compose-active #statusStage[data-active-tool="text"] .status-text-wrap textarea{text-align:center!important}
#cancelStatusAudio{min-height:40px;padding:0 16px;border:1px solid #d9e7ff55;border-radius:999px;background:#11192bd9;color:#f2f6ff;font-weight:700;backdrop-filter:blur(10px)}
#cancelStatusAudio:active{transform:scale(.96)}

/* Animaciones elegibles desde la barra superior y matiz propio en el fondo del estado. */
#statusScreen.status-compose-active #statusStage .status-animation-picker{position:absolute;z-index:12;top:58px;left:10px;right:10px;display:grid;grid-template-columns:repeat(7,minmax(34px,1fr));gap:5px;max-height:34dvh;overflow:auto;padding:9px;border:1px solid #a6e6ff66;border-radius:16px;background:#11182bf0;box-shadow:0 12px 35px #020613bb;backdrop-filter:blur(18px)}
#statusScreen.status-compose-active #statusStage .status-animation-picker.hidden{display:none!important}
.status-animation-choice{width:100%;min-height:38px;border:1px solid transparent;border-radius:10px;background:#ffffff0a;color:#fff;font-size:22px}
.status-animation-choice.selected{border-color:#a9eeff;background:#3b8fc777;box-shadow:0 0 12px #7de7ff66}
#statusScreen.status-compose-active #statusStage.status-mood-tinted{background-image:radial-gradient(ellipse at 18% 12%,color-mix(in srgb,var(--status-mood-glow) 55%,transparent),transparent 54%),linear-gradient(135deg,color-mix(in srgb,var(--status-a) 72%,var(--status-mood-a) 28%),color-mix(in srgb,var(--status-b) 68%,var(--status-mood-b) 32%))!important}

/* El compositor de estados llena el viewport; lienzo y botones ocupan la misma pantalla. */
#statusScreen.status-compose-active{width:100vw!important;height:100dvh!important;max-height:100dvh!important;padding:0!important;overflow:hidden!important}
#statusScreen.status-compose-active .status-form:not(.hidden){position:absolute!important;inset:0!important;display:block!important;width:100vw!important;height:100dvh!important;max-height:100dvh!important;min-height:0!important;margin:0!important;padding:0!important;overflow:hidden!important;border:0!important;border-radius:0!important}
#statusScreen.status-compose-active #statusStage{position:absolute!important;inset:0!important;width:100vw!important;height:100dvh!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;aspect-ratio:auto!important;justify-self:stretch!important;align-self:stretch!important;border:0!important;border-radius:0!important}
#statusScreen.status-compose-active .status-compose-header{position:absolute!important;top:calc(env(safe-area-inset-top) + 5px)!important;left:12px!important;right:12px!important;z-index:18!important;min-height:44px!important;margin:0!important;padding:3px 8px!important;border:0!important;border-radius:14px!important;background:#08101dc9!important;backdrop-filter:blur(12px)!important}
#statusScreen.status-compose-active .status-tools{position:absolute!important;top:calc(env(safe-area-inset-top) + 54px)!important;left:12px!important;right:12px!important;z-index:18!important;margin:0!important;padding:0!important;background:transparent!important}
#statusScreen.status-compose-active .status-tool{min-height:58px!important}
#statusScreen.status-compose-active #statusStage .status-text-wrap{inset:calc(env(safe-area-inset-top) + 132px) 22px calc(env(safe-area-inset-bottom) + 112px)!important}
#statusScreen.status-compose-active #statusStage .status-text-wrap textarea{padding:12px 40px!important;font-size:clamp(24px,7vw,38px)!important;text-align:center!important}
#statusScreen.status-compose-active #statusStage #statusEmojiPicker{bottom:calc(env(safe-area-inset-bottom) + 116px)!important;left:16px!important;right:16px!important}
#statusScreen.status-compose-active #statusStage .status-animation-picker{top:calc(env(safe-area-inset-top) + 116px)!important;left:12px!important;right:12px!important}
#statusScreen.status-compose-active #statusMediaName{display:none!important}
#statusScreen.status-compose-active .status-record-row{position:absolute!important;left:12px!important;right:12px!important;bottom:calc(env(safe-area-inset-bottom) + 68px)!important;z-index:18!important;min-height:42px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;padding:3px 8px!important;border-radius:14px!important;background:#08101dbb!important;backdrop-filter:blur(10px)!important}
#statusScreen.status-compose-active #publishStatusButton{position:absolute!important;left:12px!important;right:12px!important;bottom:calc(env(safe-area-inset-bottom) + 10px)!important;z-index:19!important;width:calc(100% - 24px)!important;min-height:50px!important;margin:0!important;border:1px solid #ffffff77!important;border-radius:16px!important;background:linear-gradient(110deg,#6f35d7ee,#2569d8ee)!important;box-shadow:0 5px 28px #040817aa,inset 0 1px #ffffff55!important;backdrop-filter:blur(12px)!important}
#statusScreen.status-compose-active #statusError{position:absolute!important;left:16px!important;right:16px!important;bottom:calc(env(safe-area-inset-bottom) + 64px)!important;z-index:20!important;margin:0!important}
#statusScreen.status-compose-active.status-voice-recording .status-record-row{bottom:calc(env(safe-area-inset-bottom) + 68px)!important}

/* Keep the sign-in and registration card centered in narrow app windows. */
#auth.auth-shell{width:100%;max-width:100vw;min-width:0;grid-template-columns:minmax(0,1fr);justify-items:center;align-items:center;box-sizing:border-box;padding-inline:max(14px,env(safe-area-inset-left))}#auth.auth-shell>.auth-card{width:min(390px,100%);max-width:100%;min-width:0;margin-inline:auto;justify-self:center}

/* Estado con foto: preview y publicación comparten el mismo encuadre y texto flotante. */
#statusScreen.status-compose-active #statusStage.status-composer:has(.status-upload-preview:not(.hidden)){align-items:center!important;justify-content:center!important}
#statusScreen.status-compose-active #statusStage.status-composer:has(.status-upload-preview:not(.hidden)) .status-text-wrap{inset:calc(env(safe-area-inset-top) + 132px) 18px calc(env(safe-area-inset-bottom) + 112px)!important;display:grid!important;place-items:center!important}
#statusScreen.status-compose-active #statusStage.status-composer:has(.status-upload-preview:not(.hidden)) .status-text-wrap textarea{width:100%!important;height:100%!important;min-height:0!important;margin:0!important;padding:12px 16px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;text-align:center!important;align-self:center!important;justify-self:center!important}
.status-viewer-card[data-status-kind="image"] .status-viewer-body,.status-viewer-card[data-status-kind="video"] .status-viewer-body{position:relative;justify-content:center;align-items:center;overflow:hidden;padding:0!important}
.status-viewer-card[data-status-kind="image"] .status-viewer-media,.status-viewer-card[data-status-kind="video"] .status-viewer-media{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;min-height:0!important;object-fit:cover;border-radius:0}
.status-viewer-card[data-status-kind="image"] .status-viewer-caption,.status-viewer-card[data-status-kind="video"] .status-viewer-caption{position:absolute;left:18px;right:18px;top:50%;z-index:5;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:transparent!important;color:#fff!important;text-align:center;font-size:clamp(25px,7vw,42px);font-weight:750;line-height:1.24;text-shadow:0 3px 16px #000d;backdrop-filter:none;transform:translateY(-50%);overflow-wrap:anywhere}
.status-viewer-card[data-status-kind="image"] .status-viewer-mood,.status-viewer-card[data-status-kind="video"] .status-viewer-mood{z-index:1!important}
/* El ánimo del encabezado sigue animado mientras el chat está a la vista. */
#app.chat-open .chat .chat-header-mood-layer,#app.chat-open .chat .chat-header-mood-layer *{animation-play-state:running!important}
#app.chat-open .mood-toggle.mood-active{opacity:1!important;filter:none!important;border-color:#d9f4ff!important;background:linear-gradient(135deg,#ffffff2a,#ffffff10)!important;box-shadow:0 0 18px var(--mood-glow,#73dfff88),inset 0 0 0 1px #ffffff26!important}
#app.chat-open .mood-toggle.mood-active .mood-button-face{opacity:1!important;filter:drop-shadow(0 0 7px #ffffffaa)}

/* Group and contact dialogs use the same animated scene, with readable glass cards. */
.group-create-modal,.contact-add-modal{overflow:hidden!important;background:linear-gradient(145deg,#10172be8,#111225e8 58%,#101b2be8)!important;backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%)}
.group-create-modal .modal-mood-scene,.contact-add-modal .modal-mood-scene{opacity:.52!important;filter:saturate(1.25)}
.group-create-modal .modal-mood-scene::after,.contact-add-modal .modal-mood-scene::after{content:"💬   ✨   💛   🎵   💸   🫧";position:absolute;inset:12% -8%;display:flex;align-items:center;justify-content:space-around;gap:12%;font-size:clamp(22px,5vw,38px);opacity:.27;white-space:normal;animation:modal-symbol-drift 14s ease-in-out infinite alternate;pointer-events:none}
.group-create-modal header,.contact-add-modal header{position:relative;z-index:2;isolation:isolate;overflow:hidden;background:linear-gradient(90deg,#111a2b66,#17132962)!important;backdrop-filter:blur(5px) saturate(135%);-webkit-backdrop-filter:blur(5px) saturate(135%);border-bottom:1px solid #c6eaff2e}
.group-create-modal header::before,.contact-add-modal header::before{content:"💬　✨　💛　🎵　💸　🫧";position:absolute;z-index:0;inset:0;display:flex;align-items:center;justify-content:space-around;gap:10px;overflow:hidden;white-space:nowrap;font-size:clamp(20px,4.5vw,34px);opacity:.34;filter:drop-shadow(0 0 9px #70d9ff66);animation:modal-symbol-drift 9s ease-in-out infinite alternate;pointer-events:none}
.group-create-modal header::after,.contact-add-modal header::after{content:"";position:absolute;z-index:0;inset:-80% -35%;background:linear-gradient(105deg,transparent 38%,#ffffff0c 48%,#9beaff21 52%,transparent 62%);transform:translateX(-28%);animation:modal-header-shimmer 7s ease-in-out infinite;pointer-events:none}
.group-create-modal header>*,.contact-add-modal header>*{position:relative;z-index:1}
.group-create-modal header h2,.contact-add-modal header h2{color:#f7f4ff;text-shadow:0 1px 12px #090b18,0 0 16px #74dfff45}
.group-create-modal header p,.contact-add-modal header p{color:#e2ddf4;text-shadow:0 1px 10px #080b18}
.profile-modal #profileForm label:has(#profileName),.profile-modal #profileForm label:has(#profilePhone){display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-items:stretch!important;gap:6px!important;min-width:0;font-size:13px!important;line-height:1.35!important}
.profile-modal #profileName,.profile-modal #profilePhone{display:block;width:100%;min-width:0;height:44px;min-height:44px;margin:0;padding:10px 12px;font-size:14px;line-height:1.25}
.group-create-modal form,.contact-add-modal form{position:relative;z-index:1}
.group-create-modal input.group-name-input,.contact-add-modal form input{background:#0b1020a8!important;border-color:#9adfff40!important;box-shadow:inset 0 1px #ffffff0b}
.group-contact-option{background:#0c1325a3!important;border-color:#b8dfff18!important;backdrop-filter:blur(10px)}
.group-contact-option:has(input:checked){background:linear-gradient(105deg,#45b8e82b,#a64ff22b)!important;border-color:#8de7ff9c!important;box-shadow:0 0 16px #55cfff24}
@keyframes modal-symbol-drift{0%{transform:translate3d(-2%,2%,0) rotate(-5deg)}100%{transform:translate3d(2%,-3%,0) rotate(5deg)}}
@keyframes modal-header-shimmer{0%,22%{transform:translateX(-28%);opacity:.25}65%,100%{transform:translateX(28%);opacity:.8}}

/* Status composer back control is a small floating arrow, not a full-width bar. */
#statusScreen.status-compose-active .status-compose-header{position:absolute!important;top:calc(env(safe-area-inset-top) + 8px)!important;left:12px!important;right:auto!important;z-index:30!important;width:44px!important;height:44px!important;min-height:44px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;backdrop-filter:none!important;box-shadow:none!important}
#statusScreen.status-compose-active .status-compose-header h3{display:none!important}
#statusScreen.status-compose-active .status-compose-header button{display:grid!important;place-items:center;width:28px!important;min-width:28px!important;height:32px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#cce8ff!important;font-size:23px!important;font-weight:500!important;line-height:1!important;box-shadow:none!important;text-shadow:0 0 8px #55bfff30!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}#statusScreen.status-compose-active .status-compose-header button:hover,#statusScreen.status-compose-active .status-compose-header button:focus-visible{border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;box-shadow:none!important;text-shadow:0 0 9px #60caffb0!important;outline:0!important}

/* Media is visible in the story preview; controls sit inside the preview card. */
#statusScreen.status-compose-active #statusStage.status-composer:has(.status-upload-preview:not(.hidden)){overflow:hidden!important}
#statusScreen.status-compose-active #statusStage.status-composer .status-upload-preview{z-index:0!important}
#statusScreen.status-compose-active #statusStage.status-composer .status-upload-preview-media{display:block!important;visibility:visible!important;opacity:1!important;transform-origin:center;transition:transform .12s linear}
.status-media-edit-controls{position:absolute;left:12px;right:12px;bottom:12px;z-index:12;display:grid;gap:8px;padding:9px 11px;border:1px solid #d7f5ff4a;border-radius:15px;background:#08101dc9;color:#f6f8ff;box-shadow:0 4px 18px #0007;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.status-compose-active .status-media-edit-controls{bottom:calc(env(safe-area-inset-bottom) + 84px)}
.status-media-edit-controls.hidden{display:none!important}.status-media-edit-controls label{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;font-size:11px;font-weight:700}.status-media-edit-controls output,.status-crop-control span{color:#b9edff;font-variant-numeric:tabular-nums}.status-media-edit-controls input[type=range]{grid-column:1/-1;width:100%;height:20px;margin:0;accent-color:#6ddaff}.status-trim-controls{display:grid;gap:6px}.status-trim-controls small{color:#c8d5e8;font-size:10px}.status-trim-controls.hidden,.status-crop-control.hidden{display:none!important}
#statusScreen.status-compose-active #statusStage.status-composer:has(.status-upload-preview:not(.hidden)) .status-stage-text{z-index:10!important;pointer-events:none}
.status-view-controls{display:none!important}

/* Subtle moving money and bank symbols behind the external tip choices. */
.external-tip-modal{position:relative!important;isolation:isolate;overflow:hidden}
.external-tip-modal>*{position:relative;z-index:1}.external-tip-modal>.tip-money-scene{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.tip-money-scene span{position:absolute;left:8%;top:18%;font-size:clamp(24px,7vw,42px);opacity:.17;filter:drop-shadow(0 0 9px #79dfff);animation:tip-money-float calc(7s + var(--money-index)*.7s) ease-in-out infinite alternate;animation-delay:calc(var(--money-index)*-.8s)}
.tip-money-scene span:nth-child(2){left:74%;top:25%}.tip-money-scene span:nth-child(3){left:16%;top:69%}.tip-money-scene span:nth-child(4){left:82%;top:73%}.tip-money-scene span:nth-child(5){left:47%;top:11%}.tip-money-scene span:nth-child(6){left:58%;top:81%}
.external-tip-modal header{background:#101a2aa8!important}
@keyframes tip-money-float{0%{transform:translate3d(0,12px,0) rotate(-12deg);filter:drop-shadow(0 0 5px #79dfff)}100%{transform:translate3d(8px,-13px,0) rotate(12deg);filter:drop-shadow(0 0 13px #d6aaff)}}
@media(prefers-reduced-motion:reduce){.group-create-modal .modal-mood-scene::after,.contact-add-modal .modal-mood-scene::after,.external-tip-modal::before{animation-duration:30s!important}}

/* Simplified status composer: three tools, native gallery from +, centered text and one publish arrow. */
.status-tools{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
#statusScreen.status-compose-active .status-tools{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
#statusScreen.status-compose-active .status-tool{min-height:58px!important;padding:6px 5px!important;font-size:10px!important}
#statusScreen.status-compose-active #statusGalleryButton,
#statusScreen.status-compose-active #statusStageCamera{display:none!important}
#statusScreen.status-compose-active .status-crop-control{display:none!important}
#statusScreen.status-compose-active .status-record-row{display:none!important}
#statusScreen.status-compose-active.status-voice-recording .status-record-row,
#statusScreen.status-compose-active .status-record-row:has(#cancelStatusAudio:not(.hidden)){display:flex!important}
#statusScreen.status-compose-active .status-record-row{left:12px!important;right:82px!important;bottom:calc(env(safe-area-inset-bottom) + 17px)!important;min-height:38px!important;padding:0!important;border:0!important;background:transparent!important;backdrop-filter:none!important}
#statusScreen.status-compose-active #statusRecordLabel{font-size:11px!important;text-shadow:0 1px 7px #000b}
#statusScreen.status-compose-active #cancelStatusAudio,
#statusScreen.status-compose-active #stopStatusAudio{min-height:36px!important;padding:0 12px!important}
#statusScreen.status-compose-active #publishStatusButton{position:absolute!important;left:auto!important;right:16px!important;bottom:calc(env(safe-area-inset-bottom) + 14px)!important;z-index:35!important;display:grid!important;place-items:center!important;width:58px!important;height:58px!important;min-width:58px!important;min-height:58px!important;margin:0!important;padding:0!important;border:1px solid #d9f5ffbd!important;border-radius:50%!important;background:linear-gradient(145deg,#8b42eb,#315ff1)!important;color:#fff!important;font-size:30px!important;font-weight:700!important;line-height:1!important;box-shadow:0 0 22px #4faeff66,inset 0 1px #ffffff72!important;backdrop-filter:blur(12px)!important}
#statusScreen.status-compose-active #publishStatusButton:disabled{opacity:.65!important}
#statusScreen.status-compose-active #statusError{left:14px!important;right:84px!important;bottom:calc(env(safe-area-inset-bottom) + 26px)!important;text-align:left!important}
#statusScreen.status-compose-active #statusStage .status-text-wrap{display:grid!important;place-items:center!important}
#statusScreen.status-compose-active #statusStage .status-text-wrap textarea{height:auto!important;min-height:48px!important;max-height:100%!important;align-self:center!important;justify-self:center!important;text-align:center!important;vertical-align:middle!important}
#statusScreen.status-compose-active #statusStage .status-media-edit-controls{bottom:calc(env(safe-area-inset-bottom) + 84px)!important}
#statusScreen.status-compose-active #statusStage .status-trim-controls{gap:4px!important}
#statusScreen.status-compose-active #statusStage .status-trim-controls label{font-size:10px!important}
#statusScreen.status-compose-active #statusStage .status-trim-controls input[type=range]{height:16px!important}

/* Keep the chat mood control visibly lit and interactive like its two neighboring actions. */
#app.chat-open .chat .mood-toggle:not(:disabled){opacity:1!important;filter:none!important;border-color:#c9edffb5!important;background:linear-gradient(145deg,#ffffff2b,#66bfff20)!important;color:#f4fbff!important;box-shadow:0 0 15px var(--mood-glow,#68dfff88),inset 0 1px #ffffff55!important;animation:brisa-action-glow 4.4s ease-in-out infinite}
#app.chat-open .chat .mood-toggle:not(:disabled):hover,
#app.chat-open .chat .mood-toggle[aria-expanded="true"]{transform:scale(1.06)!important;border-color:#e4faff!important;background:linear-gradient(145deg,#ffffff3d,#71caff32)!important;box-shadow:0 0 20px var(--mood-glow,#68dfffaa),inset 0 1px #ffffff70!important}
#app.chat-open .chat .mood-toggle[aria-expanded="true"] .mood-button-face{filter:drop-shadow(0 0 8px #ffffffcf)!important}
#app.chat-open .chat .mood-toggle:disabled{opacity:.4!important;animation:none!important}

/* The same floating money scene appears in the main propina dialog and external methods. */
#tipModal .modal{position:relative!important;isolation:isolate;overflow:hidden}
#tipModal .modal>*{position:relative;z-index:1}
#tipModal .modal>.tip-money-scene{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
#tipModal .modal>header{background:linear-gradient(120deg,#101a2acc,#17152dcc)!important}
@media(max-width:390px){#statusScreen.status-compose-active .status-tool{min-height:54px!important;font-size:9px!important}#statusScreen.status-compose-active #publishStatusButton{right:14px!important;width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important}}
@media(prefers-reduced-motion:reduce){#app.chat-open .chat .mood-toggle:not(:disabled){animation:none!important}}

/* Make only the chat header mood control read as active whenever it can be used. */
.chat-header #moodToggle:not(:disabled){opacity:1!important;visibility:visible!important;filter:none!important;border:1px solid #e4faff!important;background:linear-gradient(145deg,#48d5f2c9,#7658f0c7)!important;color:#fff!important;box-shadow:0 0 0 2px #70dfff3b,0 0 19px #55d9ffb8,inset 0 1px #ffffffb0!important;animation:mood-toggle-awake 2.8s ease-in-out infinite!important}
.chat-header #moodToggle:not(:disabled) svg,.chat-header #moodToggle:not(:disabled) .mood-button-face{filter:drop-shadow(0 0 7px #fff)!important}
.chat-header #moodToggle:not(:disabled):hover,.chat-header #moodToggle[aria-expanded="true"]{transform:scale(1.08)!important;border-color:#fff!important;background:linear-gradient(145deg,#6be7ffd9,#9a69ffd9)!important;box-shadow:0 0 0 3px #75e4ff4a,0 0 24px #64dbffed,inset 0 1px #fff!important}
@keyframes mood-toggle-awake{0%,100%{box-shadow:0 0 0 2px #70dfff30,0 0 13px #55d9ff80,inset 0 1px #ffffff9c}50%{box-shadow:0 0 0 3px #70dfff5c,0 0 22px #55d9ffd9,inset 0 1px #fff}}
@media(prefers-reduced-motion:reduce){.chat-header #moodToggle:not(:disabled){animation:none!important}}

/* Google sign-in keeps the trusted Google button centered in Brisa's auth card. */
.google-auth-section{display:grid;gap:7px;margin:0 0 14px}.google-signin-host{display:flex;justify-content:center;min-height:42px;width:100%;overflow:hidden}.google-signin-host>div{max-width:100%}.google-signin-host iframe{max-width:100%}.google-signin-unavailable{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:46px;border:1px solid #73d8ff78;border-radius:14px;background:linear-gradient(112deg,#16467488,#293c8588 52%,#15385899);color:#f5faff;font-size:12px;font-weight:700;box-shadow:0 6px 20px #080f264d,0 0 15px #3aaeff24,inset 0 1px #ffffff30}.google-signin-unavailable span:first-child{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#fff;color:#4285f4;font:700 15px Arial,sans-serif}.google-auth-hint{text-align:center;margin:0;color:#aaa0b8;font-size:9px;line-height:1.4}.auth-divider{display:flex;align-items:center;gap:10px;margin-top:5px;color:#8f87a4;font-size:9px}.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,#5d4c70,transparent)}

/* Brisa glass treatment for the tip dialog, with a subtle shimmer and floating money icons. */
#tipModal.overlay{background:rgba(4,8,20,.58);backdrop-filter:blur(8px) saturate(128%);-webkit-backdrop-filter:blur(8px) saturate(128%)}
#tipModal .modal{width:min(420px,calc(100vw - 30px));max-height:min(82dvh,720px);padding:21px;border:1px solid rgba(123,204,255,.48);border-radius:24px;background:linear-gradient(145deg,rgba(15,29,53,.92),rgba(22,24,51,.89) 58%,rgba(18,35,45,.91));box-shadow:0 22px 70px rgba(0,0,0,.48),0 0 28px rgba(75,171,255,.12),inset 0 1px rgba(255,255,255,.19);backdrop-filter:blur(22px) saturate(155%);-webkit-backdrop-filter:blur(22px) saturate(155%);color:#f3f7ff;animation:tip-glass-arrive .28s cubic-bezier(.2,.75,.25,1)}
#tipModal .modal::before{content:"";position:absolute;inset:-55% -65%;z-index:0;pointer-events:none;background:linear-gradient(115deg,transparent 44%,rgba(136,220,255,.075) 49%,rgba(199,164,255,.11) 51%,transparent 57%);transform:translateX(-34%) rotate(8deg);animation:tip-glass-shimmer 8s ease-in-out infinite}
#tipModal .modal>header{position:relative;z-index:1;margin:-2px -2px 16px;padding:0 0 13px;border-bottom:1px solid rgba(150,209,255,.15);background:transparent!important}
#tipModal .modal h2{color:#f4f7ff}
#tipModal .modal header p{max-width:34ch;color:#c4d2e8;font-size:12px;line-height:1.45}
#tipModal .modal>.close{border:1px solid rgba(171,211,255,.2);background:rgba(255,255,255,.08);color:#e9f4ff}
@keyframes tip-glass-arrive{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes tip-glass-shimmer{0%,20%{transform:translateX(-34%) rotate(8deg);opacity:.42}65%,100%{transform:translateX(34%) rotate(8deg);opacity:.8}}
@media(prefers-reduced-motion:reduce){#tipModal .modal,#tipModal .modal::before{animation:none!important}}


/* Accesos rápidos y opciones propias de Estados. */
#app>.sidebar>.brand .mobile-top-actions{justify-content:flex-end!important}
#app .mobile-top-actions #mobileMore.settings-shortcut{display:grid!important;place-items:center!important;font-size:0!important;letter-spacing:0!important;background:linear-gradient(135deg,#37236b,#123d77 65%,#087da0)!important;border:1px solid #70dfff9c!important;color:#effaff!important;box-shadow:0 0 18px #318dff48,inset 0 1px #ffffff48!important}
#app .mobile-top-actions #mobileMore.settings-shortcut svg{display:block!important;width:23px!important;height:23px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.mobile-bottom>#newChat.mobile-round-action{position:absolute!important;top:-60px!important;right:7px!important;z-index:80!important;display:grid!important;place-items:center!important;width:48px!important;height:48px!important;min-width:48px!important;margin:0!important;padding:0!important;border:1px solid #6edbffbd!important;border-radius:50%!important;background:linear-gradient(140deg,#742cff,#315aff 58%,#08bfff)!important;color:#fff!important;font-size:0!important;box-shadow:0 0 22px #168eff77,inset 0 1px #ffffff72!important;overflow:visible!important}
.mobile-bottom>#newChat.mobile-round-action svg{display:block!important;width:24px!important;height:24px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.mobile-bottom>#newChat.mobile-round-action:hover{transform:translateY(-2px) scale(1.04)!important;filter:brightness(1.08)!important}
.status-viewer-card>.status-viewer-menu{position:absolute;z-index:30;top:58px;right:54px;min-width:188px;padding:6px;border:1px solid #94dfff70;border-radius:14px;background:linear-gradient(145deg,#111d31f5,#171329f5);box-shadow:0 12px 32px #0009,0 0 18px #43aaff25;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.status-viewer-menu button{width:100%;min-height:42px;padding:9px 12px;border-radius:10px;background:linear-gradient(110deg,#8c2947a8,#5d2445a8);color:#fff;text-align:left;font-size:13px;font-weight:600}
.status-viewer-menu button:hover,.status-viewer-menu button:focus-visible{background:linear-gradient(110deg,#b83255,#762d58);outline:1px solid #ff9eb7}
.status-viewer-menu button:disabled{opacity:.55;cursor:wait}
.status-viewer-more{display:grid;place-items:center;flex:none;width:36px;height:36px;border:1px solid #ffffff40;border-radius:50%;background:#ffffff12;color:#fff;font-size:17px;letter-spacing:1px;box-shadow:0 2px 10px #0005}
.status-viewer-more:hover,.status-viewer-more[aria-expanded=true]{border-color:#a6eaff;background:#ffffff24;box-shadow:0 0 14px #47c7ff55}
@media(max-width:767px){.status-viewer-card>.status-viewer-menu{top:calc(58px + env(safe-area-inset-top));right:54px}.mobile-bottom>#newChat.mobile-round-action{right:8px!important;top:-59px!important}}
@media(min-width:768px){html.phone-preview .mobile-bottom>#newChat.mobile-round-action{right:8px!important;top:-59px!important}}
.mood-picker-grid .mood-choice-default{border-color:#76ddff99!important;background:linear-gradient(145deg,#2878b755,#754de855)!important;box-shadow:inset 0 0 0 1px #ffffff18,0 0 12px #60dfff30;animation:default-mood-choice-glow 2.8s ease-in-out infinite}
@keyframes default-mood-choice-glow{0%,100%{box-shadow:inset 0 0 0 1px #ffffff18,0 0 8px #60dfff25}50%{box-shadow:inset 0 0 0 1px #ffffff30,0 0 15px #60dfff60}}
@media(prefers-reduced-motion:reduce){.mood-picker-grid .mood-choice-default{animation:none}}
/* Captions on photo/video states sit at the bottom edge like a story caption. */
#statusStage.status-media-caption .status-text-wrap{inset:auto 12px 12px!important;z-index:10!important;display:block!important;height:auto!important;min-height:52px!important;max-height:32%!important;padding:0!important;pointer-events:none!important}
#statusStage.status-media-caption .status-text-wrap textarea{box-sizing:border-box!important;width:100%!important;min-height:52px!important;max-height:128px!important;padding:11px 48px 11px 13px!important;border:1px solid #ffffff38!important;border-radius:15px!important;background:linear-gradient(0deg,#050817e8,#050817b8)!important;color:#fff!important;text-align:left!important;font-size:clamp(15px,4vw,19px)!important;line-height:1.35!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;pointer-events:auto!important}
#statusStage.status-media-caption .status-style-panel{top:10px!important;bottom:auto!important}
.status-multi-count{position:absolute;top:12px;left:12px;z-index:14;padding:7px 10px;border:1px solid #ffffff68;border-radius:999px;background:#091222b8;color:#fff;font-size:11px;font-weight:750;box-shadow:0 4px 14px #0007;backdrop-filter:blur(10px)}
.status-viewer-card[data-status-kind="image"] .status-viewer-caption,.status-viewer-card[data-status-kind="video"] .status-viewer-caption{top:auto!important;bottom:14px!important;left:12px!important;right:12px!important;transform:none!important;width:auto!important;max-width:none!important;padding:12px 14px!important;border:1px solid #ffffff32!important;border-radius:14px!important;background:linear-gradient(0deg,#050817e8,#050817a8)!important;text-align:left!important;font-size:clamp(15px,4vw,20px)!important;line-height:1.4!important;backdrop-filter:blur(9px)!important;-webkit-backdrop-filter:blur(9px)!important}
.status-views-label{position:absolute!important;top:12px!important;right:12px!important;z-index:14!important;min-height:34px!important;padding:6px 11px!important;border:1px solid #ffffff60!important;border-radius:999px!important;background:#090e1b88!important;color:#fff!important;font-size:12px!important;font-weight:750!important;box-shadow:0 4px 15px #0006!important;backdrop-filter:blur(13px)!important;-webkit-backdrop-filter:blur(13px)!important}
.status-viewers-popover{position:absolute!important;top:54px!important;right:12px!important;z-index:16!important;width:min(310px,calc(100% - 24px))!important;max-height:min(45dvh,330px)!important;overflow:auto!important;padding:8px!important;border:1px solid #9cdbff69!important;border-radius:16px!important;background:linear-gradient(145deg,#0b1425ee,#171329ee)!important;box-shadow:0 14px 38px #0009!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
.status-viewers-popover.hidden{display:none!important}.status-viewers-popover .status-viewer-row{grid-template-columns:34px minmax(0,1fr) auto auto!important;gap:8px!important;min-height:42px}.status-viewers-popover .status-viewer-row .status-avatar{width:32px!important;height:32px!important}.status-viewer-reaction-star{color:#ffe985;font-size:18px;filter:drop-shadow(0 0 5px #ffe36b) drop-shadow(0 0 11px #fff2a0);animation:status-reaction-star-glow 1.5s ease-in-out infinite alternate}
.status-reaction-picker{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding:6px 4px 2px}.status-reaction-picker button{display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff35;border-radius:50%;background:#ffffff12;color:#fff;font-size:22px;box-shadow:0 3px 12px #0004;transition:transform .18s,border-color .18s,background .18s}.status-reaction-picker button:hover,.status-reaction-picker button.selected{transform:translateY(-2px) scale(1.08);border-color:#9ceaff;background:linear-gradient(145deg,#42c9ed55,#a556e655);box-shadow:0 0 16px #67dfff68}
.status-reaction-burst{position:absolute;left:50%;top:49%;z-index:18;display:grid;place-items:center;width:clamp(74px,22vw,118px);height:clamp(74px,22vw,118px);border:1px solid #ffffff66;border-radius:50%;background:radial-gradient(circle,#ffffff35,#b49cff18 58%,transparent 74%);font-size:clamp(48px,15vw,76px);filter:drop-shadow(0 0 17px #ffffffc7);pointer-events:none;animation:status-reaction-bloom 6s cubic-bezier(.2,.6,.3,1) both}
@keyframes status-reaction-bloom{0%{opacity:0;transform:translate(-50%,-50%) scale(.15) rotate(-20deg)}12%{opacity:1;transform:translate(-50%,-55%) scale(1.12) rotate(8deg)}28%{opacity:1;transform:translate(-50%,-62%) scale(.98) rotate(-6deg)}75%{opacity:.9;transform:translate(-50%,-85%) scale(.9) rotate(5deg)}100%{opacity:0;transform:translate(-50%,-120%) scale(.58) rotate(14deg)}}
@keyframes status-reaction-star-glow{from{transform:scale(.9);filter:drop-shadow(0 0 3px #ffe36b)}to{transform:scale(1.16);filter:drop-shadow(0 0 10px #fff2a0)}}
@media(prefers-reduced-motion:reduce){.status-reaction-picker button,.status-viewer-reaction-star{transition:none;animation:none}.status-reaction-burst{animation-duration:6s}}

/* Foto/video: el campo queda en el borde inferior, sin marco ni panel oscuro. */
#statusScreen.status-compose-active #statusStage.status-media-caption .status-text-wrap{inset:auto 14px calc(env(safe-area-inset-bottom) + 72px)!important;display:block!important;width:auto!important;height:auto!important;min-height:0!important;max-height:76px!important;padding:0!important;place-items:initial!important;pointer-events:none!important}
#statusScreen.status-compose-active #statusStage.status-media-caption .status-text-wrap textarea{box-sizing:border-box!important;width:100%!important;height:48px!important;min-height:48px!important;max-height:76px!important;margin:0!important;padding:5px 8px!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#fff!important;text-align:center!important;font-size:13px!important;font-weight:550!important;line-height:1.25!important;text-shadow:0 1px 4px #000b!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;pointer-events:auto!important;overflow-y:auto!important}
#statusScreen.status-compose-active #statusStage.status-media-caption .status-text-wrap textarea::placeholder{color:#ffffffc9!important;text-shadow:0 1px 4px #000b!important}
#statusScreen.status-compose-active #statusStage.status-media-caption~.status-record-row,#statusStage.status-media-caption~.status-compose-field{display:none!important}
.status-viewer-card[data-status-kind="image"] .status-viewer-caption,.status-viewer-card[data-status-kind="video"] .status-viewer-caption{left:14px!important;right:14px!important;bottom:12px!important;top:auto!important;transform:none!important;width:auto!important;max-width:none!important;max-height:76px!important;overflow:auto!important;padding:5px 8px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;text-align:center!important;font-size:13px!important;font-weight:550!important;line-height:1.25!important;text-shadow:0 1px 4px #000b!important}

/* Menú del estado: tres puntos luminosos y una sola acción discreta. */
.status-viewer-more{width:34px!important;height:34px!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;color:transparent!important;font-size:0!important;letter-spacing:0!important;overflow:visible!important}
.status-viewer-more::before{content:"•••";color:#f4f7ff;font-size:15px;letter-spacing:2px;text-shadow:0 0 7px #91e8ff,0 0 14px #63bfff;animation:status-more-dots-glow 1.8s ease-in-out infinite}
.status-viewer-more:hover,.status-viewer-more[aria-expanded=true]{border:0!important;background:transparent!important;box-shadow:none!important}
.status-viewer-card>.status-viewer-menu{min-width:0!important;padding:3px!important;border:0!important;border-radius:10px!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.status-viewer-menu button,.status-viewer-menu button:hover,.status-viewer-menu button:focus-visible{width:auto!important;min-height:28px!important;padding:4px 8px!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#fff!important;text-align:left!important;font-size:11px!important;font-weight:550!important;box-shadow:none!important;outline:0!important;text-shadow:0 1px 5px #000c!important}
.status-viewer-menu button:focus-visible{outline:1px solid #ffffff85!important}
@keyframes status-more-dots-glow{0%,100%{opacity:.72;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}}

/* El acceso flotante a Contactos comparte color y partículas con la barra. */
#app .mobile-bottom>#newChat.mobile-round-action{isolation:isolate!important;background:linear-gradient(140deg,var(--nav-mood-a,#742cff),var(--nav-mood-b,#315aff) 58%,var(--nav-mood-c,#08bfff))!important;border-color:color-mix(in srgb,var(--nav-mood-c,#6edbff) 76%,white)!important;color:#fff!important;box-shadow:0 0 22px color-mix(in srgb,var(--nav-mood-c,#168eff) 62%,transparent),inset 0 1px #ffffff72!important;animation:new-chat-mood-pulse 3.4s ease-in-out infinite}
#app .mobile-bottom>#newChat .new-chat-mood-layer{position:absolute!important;inset:0!important;z-index:0!important;overflow:hidden!important;border-radius:inherit!important;pointer-events:none!important;contain:layout paint!important}
#app .mobile-bottom>#newChat .new-chat-mood-layer::before{content:"";position:absolute;inset:-10%;background:radial-gradient(circle at 50% 48%,var(--mood-glow,#70e5ff77),transparent 72%);opacity:.72;animation:mood-aura-in .45s ease-out both}
#app .mobile-bottom>#newChat .new-chat-mood-layer .mood-face{left:50%!important;top:50%!important;z-index:1!important;font-size:15px!important;opacity:.38!important}
#app .mobile-bottom>#newChat .new-chat-mood-layer .mood-effect{z-index:1!important;font-size:10px!important;opacity:.78!important}
#app .mobile-bottom>#newChat>svg{position:relative!important;z-index:2!important;color:#fff!important;stroke:#fff!important;filter:drop-shadow(0 0 5px #ffffffaa)!important}
@keyframes new-chat-mood-pulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.13)}}

/* Selector rápido de ánimo al inicio de Configuración, fuera de Apariencia. */
.nav-mood-quick-settings{display:grid;gap:8px;margin:0 0 15px;padding:10px 11px;border:1px solid #8bdcff40;border-radius:14px;background:linear-gradient(110deg,#ffffff0b,#8f75ff0d);box-shadow:inset 0 1px #ffffff18}
.nav-mood-quick-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.nav-mood-quick-heading strong{color:#f5f7ff;font-size:12px}.nav-mood-quick-heading small{color:#b9c5da;font-size:9px}
.nav-mood-quick-strip{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 1px 5px;scrollbar-width:thin;scrollbar-color:#8bdcff55 transparent}
.nav-mood-choice{position:relative;display:grid;place-items:center;flex:0 0 35px;width:35px;height:35px;padding:0;border:1px solid #a4caff2b;border-radius:11px;background:linear-gradient(145deg,#ffffff10,#9cbaff08);color:#fff;font-size:20px;cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s}
.nav-mood-choice:hover{transform:translateY(-2px) scale(1.05);border-color:#9deaffaa;box-shadow:0 0 12px #64ceff50}
.nav-mood-choice.selected{border-color:#9beaff;background:linear-gradient(145deg,#3da8d955,#8658e955);box-shadow:0 0 13px #65dbff70,inset 0 0 0 1px #ffffff35;animation:default-mood-choice-glow 2.8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.status-viewer-more::before,#app .mobile-bottom>#newChat.mobile-round-action,.nav-mood-choice.selected{animation:none!important}}

/* Keep the chosen Brisa animation visible and moving inside the navigation bar. */
html #app .mobile-bottom[data-nav-mood],html.phone-preview #app .mobile-bottom[data-nav-mood]{isolation:isolate!important;overflow:visible!important;background:linear-gradient(112deg,var(--nav-mood-a),var(--nav-mood-b) 52%,var(--nav-mood-c))!important;background-size:240% 240%!important;animation:brisa-header-flow 9s ease-in-out infinite!important}
html #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer,html.phone-preview #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer{position:absolute!important;inset:0!important;z-index:0!important;display:block!important;overflow:hidden!important;border-radius:inherit!important;pointer-events:none!important;contain:layout paint!important}
html #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer::before,html.phone-preview #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer::before{inset:-18% -8%!important;background:radial-gradient(ellipse at 50% 55%,var(--nav-mood-glow),transparent 72%)!important;opacity:.58!important;animation:nav-mood-aura 5.4s ease-in-out infinite alternate!important}
html #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer::after,html.phone-preview #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer::after{content:"";position:absolute;top:-35%;bottom:-35%;left:-32%;width:24%;transform:skewX(-24deg);background:linear-gradient(90deg,transparent,#ffffff2e,transparent);animation:nav-mood-shimmer 6.2s ease-in-out infinite;pointer-events:none}
html #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer .mood-face,html.phone-preview #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer .mood-face{z-index:1!important;font-size:27px!important;opacity:.74!important;filter:drop-shadow(0 0 7px var(--nav-mood-glow))!important;animation-play-state:running!important;animation-iteration-count:infinite!important}
html #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer .mood-effect,html.phone-preview #app .mobile-bottom[data-nav-mood]>.mobile-bottom-mood-layer .mood-effect{z-index:1!important;font-size:15px!important;opacity:.96!important;filter:drop-shadow(0 0 6px var(--nav-mood-glow))!important;animation-play-state:running!important;animation-iteration-count:infinite!important}
html #app .mobile-bottom[data-nav-mood]>button:not(#newChat),html.phone-preview #app .mobile-bottom[data-nav-mood]>button:not(#newChat){position:relative!important;z-index:2!important}
@keyframes nav-mood-aura{from{opacity:.34;transform:translateX(-4%) scale(.94)}to{opacity:.72;transform:translateX(4%) scale(1.08)}}
@keyframes nav-mood-shimmer{0%,20%{left:-32%;opacity:0}35%{opacity:.7}66%{left:112%;opacity:.48}80%,100%{left:112%;opacity:0}}

/* Status viewers float in the corner without a card behind the list. */
html #app .status-viewers-popover,html.phone-preview #app .status-viewers-popover{position:absolute!important;top:54px!important;right:12px!important;z-index:40!important;display:grid!important;justify-items:stretch!important;gap:5px!important;width:min(290px,78vw,calc(100% - 24px))!important;max-height:min(48dvh,360px)!important;overflow:auto!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html #app .status-viewers-popover.hidden,html.phone-preview #app .status-viewers-popover.hidden{display:none!important}
html #app .status-viewers-popover .status-viewer-row,html.phone-preview #app .status-viewers-popover .status-viewer-row{display:grid!important;grid-template-columns:34px minmax(0,1fr) auto auto!important;align-items:center!important;gap:8px!important;min-height:36px!important;padding:1px 0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
html #app .status-viewers-popover .status-viewer-row strong,html #app .status-viewers-popover .status-viewer-row time,html.phone-preview #app .status-viewers-popover .status-viewer-row strong,html.phone-preview #app .status-viewers-popover .status-viewer-row time{color:#fff!important;text-shadow:0 1px 5px #000d,0 0 8px #0008!important}

/* Private handle editor inside Settings > My profile. */
#profileModal .private-handle>label{margin:0!important;color:#f3efff!important;font-size:12px!important;font-weight:700!important}
#profileModal .private-handle-edit{display:flex!important;align-items:center!important;gap:7px!important;min-height:42px!important;padding:0 11px!important;border:1px solid #8bdcff59!important;border-radius:12px!important;background:rgba(5,11,25,.48)!important;box-shadow:inset 0 1px #ffffff12!important}
#profileModal .private-handle-edit>span{color:#9ce9ff!important;font-size:14px!important;font-weight:750!important}
#profileModal .private-handle-edit input{flex:1!important;min-width:0!important;width:100%!important;margin:0!important;padding:8px 2px!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#fff!important;font-family:inherit!important;font-size:13px!important;font-weight:600!important;line-height:1.3!important}
#profileModal .private-handle-edit input:focus{border:0!important;outline:0!important;box-shadow:none!important}
#profileModal .private-handle-edit:focus-within{border-color:#90e8ff!important;box-shadow:0 0 0 2px #55bfff24,0 0 15px #58ceff26!important}

/* Lista de vistas más compacta y transparente; colores del estado solo al editar texto. */
html #app .status-viewers-popover,html.phone-preview #app .status-viewers-popover{top:48px!important;right:8px!important;width:min(220px,68vw,calc(100% - 16px))!important;max-height:min(30dvh,230px)!important;gap:2px!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html #app .status-viewers-popover .status-viewer-row,html.phone-preview #app .status-viewers-popover .status-viewer-row{grid-template-columns:25px minmax(0,1fr) auto auto!important;gap:6px!important;min-height:27px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
html #app .status-viewers-popover .status-viewer-row .status-avatar,html.phone-preview #app .status-viewers-popover .status-viewer-row .status-avatar{width:23px!important;height:23px!important;font-size:9px!important}
html #app .status-viewers-popover .status-viewer-row strong,html.phone-preview #app .status-viewers-popover .status-viewer-row strong{min-width:0!important;overflow:hidden!important;font-size:10px!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html #app .status-viewers-popover .status-viewer-row time,html.phone-preview #app .status-viewers-popover .status-viewer-row time{font-size:9px!important}
html #app .status-viewers-popover .status-viewer-reaction-star,html.phone-preview #app .status-viewers-popover .status-viewer-reaction-star{font-size:13px!important}
#statusStage.status-color-disabled .status-style-panel,#statusStage.status-color-disabled .status-color-options{display:none!important}
#statusStage.status-color-disabled{--status-color-control-opacity:0}
#statusStage.status-voice-note .status-stage-mood{display:none!important}

/* Efectos rápidos en fotos y videos del editor de estados. */
#statusStage.status-media-preview-active{background:#070b18!important;background-image:none!important}
#statusStage.status-media-preview-active::after{content:none!important;display:none!important}
#statusStage.status-media-preview-active .status-stage-mood{display:none!important}
.status-stage-media-effects-ready .status-upload-preview-media{touch-action:none;transition:filter .2s ease}
.status-media-effects{position:absolute;left:10px;right:10px;bottom:calc(env(safe-area-inset-bottom) + 80px);z-index:32;display:grid;gap:7px;max-height:min(33dvh,280px);overflow:auto;padding:9px;border:1px solid #b8eaff55;border-radius:17px;background:linear-gradient(145deg,#0a1327e8,#211536e8);box-shadow:0 12px 34px #0009,inset 0 1px #ffffff28;backdrop-filter:blur(16px) saturate(145%);-webkit-backdrop-filter:blur(16px) saturate(145%);animation:status-effects-rise .2s ease-out}
.status-media-effects.hidden{display:none!important}
.status-media-effects-heading{display:flex;align-items:center;justify-content:space-between;padding:0 3px 1px;color:#f3f7ff;font-size:12px}
.status-media-effects-close{display:grid;place-items:center;width:27px;height:27px;border:0;border-radius:50%;background:#ffffff15;color:#f3f7ff;font-size:20px}
.status-media-effects-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.status-media-effect{min-height:67px;align-content:start;padding:5px 4px}.status-media-effect-sample{flex:none}
.status-media-effect{display:grid;justify-items:center;align-content:center;gap:4px;min-width:0;min-height:48px;padding:4px 2px;border:1px solid #ffffff1b;border-radius:11px;background:#ffffff0b;color:#f4f5ff;font-size:9px;line-height:1.1;text-align:center}
.status-media-effect-sample{display:block;width:100%;height:44px;overflow:hidden;border-radius:7px;background:linear-gradient(135deg,#42d6e8,#7b47eb 55%,#f17ead);background-position:center;background-size:cover;box-shadow:inset 0 0 0 1px #ffffff35}.status-media-effect-sample.has-media-preview{background-size:cover;background-position:center}
.status-media-effect.selected{border-color:#9beaff;background:#48bdeb25;box-shadow:0 0 12px #61d9ff45,inset 0 0 0 1px #ffffff24}
.status-viewer-media[data-media-filter="vivo"]{filter:saturate(1.25) contrast(1.06) brightness(1.04)}
.status-viewer-media[data-media-filter="calido"]{filter:sepia(.18) saturate(1.18) hue-rotate(-8deg) brightness(1.05)}
.status-viewer-media[data-media-filter="frio"]{filter:saturate(1.08) hue-rotate(12deg) brightness(1.03)}
.status-viewer-media[data-media-filter="blanco-negro"]{filter:grayscale(1)}
.status-viewer-media[data-media-filter="sepia"]{filter:sepia(.72)}
.status-viewer-media[data-media-filter="vibrante"]{filter:saturate(1.55) contrast(1.08)}
.status-viewer-media[data-media-filter="suave"]{filter:contrast(.88) brightness(1.1) saturate(.86)}
.status-viewer-media[data-media-filter="drama"]{filter:contrast(1.38) saturate(1.18) brightness(.96)}
.status-viewer-media[data-media-filter="desvanecido"]{filter:contrast(.82) brightness(1.13) saturate(.72)}
.status-viewer-media[data-media-filter="noche"]{filter:brightness(.76) contrast(1.16) saturate(1.12)}
.status-viewer-media[data-media-filter="ensueno"]{filter:saturate(1.17) hue-rotate(-15deg) brightness(1.08)}
.status-viewer-media[data-media-filter="rosado"]{filter:sepia(.12) hue-rotate(-28deg) saturate(1.3)}
@keyframes status-effects-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.status-media-effects{animation:none}.status-media-effect,.status-upload-preview-media{transition:none!important}}


/* Controles recuperados del compositor y visualización de voz grabada. */
.status-tools,#statusScreen.status-compose-active .status-tools{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
.status-gallery-tool{min-width:0;min-height:58px;display:grid;justify-items:center;align-content:center;gap:5px;padding:5px 3px;border:1px solid #ffffff2a;border-radius:15px;background:linear-gradient(145deg,#17213a,#211638);color:#edf5ff;font-size:9px;font-weight:750;cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s}.status-gallery-tool .status-tool-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:9px;font-size:20px}.status-gallery-tool:active{transform:scale(.96)}
.status-color-palette{position:absolute;left:10px;right:82px;bottom:calc(env(safe-area-inset-bottom) + 70px);z-index:25;display:flex;align-items:center;gap:8px;overflow-x:auto;padding:7px 5px;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x;pointer-events:auto}.status-color-palette::-webkit-scrollbar{display:none}.status-color-swatch{width:27px;height:27px;min-width:27px;padding:0;border:2px solid #ffffff70;border-radius:50%;box-shadow:0 2px 7px #0008;transition:transform .15s,border-color .15s,box-shadow .15s}.status-color-swatch[aria-pressed=true]{border-color:#fff;transform:scale(1.17);box-shadow:0 0 0 2px #6fdfff,0 0 14px #59ceff75}#statusStage.status-color-disabled .status-color-palette{display:none!important}
#statusScreen.status-compose-active #statusStage.status-composer.status-mood-tinted .status-stage-mood,#statusScreen.status-compose-active #statusStage.status-composer.status-mood-tinted .status-stage-mood *{animation-play-state:running!important;animation-iteration-count:infinite!important}#statusScreen.status-compose-active #statusStage.status-animation-active .status-stage-mood{display:block!important;visibility:visible!important}#statusScreen.status-compose-active #statusStage.status-animation-active .status-stage-mood .mood-face{animation-play-state:running!important;animation-iteration-count:infinite!important;opacity:.8!important}
.status-voice-panel{position:absolute;inset:calc(env(safe-area-inset-top) + 126px) 12px calc(env(safe-area-inset-bottom) + 76px);z-index:28;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:clamp(15px,5vw,26px);border:1px solid #a8e8ff50;border-radius:25px;background:linear-gradient(145deg,#0d1838d9,#21143be0);box-shadow:0 12px 35px #02061566,inset 0 1px #ffffff28;backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);color:#f5f8ff;text-align:center}.status-voice-panel.hidden{display:none!important}.status-voice-heading{display:flex;align-items:center;gap:12px;text-align:left}.status-voice-heading>div{display:grid;flex:1;gap:4px}.status-voice-heading strong{font-size:16px}.status-voice-heading small{color:#becce5;font-size:11px}.status-voice-heading time{font-size:13px;font-variant-numeric:tabular-nums;color:#c9eaff}.status-voice-mic{width:46px;height:46px;display:grid;place-items:center;border:1px solid #7ee6ff88;border-radius:50%;background:linear-gradient(145deg,#1c8bb6,#6554d8);box-shadow:0 0 20px #5dd9ff55;font-size:22px}
.status-voice-waveform{min-height:66px;display:flex;align-items:center;justify-content:center;gap:3px;padding:10px;overflow:hidden;border:1px solid #ffffff1b;border-radius:18px;background:#050b1c55}.status-voice-waveform i{width:3px;height:var(--bar-height);max-height:58px;flex:none;border-radius:9px;background:linear-gradient(180deg,#91efff,#8b7bff 55%,#ea8dcf);opacity:.5;transform:scaleY(.22);transition:transform .12s ease,opacity .12s ease}.status-voice-waveform.active i{opacity:.95;animation:brisa-status-wave .65s ease-in-out var(--bar-delay) infinite alternate}@keyframes brisa-status-wave{from{transform:scaleY(.2)}to{transform:scaleY(1)}}.status-voice-actions{display:flex;justify-content:center;gap:10px}.status-voice-start{min-width:150px;min-height:48px;padding:0 18px;border:1px solid #a8eaff99;border-radius:999px;background:linear-gradient(135deg,#1e71bd,#6949d8);color:#fff;font-size:14px;font-weight:800;box-shadow:0 0 18px #54baff44}.status-voice-start:disabled{opacity:.62}
#statusScreen.status-compose-active .status-voice-panel .status-record-row{position:static!important;left:auto!important;right:auto!important;bottom:auto!important;display:flex!important;justify-content:center;align-items:center;gap:9px;min-height:36px!important;margin:0;padding:0!important;border:0!important;background:transparent!important}.status-voice-panel #statusRecordLabel{font-size:11px!important;color:#dcecff!important}.status-voice-panel #stopStatusAudio,.status-voice-panel #cancelStatusAudio{min-height:38px!important;padding:0 14px!important;border-radius:999px}.status-voice-preview{width:100%;height:42px;accent-color:#48c6f2}.status-voice-note #statusPreview{display:none!important}
.voice-recorder-waveform{height:28px;min-width:42px;display:flex;align-items:center;justify-content:center;gap:2px;overflow:hidden}.voice-recorder-waveform i{width:2px;height:var(--wave-height);max-height:24px;flex:none;border-radius:3px;background:linear-gradient(180deg,#95eaff,#a08aff);opacity:.42;transform:scaleY(.24)}.voice-recording-bar.voice-wave-active .voice-recorder-waveform i{opacity:.95;animation:brisa-chat-wave .56s ease-in-out var(--wave-delay) infinite alternate}@keyframes brisa-chat-wave{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
@media(max-width:390px){.status-gallery-tool{min-height:54px;font-size:8px}.status-color-palette{left:7px;right:76px;gap:6px}.status-color-swatch{width:24px;height:24px;min-width:24px}.status-voice-panel{inset:calc(env(safe-area-inset-top) + 116px) 8px calc(env(safe-area-inset-bottom) + 74px);gap:12px;padding:14px}.status-voice-waveform{gap:2px}.voice-recorder-waveform{min-width:30px}}


/* Chat message text: slightly larger for comfortable reading. */
html #messages .message .bubble{font-size:14px!important;line-height:1.5!important}


/* Message receipt stars: one for sent, two dim for delivered, two bright for read. */
#messages .stamp{display:flex;align-items:center;gap:5px}
#messages .message.mine .stamp{justify-content:flex-end}
#messages .message:not(.mine) .stamp{justify-content:flex-start}
#messages .message-receipt{display:inline-block;flex:none;white-space:nowrap;font-size:10px;line-height:1;letter-spacing:-1.5px;color:rgba(194,207,230,.48);transition:color .22s ease,text-shadow .22s ease,opacity .22s ease;opacity:.84}
#messages .message-receipt-delivered{color:rgba(194,207,230,.58);opacity:.92}
#messages .message-receipt-read{color:#79e5ff;opacity:1;text-shadow:0 0 5px #52d7ff9c,0 0 11px #51baff73;animation:message-stars-read .32s ease-out both}
@keyframes message-stars-read{0%{transform:scale(.78);filter:brightness(.8)}65%{transform:scale(1.2);filter:brightness(1.3)}100%{transform:scale(1);filter:brightness(1)}}
@media(prefers-reduced-motion:reduce){#messages .message-receipt-read{animation:none}}


/* Give the conversation its full canvas, with a denser Brisa illustration and roomier header. */
html #messages.messages:not(.has-chat-wallpaper){
  background-color:#0b1020!important;
  background-image:linear-gradient(180deg,#080d1a32,#090c1b42),url('/brisa-chat-pattern.svg'),radial-gradient(ellipse at 10% 4%,#347bc52c,transparent 45%),radial-gradient(ellipse at 92% 96%,#a142bd20,transparent 46%),linear-gradient(135deg,#0c1223,#0b0d1b 60%,#111020)!important;
  background-size:auto,360px 360px,auto,auto,auto!important;
  background-repeat:repeat,repeat,no-repeat,no-repeat,no-repeat!important;
  background-position:center,0 0,left top,right bottom,center!important;
  background-attachment:local,local,local,local,local!important;
}
html #app.chat-open .chat-header{height:82px!important;min-height:82px!important;padding:10px 18px!important}
html #app.chat-open .chat-header .contact-avatar{width:48px!important;height:48px!important}
html #app.chat-open .chat-header .header-copy strong{font-size:14px!important}
html #app.chat-open .chat-header .header-copy span{font-size:11px!important}
html #app.chat-open #messages.messages{min-height:0;gap:11px!important;padding:20px 18px 24px!important}
html #app.chat-open #messages .message{max-width:min(95%,52rem)!important;gap:9px!important}
html #app.chat-open #messages .message .bubble{min-width:78px;min-height:44px;padding:14px 17px!important;border-radius:20px 20px 20px 7px;font-size:17px!important;line-height:1.52!important}
html #app.chat-open #messages .message.mine .bubble{border-radius:20px 20px 7px 20px}
html #app.chat-open #messages .message-receipt{display:inline-flex;align-items:center;justify-content:center;min-width:19px;margin-left:3px;font-size:13px;font-weight:800;letter-spacing:-1.8px;color:rgba(220,230,247,.78);opacity:1}
html #app.chat-open #messages .message-receipt-delivered{color:rgba(220,230,247,.86);opacity:1}
html #app.chat-open #messages .message-receipt-read{color:#79e5ff;text-shadow:0 0 6px #52d7ffb0,0 0 13px #51baff8c}
html #app.chat-open #messages .content-card{width:min(370px,86vw)!important}
html #app.chat-open .composer-wrap{padding:13px 16px 16px!important}
html #app.chat-open .composer{min-height:56px!important;border-radius:19px!important;padding:6px 8px 6px 11px!important}
html #app.chat-open .composer input{font-size:16px!important}
html #app.chat-open .compose-action{width:39px;height:39px}
html #app.chat-open .send{width:43px;height:40px}
@media(max-width:650px){
  html #app.chat-open .chat{height:100dvh!important;min-height:0!important}
  html #app.chat-open .chat-header{height:calc(90px + env(safe-area-inset-top))!important;min-height:calc(90px + env(safe-area-inset-top))!important;padding:env(safe-area-inset-top) 14px 12px!important}
  html #app.chat-open .chat-header .contact-avatar{width:50px!important;height:50px!important}
  html #app.chat-open #messages.messages{flex:1 1 auto;gap:10px!important;padding:18px 14px 24px!important}
  html #app.chat-open #messages .message{max-width:96%!important}
  html #app.chat-open #messages .message .bubble{min-width:82px;min-height:46px;padding:14px 16px!important;font-size:17px!important;line-height:1.5!important}
  html #app.chat-open #messages .content-card{width:min(88vw,400px)!important}
  html #app.chat-open .composer-wrap{padding:12px 12px max(14px,env(safe-area-inset-bottom))!important}
}

/* Reproductor de voz: barra de progreso arrastrable, sin saltos de 10 segundos. */
.voice-note-track{--voice-progress:0%;position:relative;display:block;width:100%;height:24px;touch-action:none;cursor:pointer;outline:none;user-select:none;-webkit-user-select:none}
.voice-note-track::before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;transform:translateY(-50%);border-radius:999px;background:#d9ecff45;box-shadow:inset 0 1px 2px #0005}
.voice-note-track-fill{position:absolute;left:0;top:50%;width:var(--voice-progress);height:4px;transform:translateY(-50%);border-radius:999px;background:linear-gradient(90deg,#55cfff,#a879ff);box-shadow:0 0 8px #63d9ff72;pointer-events:none}
.voice-note-track-thumb{position:absolute;left:var(--voice-progress);top:50%;width:11px;height:11px;transform:translate(-50%,-50%);border:2px solid #f5fbff;border-radius:50%;background:#68d8ff;box-shadow:0 0 9px #61d9ff99;pointer-events:none}
.voice-note-track:focus-visible{filter:drop-shadow(0 0 5px #8fe7ff)}
.voice-note-footer{gap:6px}
.voice-note-current,.voice-note-duration{color:#dff5ff;font-size:9px;font-variant-numeric:tabular-nums;white-space:nowrap}
.voice-note-duration{margin-right:auto;color:#aebed4}
@media(max-width:767px){.voice-note-track{height:25px}.voice-note-track-thumb{width:12px;height:12px}}

/* El panel de agregar contacto conserva sus destellos, con una escena ligera para abrir sin tirones. */
#contactAddModal.overlay{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#contactAddModal .contact-add-modal{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#contactAddModal .contact-add-modal header,#contactAddModal .contact-add-modal input{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.contact-add-modal .contact-add-mood-scene::before{content:"";position:absolute;inset:-10%;background:radial-gradient(ellipse at 25% 20%,#59d8ff19,transparent 42%),radial-gradient(ellipse at 78% 76%,#bb6aff1b,transparent 48%);animation:contact-scene-glow 7s ease-in-out infinite alternate;pointer-events:none}
.chat-header .header-copy #contactStatus{display:block;max-width:min(48vw,400px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:767px){.chat-header .header-copy #contactStatus{max-width:min(42vw,230px)}}

/* La descripción del perfil se mueve solo si no cabe, con un recorrido suave e inmediato. */
.chat-header .header-copy #contactStatus{width:100%;position:relative}
.chat-header-description-track{display:inline-block!important;width:max-content!important;min-width:max-content!important;max-width:none!important;overflow:visible!important;text-overflow:clip!important;vertical-align:top;will-change:transform}
.chat-header #contactStatus.is-marquee .chat-header-description-track{animation:chat-header-description-marquee var(--description-marquee-duration,10s) linear 0s infinite both}
@keyframes chat-header-description-marquee{0%,10%{transform:translateX(0)}46%,54%{transform:translateX(var(--description-shift))}90%,100%{transform:translateX(0)}}

/* Las acciones del chat ya muestran su brillo desde el primer fotograma. */
html .chat-header .header-actions button:not(:disabled){animation-delay:0s!important}
html .chat-header #callBtn:not(:disabled)::after{animation-delay:-1.5s!important}
html .chat-header #tipBtn:not(:disabled)::after{animation-delay:-6s!important}