/* =============================================================
 ENTRE LÍNEAS · Emotional UI 9.0
 Mobile-first visual layer. No diary content is stored client-side.
 Loaded AFTER existing styles to preserve all V8 functionality.
 ============================================================= */
:root{
  --bg:#faf7f4;--card:#fffdfb;--ink:#332d37;--muted:#817985;
  --line:#eee5e3;--brand:#76536f;--brand2:#ba92a9;
  --danger:#ae586b;--warning:#98632c;--soft:#f6ebf1;
  --shadow:0 13px 36px rgba(76,51,71,.065);
  --v9-lilac:#f1e8f5;--v9-rose:#f6e7e4;--v9-sage:#e9f1eb;
  --v9-peach:#fff1e1;--v9-glow:rgba(190,132,167,.13);
  --v9-curve:cubic-bezier(.22,1,.36,1);
}
html{scroll-padding-top:100px;-webkit-text-size-adjust:100%}
body{
  min-height:100dvh;
  background:
    radial-gradient(ellipse 80% 460px at 98% 0%,rgba(245,217,226,.6),transparent 73%),
    radial-gradient(ellipse 540px 480px at -18% 47%,rgba(231,225,246,.40),transparent 72%),
    linear-gradient(180deg,#fbf8f7 0%,#faf7f4 55%,#fbf9f7 100%);
  color:var(--ink);overflow-x:clip;
  font-family:"Avenir Next",Avenir,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
::selection{background:#e5c9dd;color:#302633}
a,button,input,textarea,select{-webkit-tap-highlight-color:transparent}
button,input,textarea,select{font-family:inherit}
:where(a,button,input,textarea,select,summary):focus-visible{outline:3px solid #b28cbb;outline-offset:3px}
:where([hidden]){display:none!important}
.container{width:min(1120px,calc(100% - 36px))}
h1,h2,h3{color:var(--ink)}
h1,h2{letter-spacing:-.048em}
h1{line-height:1.055}
h2{font-size:clamp(27px,4vw,36px);line-height:1.16}
h3{letter-spacing:-.025em}
p{color:var(--muted);line-height:1.66}
.section{padding:36px 0 74px}
.brand{letter-spacing:-.05em;color:var(--brand)}
.brand small{letter-spacing:.12em;color:var(--muted)}
.app-main-nav,.public-nav{
  background:rgba(253,250,248,.84);border-bottom:1px solid rgba(236,221,226,.78);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)
}
.nav-links a,.nav-action{transition:background .2s,color .2s,transform .2s}
.nav-links a:active,.nav-action:active{transform:scale(.96)}
.btn{
  position:relative;isolation:isolate;overflow:hidden;white-space:normal;
  background:linear-gradient(135deg,#87647f 0%,#674b68 100%);
  min-height:49px;padding:12px 21px;border-radius:16px;
  font-size:14px;font-weight:780;letter-spacing:-.007em;
  box-shadow:0 7px 19px rgba(115,73,108,.16);
  transition:transform .26s var(--v9-curve),box-shadow .26s var(--v9-curve),filter .18s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(115,73,108,.19)}
.btn:active{transform:scale(.965);box-shadow:0 3px 8px rgba(115,73,108,.1)}
.btn.secondary{background:#f3e8ef;color:#654a66;box-shadow:none}
.btn.ghost{background:rgba(255,255,255,.68);color:#6a536c;border:1px solid #e9dce5;box-shadow:none}
.btn.danger{background:#f8e8e8;color:#a24d64;box-shadow:none}
.btn.small{min-height:38px;font-size:12px;border-radius:12px}
.btn:disabled{opacity:.55;transform:none;cursor:wait}
.v9-ripple{position:absolute;inset:auto;pointer-events:none;width:22px;height:22px;
 border-radius:50%;background:rgba(255,255,255,.34);transform:translate(-50%,-50%) scale(0);
 animation:v9-ripple .54s ease-out forwards;z-index:2}
@keyframes v9-ripple{to{opacity:0;transform:translate(-50%,-50%) scale(16)}}
.card,.diary-entry,.notif-item,.admin-panel{
  background:rgba(255,253,251,.96);border:1px solid rgba(237,226,229,.95);
  border-radius:25px;box-shadow:var(--shadow);
  transition:box-shadow .38s var(--v9-curve),transform .38s var(--v9-curve),border-color .25s ease;
}
.card{padding:25px}
.grid{gap:20px}
.card:hover,.diary-entry:hover,.admin-panel:hover{border-color:#e8d7e3;box-shadow:0 18px 44px rgba(77,50,73,.09)}
.badge{
  background:#f5eaf0;color:#795a78;font-weight:760;
  letter-spacing:.01em;padding:8px 12px;border-radius:999px;
}
.alert{border-radius:18px;box-shadow:var(--shadow);animation:v9-drop .34s var(--v9-curve) both}
.alert.success{background:#eef7f0;color:#3b6955}
.alert.error{background:#fff0f0;color:#964d5a}
.alert.warning{background:#fff7eb;color:#865c28}
@keyframes v9-drop{from{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:1}}
input:not([type=radio]):not([type=checkbox]),select,textarea{
  background:#fffdfd;border:1.5px solid #e9e0e4;border-radius:16px;
  padding:14px 15px;transition:border-color .2s,box-shadow .25s,background .2s;
}
input:not([type=radio]):not([type=checkbox]):focus,select:focus,textarea:focus{
  background:#fff;border-color:#ad87a6;box-shadow:0 0 0 4px rgba(172,129,168,.12);
}
input[type=radio],input[type=checkbox]{accent-color:#775371}
textarea{line-height:1.74;min-height:190px;font-size:16px}
label{color:#564657}
.field{margin-bottom:21px}
.form-wrap{margin:28px auto}
.metric{font-variant-numeric:tabular-nums;letter-spacing:-.055em;color:#624961}
.progress{background:#f3e9ed}
.progress > span{background:linear-gradient(90deg,#b99ab6,#856783);transition:width .8s var(--v9-curve)}
.empty{background:rgba(255,253,251,.76);border:1.5px dashed #e9d8e2;border-radius:23px;padding:40px 22px}
hr{border-color:#f0e9eb}
.diary-entry{padding:27px;margin-bottom:20px;position:relative}
.diary-entry::before{content:"“";position:absolute;top:0;right:17px;font-family:Georgia,serif;
 font-size:88px;color:#f1e8ee;line-height:1;pointer-events:none}
.diary-entry > *{position:relative}
.entry-number{font-size:17px;color:#5a425d}
.entry-top .muted{color:#8a7c89}
.entry-content{font-size:clamp(15px,2vw,17px);color:#48404b;line-height:1.9;letter-spacing:.003em}
.received-responses{border-top-color:#f0e3e9}
.received-response{background:linear-gradient(135deg,#f8f2f6,#faf7f4);border-color:#eee0e8;border-radius:18px;padding:17px}
.received-reply-text{font-family:Georgia,"Times New Roman",serif;font-size:16px;line-height:1.7}
.support-response-box{background:linear-gradient(150deg,#faf4f8,#fdfaf9);border-color:#efdfeb;border-radius:22px;padding:20px}
.reaction-grid{gap:9px}
.reaction-choice span,.reaction-btn,.safe-phrase{
  border-color:#ebdfe7;background:#fffefd;color:#755f73;
  transition:transform .22s var(--v9-curve),background .2s,border-color .2s,box-shadow .2s;
}
.reaction-choice span{padding:10px 13px;border-radius:16px}
.reaction-choice:hover span,.reaction-choice.selected span,.reaction-choice:has(input:checked) span{
  background:#f0e3f0;border-color:#bd9fba;color:#714a6e;box-shadow:0 5px 13px rgba(115,73,108,.09)
}
.reaction-choice:active span,.safe-phrase:active,.reaction-btn:active{transform:scale(.93)}
.reaction-choice:has(input:focus-visible) span{outline:3px solid #b28cbb;outline-offset:2px}
.safe-phrase{border-radius:12px;padding:8px 10px}
.prompt-card{
  position:relative;overflow:hidden;
  background:linear-gradient(123deg,#fefaf8 6%,#f8eff4 54%,#eee9f6 100%);
  border:1px solid #ebdbe7;
}
.prompt-card::after{content:"✧";position:absolute;right:-12px;top:-44px;font-size:180px;line-height:1;color:rgba(170,127,164,.1);pointer-events:none}
.prompt-card > *{position:relative;z-index:1}
.prompt-question{font-size:clamp(20px,3vw,26px);font-family:Georgia,"Times New Roman",serif;font-weight:600;line-height:1.43;letter-spacing:-.025em;color:#584459}
.writing-prompt-box{background:#f7eff4;border-color:#ebdce6;border-radius:20px;padding:20px}
.mood-search-box input{background:#fff!important}
.mood-options-panel{
  border:1px solid #e7d8e2;box-shadow:0 24px 60px rgba(54,34,56,.18);border-radius:22px;
  padding:10px;overscroll-behavior:contain;
  animation:v9-drop .22s var(--v9-curve) both;
}
.mood-option{border-radius:15px;transition:background .2s,transform .18s}
.mood-option:active{transform:scale(.985)}
.mood-option:hover,.mood-option.selected{background:#f7edf3;color:#795577}
.mood-group-title{background:#fffdfb;color:#896c86}
.mood-clear{background:#f5ebf0;color:#7c617a}
.v9-mood-shortcuts{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 0}
.v9-mood-shortcuts button{
  display:inline-flex;align-items:center;gap:5px;padding:9px 12px;
  background:#fff9fc;color:#7d647a;border:1px solid #eadde6;
  border-radius:999px;cursor:pointer;font-size:12px;font-weight:760;
  transition:transform .2s,background .2s,border-color .2s;
}
.v9-mood-shortcuts button:hover,.v9-mood-shortcuts button.is-picked{
  background:#efdfeb;border-color:#bb98b1;color:#684567
}
.v9-mood-shortcuts button:active{transform:scale(.93)}
.v9-writing-hint{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:8px 0 18px;font-size:12px;color:#887986
}
.v9-writing-hint strong{color:#77566f}
.story-strip-card{border-color:#ebd8e3!important;background:#fffafc!important;border-radius:26px!important}
.story-ring{box-shadow:0 7px 19px rgba(108,68,108,.12);transition:transform .35s var(--v9-curve),box-shadow .35s}
.story-bubble:hover .story-ring{transform:translateY(-4px) scale(1.03);box-shadow:0 11px 24px rgba(108,68,108,.18)}
.story-bubble:active .story-ring{transform:scale(.94)}
.entry-photo-button,.archive-photo{transition:transform .35s var(--v9-curve),box-shadow .35s;overflow:hidden}
.entry-photo-button:hover,.archive-photo:hover{transform:translateY(-3px)}
.entry-photo-button img,.archive-photo img{transition:transform .7s var(--v9-curve)}
.entry-photo-button:hover img,.archive-photo:hover img{transform:scale(1.035)}
.story-viewer{animation:v9-curtain .26s ease both;backdrop-filter:blur(8px)}
.story-viewer-shell{animation:v9-story-up .36s var(--v9-curve) both}
@keyframes v9-curtain{from{opacity:0}to{opacity:1}}
@keyframes v9-story-up{from{opacity:0;transform:scale(.965) translateY(14px)}to{opacity:1;transform:scale(1) translateY(0)}}
.story-viewer-progress span{background:#fff;transform-origin:left}
.notif-item{position:relative;padding:20px 22px 20px 27px;transition:transform .25s,box-shadow .3s,border-color .25s}
.notif-item::before{content:"✦";position:absolute;left:10px;top:20px;color:#b790b0;font-size:13px}
.notif-item.unread{box-shadow:inset 3px 0 0 #bd92b3,0 10px 24px rgba(76,51,71,.05)}
.notif-item:hover{transform:translateY(-2px);border-color:#ddc8d7}
.connection-ring{background:conic-gradient(#ad7d9f calc(var(--value)*1%),#f3e7ed 0);filter:drop-shadow(0 9px 24px rgba(119,79,119,.11))}
.connection-ring:before{background:#fffbfd}
.connection-ring .score{color:#694d69}
.chart-box{background:#fffdfc;border-color:#ebdfe7;border-radius:21px}
.chart-line{stroke:#a8789b}.chart-dot{fill:#a8789b}
.admin-panel{background:#fffdfb}
.admin-bar{background:linear-gradient(180deg,#c5a0bc,#805c7a)}
.admin-status.active{background:#ecf6ef;color:#397052}
.admin-privacy-note{border-color:#ecdee8;background:#f8eff5;color:#775a72}
.photo-lock,.story-locked-inline{background:#f8eff4;border-radius:17px}
.pwa-banner{border-radius:25px}
.scale label{transition:transform .2s,background .2s,border-color .2s;border-radius:14px}
.scale label:has(input:checked){background:#f1e1ef;border-color:#c7a7c0;color:#624961;transform:translateY(-2px)}
/* A calm, warm entry point: mobile and desktop home */
.hero{padding:90px 0 64px}
.hero h1{max-width:850px;color:#443749}
.hero .kicker{color:#a06b8d}
.quote-card{
  min-height:370px;border-radius:32px;padding:38px;
  background:linear-gradient(155deg,#836789,#6d576f 45%,#4c435e);
  box-shadow:0 24px 48px rgba(76,51,71,.19);position:relative;overflow:hidden
}
.quote-card::before{content:"✧";position:absolute;font-size:240px;top:-100px;right:-24px;opacity:.15;line-height:1}
.quote-card p{font-family:Georgia,"Times New Roman",serif;font-size:clamp(22px,3vw,28px);color:#fff5f8;line-height:1.55;position:relative}
.quote-card .alias{position:relative}
/* Home hero customized from the V8 dashboard */
.v9-welcome{
  position:relative;overflow:hidden;isolation:isolate;
  border-radius:30px;padding:34px 36px;margin-bottom:22px;
  background:linear-gradient(116deg,#fffdfb 10%,#f9eefa 68%,#f0e9f2 100%);
  border:1px solid #eedfe9;box-shadow:0 18px 50px rgba(98,65,96,.075);
  display:flex;align-items:center;justify-content:space-between;gap:18px
}
.v9-welcome::after{content:"✳";position:absolute;top:-84px;right:13%;font-size:240px;
 color:rgba(148,103,141,.075);pointer-events:none;z-index:-1}
.v9-welcome-copy{max-width:690px}
.v9-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.17em;font-weight:840;color:#996e90;display:inline-flex;gap:8px;align-items:center}
.v9-welcome h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(29px,4.6vw,48px);line-height:1.12;letter-spacing:-.035em;margin:12px 0 9px;font-weight:500}
.v9-welcome p{margin:0;color:#806c7d;font-size:14px}
.v9-alias{display:inline-flex;margin-top:12px;padding:7px 11px;border:1px solid #ebdce4;
 background:rgba(255,255,255,.65);border-radius:999px;color:#785f79;font-weight:800;font-size:12px}
.v9-welcome-action{flex:0 0 auto}
.v9-welcome .btn{white-space:nowrap}
.v9-intro{margin:5px 0 22px;display:flex;align-items:center;gap:13px}
.v9-intro-spark{width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;border-radius:17px;
 background:linear-gradient(145deg,#f1dfe9,#f4ecf6);color:#8c6789;font-size:23px}
.v9-intro strong{display:block;font:500 22px/1.25 Georgia,"Times New Roman",serif;color:#5a475e}
.v9-intro small{display:block;margin-top:3px;color:#93848d;font-size:12px}
.v9-quiet-note{text-align:center;color:#aa97a5;font-size:12px;margin:4px auto 8px}
/* Gentle appearance of on-screen elements; only if JS has set motion-ready */
body.v9-motion-ready [data-v9-reveal]:not(.v9-visible){opacity:0;transform:translateY(15px) scale(.991)}
[data-v9-reveal]{transition:opacity .55s var(--v9-curve),transform .55s var(--v9-curve)}
[data-v9-reveal].v9-visible{opacity:1;transform:none}
body.v9-transitioning main{opacity:.3;transform:translateY(6px);filter:blur(1px);transition:opacity .14s,transform .14s,filter .14s}
@view-transition{navigation:auto}
::view-transition-old(root){animation:.16s ease both v9-page-out}
::view-transition-new(root){animation:.3s var(--v9-curve) both v9-page-in}
@keyframes v9-page-out{to{opacity:.2;transform:translateY(-4px)}}
@keyframes v9-page-in{from{opacity:.2;transform:translateY(9px)}to{opacity:1;transform:none}}
.v9-toast{
  position:fixed;left:50%;bottom:calc(100px + env(safe-area-inset-bottom));z-index:1900;
  display:flex;align-items:center;gap:9px;width:max-content;max-width:calc(100vw - 42px);
  transform:translate(-50%,12px);opacity:0;pointer-events:none;
  padding:11px 17px;border-radius:999px;
  color:#fff;background:#604b65;box-shadow:0 15px 32px rgba(67,46,69,.25);
  font-size:13px;font-weight:800;transition:opacity .24s,transform .35s var(--v9-curve)
}
.v9-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.v9-scroll-top{position:fixed;right:18px;bottom:calc(101px + env(safe-area-inset-bottom));z-index:98;
 border:1px solid #ecdde5;background:#fffdfc;color:#815e78;border-radius:50%;width:44px;height:44px;
 box-shadow:var(--shadow);opacity:0;transform:translateY(12px);pointer-events:none;
 transition:opacity .2s,transform .24s;cursor:pointer;font-size:21px}
.v9-scroll-top.is-visible{opacity:1;transform:none;pointer-events:auto}
.v9-mobile-top{display:none}
@media (max-width:760px){
  html{scroll-padding-top:90px}
  body.app-user{padding-bottom:calc(107px + env(safe-area-inset-bottom))}
  body.app-user .container{width:calc(100% - 30px)}
  body.app-user .section{padding:20px 0 34px}
  body.app-user footer{padding:8px 0 16px}
  body.app-user footer .container{text-align:center;font-size:11px;line-height:1.55}
  body.app-user .card{padding:21px;border-radius:23px}
  body.app-user .diary-entry{padding:21px;border-radius:23px}
  .v9-mobile-top{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:sticky;top:0;z-index:99;min-height:66px;
    padding:10px 16px 9px;padding-top:calc(10px + env(safe-area-inset-top));
    background:rgba(251,247,247,.82);border-bottom:1px solid rgba(235,221,228,.7);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    transition:box-shadow .3s,background .3s;
  }
  .v9-mobile-top.is-scrolled{box-shadow:0 9px 24px rgba(69,46,69,.065);background:rgba(253,250,248,.96)}
  .v9-mobile-brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
  .v9-mobile-logo{width:37px;height:37px;display:grid;place-items:center;border-radius:14px;
    color:#fff;background:linear-gradient(145deg,#9c7298,#6d536e);font:22px Georgia,serif;
    box-shadow:0 6px 18px rgba(111,76,106,.17)}
  .v9-mobile-copy{display:block;min-width:0}
  .v9-mobile-copy strong{display:block;font-size:16px;letter-spacing:-.055em;color:#644d66;line-height:1.2}
  .v9-mobile-copy small{display:block;font-size:10px;letter-spacing:.01em;color:#988893;margin-top:3px}
  .v9-mobile-actions{display:flex;gap:8px;align-items:center}
  .v9-header-icon{
    width:39px;height:39px;border-radius:15px;display:grid;place-items:center;
    background:#fff9fc;border:1px solid #ede0e8;color:#87617f;text-decoration:none;
    position:relative;box-shadow:0 3px 12px rgba(96,61,89,.04);transition:transform .2s,background .2s
  }
  .v9-header-icon svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .v9-header-icon:active{transform:scale(.9);background:#f0e2ec}
  .v9-header-dot{position:absolute;width:8px;height:8px;right:6px;top:6px;border-radius:50%;background:#cf7896;border:2px solid #fff}
  .mobile-bottom-nav,
  .mobile-bottom-nav.admin-mode{
    position:fixed!important;top:auto!important;bottom:calc(9px + env(safe-area-inset-bottom))!important;
    left:12px;right:12px;display:grid;height:72px;min-height:72px;max-height:72px;
    margin:0;overflow:hidden;align-items:stretch;z-index:1000;
    border-radius:26px;background:rgba(255,252,252,.96);
    border:1px solid rgba(232,219,229,.92);
    box-shadow:0 18px 42px rgba(74,50,72,.14),0 3px 9px rgba(74,50,72,.035);
    backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)
  }
  .mobile-bottom-nav .mobile-nav-item{font-size:9px;gap:5px;padding:9px 0 8px;transition:color .25s}
  .mobile-bottom-nav .mobile-nav-item.active{color:#76536f}
  .mobile-bottom-nav .mobile-nav-item.active .mobile-nav-icon{transform:translateY(-2px)}
  .mobile-bottom-nav .mobile-nav-icon{width:38px;height:32px;border-radius:13px;transition:transform .3s var(--v9-curve),background .3s}
  .mobile-bottom-nav .mobile-nav-icon svg{width:21px;height:21px;stroke-width:1.8}
  .mobile-bottom-nav .mobile-nav-item.active .mobile-nav-icon{background:#f0e4ef}
  .mobile-bottom-nav .mobile-nav-item.active .mobile-nav-icon:before{display:none}
  .mobile-bottom-nav .mobile-nav-item.active:after{bottom:3px;width:12px;height:3px;background:#9c7298}
  .mobile-bottom-nav .mobile-nav-item:active{transform:scale(.9)}
  .mobile-nav-badge{background:#c97591}
  .v9-welcome{padding:25px 22px;border-radius:27px;margin-bottom:17px;display:block}
  .v9-welcome h1{font-size:clamp(28px,7.9vw,39px);margin:11px 0}
  .v9-welcome p{font-size:13px}
  .v9-welcome-action{margin-top:18px;display:block}
  .v9-welcome-action .btn{width:100%;justify-content:center}
  .v9-intro{margin:5px 0 18px}
  .v9-intro strong{font-size:20px}
  .grid{gap:14px}
  .metric{font-size:31px}
  .component-row{grid-template-columns:115px 1fr 55px;gap:8px;font-size:12px}
  .dim-row{grid-template-columns:100px 1fr 36px;font-size:12px;gap:8px}
  .story-strip-card{padding:17px!important}
  .story-strip{scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  .story-bubble{scroll-snap-align:start}
  .reaction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .reaction-choice span{display:flex;align-items:center;min-height:48px;font-size:12px;line-height:1.35;white-space:normal}
  .support-response-box{padding:16px}
  .reply-note-label{align-items:flex-start}
  .mood-options-panel{max-height:min(370px,45dvh)}
  .notif-item{padding:19px 17px 19px 25px}
  .section h2{line-height:1.15}
  .v9-scroll-top{right:15px}
  .story-viewer-shell{border-radius:0}
}
@media(max-width:400px){
  body.app-user .container{width:calc(100% - 24px)}
  .v9-mobile-top{padding-left:13px;padding-right:13px}
  .mobile-bottom-nav{left:6px;right:6px}
  .mobile-bottom-nav .mobile-nav-item{font-size:8px}
  .mobile-nav-icon svg{width:20px;height:20px}
  .reaction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:761px){
  .v9-scroll-top{bottom:28px}
  .card:hover{transform:translateY(-3px)}
}
@media(hover:none){.card:hover,.diary-entry:hover,.admin-panel:hover{transform:none}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  body.v9-motion-ready [data-v9-reveal]:not(.v9-visible){opacity:1!important;transform:none!important}
  @view-transition{navigation:none}
}


/* V9.1 safety fix: diary content should never depend on reveal animations */
.diary-entry,[data-v9-reveal].diary-entry,.entry-content,.entry-top,.received-responses{opacity:1 !important;transform:none !important;visibility:visible !important}

/* Connection · emotional brain view */
.brain-hero{display:grid;grid-template-columns:minmax(280px,1fr) minmax(300px,1.12fr);gap:22px;overflow:hidden;position:relative;background:
 radial-gradient(circle at top left,rgba(248,229,238,.95),transparent 42%),
 radial-gradient(circle at bottom right,rgba(217,241,245,.9),transparent 38%),
 linear-gradient(135deg,#fffdfc,#fbf7fa)}
.brain-hero:before{content:"";position:absolute;inset:auto -70px -100px auto;width:220px;height:220px;border-radius:50%;background:rgba(235,208,224,.25);filter:blur(10px);pointer-events:none}
.brain-hero-copy{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center}
.brain-hero-copy h2{font-size:clamp(30px,4vw,44px);line-height:1.02;margin-bottom:10px}
.brain-meta-row{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 6px}
.brain-chip{min-width:120px;padding:12px 13px;border-radius:16px;background:rgba(255,255,255,.72);border:1px solid #ead9e6;box-shadow:0 10px 30px rgba(94,68,93,.05)}
.brain-chip strong{display:block;font-size:17px;color:#583f5c}.brain-chip span{display:block;margin-top:4px;font-size:12px;color:#8f7b8d}
.brain-visual{position:relative;min-height:430px;display:grid;place-items:center;perspective:1100px;--brain-rx:0deg;--brain-ry:0deg;--brain-s:1}
.brain-orb{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}
.brain-orb-back{width:310px;height:310px;background:radial-gradient(circle,#f1d9e7 0%,rgba(241,217,231,.18) 58%,transparent 74%);opacity:.88;transform:translate(-18px,8px)}
.brain-orb-front{width:260px;height:260px;background:radial-gradient(circle,#dcedf4 0%,rgba(220,237,244,.08) 56%,transparent 76%);transform:translate(38px,-24px)}
.brain-shell{position:relative;width:min(100%,390px);aspect-ratio:1/1;display:grid;place-items:center;transform-style:preserve-3d;transform:rotateX(var(--brain-rx)) rotateY(var(--brain-ry)) scale(var(--brain-s));transition:transform .28s ease, filter .28s ease;filter:drop-shadow(0 28px 40px rgba(86,61,89,.14))}
.brain-shell:before{content:"";position:absolute;inset:8% 9%;border-radius:38% 42% 40% 36% / 42% 38% 44% 40%;background:linear-gradient(135deg,rgba(255,255,255,.62),rgba(255,255,255,.24));backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.65);z-index:0}
.brain-svg{position:relative;width:100%;height:100%;z-index:1;overflow:visible}
.brain-outline{fill:url(#brainGlow);stroke:#d8becd;stroke-width:1.2;filter:drop-shadow(0 12px 20px rgba(118,89,113,.08))}
.brain-ridge{fill:none;stroke:#cdb1c2;stroke-width:1.25;stroke-linecap:round;opacity:.9}
.brain-link{fill:none;stroke:#a07e98;stroke-width:1;stroke-linecap:round;stroke-dasharray:0 0;opacity:.48}
.brain-core{fill:url(#brainCore);stroke:#cda6bf;stroke-width:1.1}
.brain-node-halo{fill:rgba(255,255,255,.42);stroke:none;opacity:.48}
.brain-node-dot{fill:#b57f9f;stroke:#fff;stroke-width:1.1;filter:drop-shadow(0 6px 10px rgba(84,58,83,.18))}
.brain-node:nth-of-type(odd) .brain-node-dot{fill:#7db1b8}
.brain-score-core{position:absolute;z-index:2;display:grid;place-items:center;text-align:center;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffffff 0%,#f6edf2 65%,#eddbe5 100%);border:1px solid #e8d2df;box-shadow:0 16px 36px rgba(86,61,89,.14)}
.brain-score-core span{display:block;font-size:34px;line-height:1;font-weight:900;color:#5c435f}.brain-score-core small{display:block;margin-top:6px;font-size:12px;color:#8f7b8d;max-width:84px;line-height:1.25}
.brain-node-tags{position:absolute;inset:auto 0 0 0;display:flex;flex-wrap:wrap;gap:9px;justify-content:center;z-index:3;padding:0 10px 6px}
.brain-tag{border:1px solid #ead8e3;background:rgba(255,255,255,.78);color:#5b485b;border-radius:999px;padding:9px 12px;display:inline-flex;align-items:center;gap:8px;cursor:pointer;backdrop-filter:blur(8px);transition:transform .18s ease, box-shadow .18s ease, background .18s ease}
.brain-tag:hover,.brain-tag:focus-visible{transform:translateY(-2px);box-shadow:0 12px 22px rgba(87,63,88,.1);background:#fff}
.brain-tag strong{font-size:12px}.brain-tag span{font-size:14px}
.brain-tooltip{position:absolute;top:18px;right:18px;z-index:3;width:min(220px,72%);padding:13px 14px;border-radius:18px;background:rgba(255,255,255,.84);border:1px solid #ead8e3;backdrop-filter:blur(10px);box-shadow:0 12px 28px rgba(87,63,88,.1)}
.brain-tooltip strong{display:block;color:#5d455f;font-size:14px}.brain-tooltip span{display:block;margin-top:5px;color:#8f7b8d;font-size:12px;line-height:1.45}
.brain-stats-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.brain-mini-stat{padding:13px;border-radius:16px;background:linear-gradient(180deg,#fffdfd,#f8f0f5);border:1px solid #efdee8}.brain-mini-stat strong{display:block;font-size:24px;line-height:1;color:#5c435f}.brain-mini-stat span{display:block;margin-top:5px;font-size:12px;color:#8f7b8d}
.brain-layer-row{padding:14px 0;border-bottom:1px solid #f1e5ec}.brain-layer-row:last-child{border-bottom:0;padding-bottom:0}
.brain-layer-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:7px}.brain-layer-head strong{font-size:14px;color:#5b485b}.brain-layer-head span{font-size:12px;color:#8f7b8d}
.brain-layer-row small{display:block;margin-top:7px;color:#8f7b8d;line-height:1.45}
.brain-meter{height:10px;border-radius:999px;background:#f5eaf0;overflow:hidden}.brain-meter span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#c58fb0,#7eaeb6)}
@media (max-width:980px){
  .brain-hero{grid-template-columns:1fr}
  .brain-visual{min-height:400px}
}
@media (max-width:760px){
  .brain-hero{padding:18px !important}
  .brain-meta-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .brain-chip{min-width:0}
  .brain-visual{min-height:380px}
  .brain-tooltip{position:static;width:100%;max-width:none;margin-top:14px}
  .brain-node-tags{position:static;padding:12px 0 0;justify-content:flex-start}
  .brain-stats-strip{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion: reduce){
  .brain-shell,.brain-tag{transition:none !important}
}


/* Brain V9.2 polish */
.brain-view-switch{display:inline-flex;gap:6px;padding:5px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid #ead8e3;margin:10px 0 14px;backdrop-filter:blur(8px)}
.brain-view-btn{border:0;background:transparent;color:#886f82;padding:8px 13px;border-radius:999px;font-weight:800;cursor:pointer;transition:.18s ease}
.brain-view-btn.is-active{background:linear-gradient(135deg,#f1dfe9,#e7f2f4);color:#553f58;box-shadow:0 8px 18px rgba(90,65,93,.09)}
.brain-story-panels{position:relative;min-height:96px;margin-bottom:8px}
.brain-story-panel{display:none;padding:15px 16px;border-radius:18px;background:rgba(255,255,255,.62);border:1px solid #ead8e3;box-shadow:0 12px 28px rgba(87,63,88,.06)}
.brain-story-panel.is-active{display:block;animation:v9-fade-up .28s ease}
.brain-story-panel strong{display:block;color:#5d455f;font-size:16px}.brain-story-panel p{margin:7px 0 0;color:#7f6c7b;line-height:1.6}
@keyframes v9-fade-up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.brain-particles{position:absolute;inset:6% 8%;pointer-events:none;z-index:1}
.brain-particle{position:absolute;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.75);box-shadow:0 0 0 6px rgba(255,255,255,.1),0 0 22px rgba(204,169,192,.45);animation:brain-float 7s ease-in-out infinite}
.brain-particle:after{content:"";position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(135deg,#f4dfe9,#dff1f4)}
.p1{left:13%;top:28%;animation-delay:.2s}.p2{left:76%;top:22%;animation-delay:1.1s}.p3{left:22%;top:70%;animation-delay:2.5s}.p4{left:68%;top:75%;animation-delay:1.8s}.p5{left:50%;top:14%;animation-delay:3.1s}.p6{left:38%;top:86%;animation-delay:2.1s}.p7{left:86%;top:50%;animation-delay:4s}.p8{left:8%;top:52%;animation-delay:3.4s}
@keyframes brain-float{0%,100%{transform:translate3d(0,0,0) scale(.92);opacity:.72}50%{transform:translate3d(0,-10px,0) scale(1.08);opacity:1}}
.brain-link{stroke-dasharray:1.8 3.2;animation:brain-synapse 5.2s linear infinite;opacity:.62}
@keyframes brain-synapse{from{stroke-dashoffset:22}to{stroke-dashoffset:0}}
.brain-shell:after{content:"";position:absolute;inset:12% 14%;border-radius:40% 45% 44% 38% / 48% 40% 42% 45%;border:1px solid rgba(255,255,255,.48);z-index:0;transform:translateZ(22px)}
.brain-visual[data-brain-tilt]{transform-style:preserve-3d}
.brain-visual .brain-shell,.brain-visual .brain-tooltip,.brain-visual .brain-node-tags{will-change:transform}
.brain-analytic-overlay{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .24s ease;z-index:2}
[data-brain-card][data-brain-mode="analytic"] .brain-analytic-overlay{opacity:1}
[data-brain-card][data-brain-mode="analytic"] .brain-node-tags{opacity:.78}
.brain-label{position:absolute;transform:translate(-50%,-50%);padding:6px 8px;border-radius:12px;background:rgba(255,255,255,.8);border:1px solid #ead8e3;box-shadow:0 10px 18px rgba(87,63,88,.08);text-align:center;min-width:70px}
.brain-label span{display:block;font-size:10px;color:#8f7b8d;line-height:1.1}.brain-label strong{display:block;margin-top:3px;font-size:12px;color:#5d455f}
@media (max-width:760px){
  .brain-story-panels{min-height:0}
  .brain-label{min-width:58px;padding:5px 7px}
  .brain-label span{font-size:9px}
  .brain-label strong{font-size:11px}
}
@media (prefers-reduced-motion: reduce){
  .brain-link,.brain-particle,.brain-story-panel.is-active{animation:none !important}
}

/* V9.3: los módulos de conexión se renderizan aun si JS falla */
body.v9-motion-ready .brain-hero,
body.v9-motion-ready .brain-waiting,
.brain-hero, .brain-waiting {
  opacity:1!important; transform:none!important; visibility:visible!important;
}
.brain-waiting{display:grid;grid-template-columns:minmax(200px,360px) 1fr;gap:22px;align-items:center;
 background:linear-gradient(145deg,#fffdfc,#f6ecf3);overflow:hidden}
.brain-waiting .brain-visual{min-height:280px}
.brain-waiting-copy{padding:16px}
.brain-waiting-copy h2{margin-top:16px}
.brain-shell-preview{width:min(100%,270px)}
@media(max-width:760px){
 .brain-waiting{grid-template-columns:1fr}
 .brain-waiting .brain-visual{min-height:240px}
 .brain-waiting-copy{padding:0}
}
