@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:root{--bg:#f7f8fa;--white:#fff;--text:#111318;--muted:#68717d;--line:#e4e7eb;--blue:#6db2c8;--pink:#ed9d9c;--blue-soft:#eef4ff;--pink-soft:#fff1f6;--radius:18px;--side:214px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}button{cursor:pointer}.app{min-height:100vh}.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.eyebrow{font-size:10px;letter-spacing:.09em;color:#969da7;font-weight:700}.hidden{display:none!important}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--side);background:#fff;border-right:1px solid var(--line);padding:22px 14px 18px;display:flex;flex-direction:column;z-index:40}.brand{height:66px;display:flex;align-items:center;padding:0 15px;margin-bottom:16px}.brand img{width:52px;height:52px;object-fit:contain}.sidebar nav{display:grid;gap:3px}.sidebar nav a,.logout{padding:12px 14px;border-radius:10px;font-size:14px;color:#4e5763;font-weight:500}.sidebar nav a.active{background:var(--blue-soft);color:var(--blue);font-weight:600}.sidebar nav a:hover,.logout:hover{background:#f5f6f8}.logout{margin-top:auto}.main{margin-left:var(--side);padding:42px clamp(28px,4vw,60px) 60px;max-width:1510px}.mobile-head,.bottom-nav{display:none}
.welcome{margin-bottom:22px}.welcome-person{display:flex;align-items:center;gap:16px}.welcome-avatar{width:58px;height:58px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#edf0f4;color:#56606c;font-weight:700}.welcome-avatar img{width:100%;height:100%;object-fit:cover}.date{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#969da7;font-weight:600}.welcome h1{font-size:34px;letter-spacing:-.045em;margin:4px 0 4px}.welcome h1 span{font-size:.84em}.welcome p{font-size:15px;color:var(--muted);margin:0}
.baby-row{display:flex;align-items:center;gap:14px;padding:16px 18px;margin-bottom:16px}.baby-picture{width:54px;height:54px;border-radius:50%;overflow:hidden;background:#edf1f5;display:grid;place-items:center;color:#5a6572;font-weight:700}.baby-picture img{width:100%;height:100%;object-fit:cover}.baby-row h2{font-size:16px;margin:0}.baby-row p{font-size:12px;color:var(--muted);margin:3px 0}.baby-row>a{margin-left:auto;color:var(--blue);font-size:13px;font-weight:600}
.summary{padding:20px;margin-bottom:16px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.panel-head h2{font-size:17px;margin:0}.tabs{display:flex;background:#f3f5f7;padding:3px;border-radius:999px}.tabs button{border:0;background:transparent;border-radius:999px;padding:8px 13px;font-size:11px;color:#727a86}.tabs button.active{background:#fff;color:var(--blue);box-shadow:0 1px 2px rgba(0,0,0,.05);font-weight:600}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metrics article{border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;gap:11px;min-height:125px}.metric-icon{width:34px;height:34px;border-radius:10px;background:#f3f5f8;display:grid;place-items:center;flex:0 0 auto}.metrics article:nth-child(1) .metric-icon,.metrics article:nth-child(4) .metric-icon{background:var(--blue-soft)}.metrics article:nth-child(2) .metric-icon{background:var(--pink-soft)}.metrics article:nth-child(3) .metric-icon{background:#f4efff}.metrics article>div{display:grid}.metrics article>div>span{font-size:11px;color:#5f6874}.metrics strong{font-size:21px;margin-top:14px;letter-spacing:-.03em}.metrics small{font-size:10px;color:#9aa0aa;margin-top:2px}
.ai-tips{padding:22px;margin-bottom:22px}.tip-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-end}.tip-head h2,.section-title h2{font-size:20px;margin:5px 0 0}.tip-head>a{font-size:12px;color:var(--blue);font-weight:600}.tip-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.tip-list article{border-top:1px solid var(--line);padding-top:14px;display:grid;grid-template-columns:28px 1fr;gap:8px}.tip-list b{font-size:11px;color:#a1a7b0}.tip-list p{font-size:12px;line-height:1.55;color:#505966;margin:0}
.ebooks{margin-top:6px}.section-title{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:14px}.premium-badge{background:linear-gradient(90deg,var(--blue),var(--pink));color:#fff;font-size:10px;font-weight:700;border-radius:999px;padding:7px 10px}.ebook-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.ebook-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px;display:grid;grid-template-columns:30px 1fr;gap:8px;min-height:132px}.ebook-card>span{font-size:10px;color:#a0a6af}.ebook-card div{display:grid;align-content:start}.ebook-card b{font-size:14px}.ebook-card small{font-size:10px;line-height:1.5;color:var(--muted);margin-top:5px}.ebook-card em{grid-column:1/-1;font-style:normal;font-size:9px;color:#a0a5ad;margin-top:auto}
.page-title{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:22px}.page-title h1{font-size:30px;letter-spacing:-.04em;margin:0 0 5px}.page-title p{font-size:13px;color:var(--muted);margin:0}.gradient-btn{border:0;background:linear-gradient(90deg,var(--blue),var(--pink));color:#fff;border-radius:10px;padding:11px 15px;font-size:12px;font-weight:600}.gradient-btn.small{padding:9px 11px;font-size:11px}.gradient-btn.full{width:100%}.text-btn{border:0;background:transparent;color:#69717d;font-size:11px;padding:8px}.secondary{border:0;background:#f2f4f7;color:#404b5b;border-radius:10px;padding:10px 13px;font-size:12px;font-weight:600}
.diary-overview{display:grid;grid-template-columns:1.4fr .7fr;gap:14px;margin-bottom:14px}.chart-card{padding:20px}.mini-bars{height:170px;display:flex;align-items:end;gap:14px;padding:10px 4px 0}.mini-bars>div{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:flex-end;flex-direction:column}.mini-bars span{display:block;width:100%;max-width:30px;margin:auto;background:linear-gradient(180deg,var(--blue),var(--pink));border-radius:7px 7px 2px 2px;min-height:8px}.mini-bars small{font-size:9px;color:#9299a3;margin-top:8px}.diary-ai{padding:20px}.diary-ai h2{font-size:17px;margin:6px 0}.diary-ai p{font-size:12px;line-height:1.6;color:#59616d}.diary-ai a{font-size:11px;color:var(--blue);font-weight:600}.diary-table{padding:8px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:980px}th,td{text-align:left;padding:14px 13px;border-bottom:1px solid var(--line);font-size:11px}th{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:#969ca6}.delete{border:0;background:#f3f4f6;border-radius:8px;width:28px;height:28px;color:#7d8590}
.routine-header{padding:18px 20px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:20px;margin-bottom:12px}.routine-header h2{font-size:20px;margin:4px 0}.progress{height:7px;background:#edf0f3;border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--pink));border-radius:999px}.day-tabs{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:12px}.day-tabs a{text-align:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;font-size:11px;color:#68717d}.day-tabs a.active{background:#111318;color:#fff;border-color:#111318}.routine-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:14px}.routine-list{padding:20px}.routine-list .panel-head>div{display:flex;gap:5px}.routine-step{display:grid;grid-template-columns:32px 55px 1fr auto;gap:12px;align-items:center;min-height:82px;border-top:1px solid var(--line)}.routine-step.done{opacity:.52}.routine-step.done b{text-decoration:line-through}.check-step input{display:none}.check-step span{display:block;width:22px;height:22px;border:1px solid #cfd4da;border-radius:7px}.check-step input:checked+span{background:linear-gradient(90deg,var(--blue),var(--pink));border:0}.routine-step time{font-size:11px;font-weight:600}.routine-step b{font-size:13px}.routine-step p{font-size:10px;color:var(--muted);margin:3px 0}.delete-step{border:0;background:transparent;color:#999fa8;font-size:10px}.routine-tip{padding:22px}.routine-tip h2{font-size:17px}.routine-tip p{font-size:12px;line-height:1.6;color:var(--muted)}.inline-form{margin-top:14px;padding:20px}.inline-form h2{font-size:16px}.inline-form form{display:grid;gap:10px}
.sound-page{display:grid;grid-template-columns:1fr 300px;gap:16px}.sound-category{margin-bottom:22px}.sound-category h2{font-size:17px;margin:0 0 11px}.spotify-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.sound-tile{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;min-height:160px;display:flex;flex-direction:column}.sound-emoji{font-size:28px;margin:12px 0}.sound-tile b{font-size:12px}.sound-tile small{font-size:9px;line-height:1.45;color:var(--muted);margin-top:4px}.fav{position:absolute;right:9px;top:9px;border:0;background:transparent;color:#9aa0aa;font-size:18px}.fav.active{color:var(--pink)}.play-sound{margin-top:auto;align-self:flex-end;width:34px;height:34px;border-radius:50%;border:0;background:#111318;color:#fff}.player{padding:22px;text-align:center;position:sticky;top:22px;height:max-content}.now{font-size:9px;letter-spacing:.08em;color:#9aa0aa}.player h2{font-size:18px}.player p{font-size:10px;color:var(--muted)}.play{width:52px;height:52px;border-radius:50%;border:0;background:#111318;color:#fff;margin:15px}.player label{font-size:10px;color:var(--muted)}.player input{width:100%;accent-color:var(--blue)}.timers{display:flex;gap:5px;margin-top:14px}.timers button{flex:1;border:1px solid var(--line);background:#fff;border-radius:8px;padding:7px;font-size:9px}.timers button.active{background:var(--blue-soft);color:var(--blue)}
.profile,.preferences,.subscription{padding:22px;margin-bottom:14px;max-width:920px}.profile-photos{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}.profile h2,.preferences h2,.subscription h2,.danger h2{font-size:16px;margin:0 0 12px}.photo-line{display:flex;align-items:center;gap:14px}.photo-line img,.photo-fallback{width:78px;height:78px;border-radius:50%;object-fit:cover}.photo-fallback{display:grid;place-items:center;background:#edf0f4;font-weight:700}.upload{background:#f2f4f7;border-radius:9px;padding:9px 11px;font-size:11px;font-weight:600}.upload input{display:none}.fields{display:grid;gap:10px}.fields.two{grid-template-columns:1fr 1fr}label{font-size:11px;color:#596270;font-weight:600}input,textarea,select{width:100%;margin-top:6px;border:1px solid #dfe3e8;border-radius:10px;padding:10px 11px;background:#fff;outline:0;color:var(--text)}textarea{resize:vertical}.profile-actions{display:flex;align-items:center;gap:12px;margin-top:18px}.preferences form{display:grid;gap:14px}.subscription{display:flex;justify-content:space-between;align-items:center}.subscription p{font-size:11px;color:var(--muted)}.danger{max-width:920px;border:1px solid #f0cbd8;background:#fff8fb;border-radius:16px;padding:20px}.danger p{font-size:11px;color:#7a6470}.danger button{border:1px solid #e3a7bc;background:#fff;color:#bd4b73;border-radius:9px;padding:9px 12px;font-size:11px}
.chat-page{min-height:calc(100vh - 110px);display:grid;grid-template-rows:auto 1fr auto}.chat-top,.chat-stream,.chat-composer-wrap{max-width:860px;width:100%;margin:0 auto}.chat-top{padding:0 10px 18px;border-bottom:1px solid var(--line)}.chat-top h1{font-size:29px;margin:0}.chat-top p{font-size:13px;color:var(--muted)}.chat-stream{padding:26px 10px}.chat-row{display:grid;grid-template-columns:34px 1fr;gap:14px;margin-bottom:22px}.chat-row.user{grid-template-columns:1fr}.chat-row.user .chat-text{background:#f0f2f4;padding:12px 14px;border-radius:15px;justify-self:end;max-width:78%}.bot-mark{width:34px;height:34px;border-radius:9px;background:#111318;color:#fff;display:grid;place-items:center;font-weight:700}.chat-text{font-size:14px;line-height:1.65}.chat-composer-wrap{padding:0 10px}.suggestions{display:flex;gap:6px;overflow:auto;margin-bottom:8px}.suggestions button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 10px;font-size:10px;white-space:nowrap}.chat-composer{display:flex;gap:8px;align-items:flex-end;background:#fff;border:1px solid #d9dde3;border-radius:17px;padding:9px}.chat-composer textarea{border:0;margin:0;flex:1}.chat-composer button{border:0;background:linear-gradient(90deg,var(--blue),var(--pink));color:#fff;border-radius:10px;padding:9px 13px}.chat-composer-wrap>small{display:block;text-align:center;font-size:9px;color:#9aa1aa;margin-top:7px}
.cry-layout{display:grid;grid-template-columns:320px 1fr;gap:14px}.cry-record,.cry-history{padding:20px}.cry-record{text-align:center}.big-record{width:72px;height:72px;border:0;border-radius:50%;background:linear-gradient(90deg,var(--blue),var(--pink));margin:22px auto 9px;display:grid;place-items:center}.big-record span{width:18px;height:18px;border-radius:50%;background:#fff}.cry-record>b,.cry-record>small{display:block}.cry-record>small{font-size:10px;color:#999fa8;margin:4px 0 12px}.analysis-note{border-top:1px solid var(--line);padding-top:16px;margin-top:16px;font-size:10px;line-height:1.55;color:#7e8590;text-align:left}.cry-list{display:grid;gap:9px}.cry-list article{border:1px solid var(--line);border-radius:12px;padding:12px}.cry-meta{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px}.cry-meta b{font-size:11px}.status{font-size:9px;padding:5px 7px;border-radius:999px}.status.pending{background:#f2f4f7}.status.analyzed{background:#edf7f0;color:#327348}.cry-list audio{width:100%}
.modal{display:none;position:fixed;inset:0;background:rgba(17,19,24,.27);backdrop-filter:blur(4px);z-index:100;place-items:center;padding:16px}.modal.open{display:grid}.modal-card{width:min(650px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:20px;padding:24px;position:relative}.modal-card h2{font-size:20px;margin:0}.modal-sub{font-size:11px;color:var(--muted);margin:6px 0 18px}.close{position:absolute;right:15px;top:15px;border:0;background:#f2f4f7;border-radius:9px;width:30px;height:30px}.modal-card form{display:grid;gap:11px}.optional{font-size:9px;color:#9aa0aa;font-weight:400}
.empty{text-align:center;padding:50px 20px}.empty h3{font-size:16px}.empty p{font-size:11px;color:var(--muted)}
@media(max-width:1100px){.metrics{grid-template-columns:repeat(2,1fr)}.ebook-grid{grid-template-columns:repeat(2,1fr)}.tip-list{grid-template-columns:1fr}.spotify-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.sidebar{width:235px;transform:translateX(-100%);transition:.2s;box-shadow:16px 0 35px rgba(0,0,0,.08)}.sidebar.open{transform:translateX(0)}.main{margin-left:0;padding:82px 13px 88px}.mobile-head{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;position:fixed;inset:0 0 auto;height:64px;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);z-index:35;padding:0 13px}.mobile-head>button{border:0;background:transparent;font-size:20px}.mobile-head>a:nth-child(2){justify-self:center}.mobile-head>a:nth-child(2) img{width:36px;height:36px}.head-user{justify-self:end}.head-user img,.head-user span{width:35px;height:35px;border-radius:50%;object-fit:cover}.head-user span{display:grid;place-items:center;background:#edf0f4;font-size:11px}.bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;inset:auto 0 0;background:rgba(255,255,255,.98);border-top:1px solid var(--line);z-index:34;padding:9px 2px max(9px,env(safe-area-inset-bottom))}.bottom-nav a{text-align:center;font-size:9px;color:#6d7580}.bottom-nav a.active{color:var(--blue);font-weight:600}.diary-overview,.routine-layout,.sound-page,.cry-layout{grid-template-columns:1fr}.player{position:static;order:-1}.routine-tip{display:none}.day-tabs{overflow:auto;display:flex}.day-tabs a{min-width:55px}.profile-photos{grid-template-columns:1fr}}
@media(max-width:560px){.welcome h1{font-size:28px}.welcome-avatar{width:50px;height:50px}.metrics{grid-template-columns:1fr}.metrics article{min-height:0}.metrics strong{font-size:18px}.panel-head{align-items:flex-start}.tabs button{padding:7px 8px}.ebook-grid{grid-template-columns:1fr}.page-title.row{display:grid}.page-title h1{font-size:26px}.spotify-grid{grid-template-columns:repeat(2,1fr)}.fields.two{grid-template-columns:1fr}.routine-step{grid-template-columns:27px 45px 1fr}.delete-step{grid-column:3}.subscription{display:grid;gap:10px}.modal-card{padding:20px}.tip-head{display:grid}.section-title{align-items:flex-start}}

.auth-body{min-height:100vh;display:grid;place-items:center;background:#f7f8fa;padding:20px}.auth-shell{width:min(900px,100%);min-height:550px;background:#fff;border:1px solid var(--line);border-radius:22px;display:grid;grid-template-columns:.85fr 1.15fr;overflow:hidden}.auth-visual{background:#f1f3f6;padding:42px;display:flex;flex-direction:column;justify-content:flex-end;position:relative}.auth-visual h2{font-size:23px}.auth-visual p{font-size:12px;color:var(--muted)}.moon-orb{position:absolute;top:88px;left:50%;transform:translateX(-50%);width:104px;height:104px;border-radius:26px;background:#111318;color:#fff;display:grid;place-items:center;font-size:50px}.auth-card{padding:42px;align-self:center}.brand-mark{margin-bottom:28px}.auth-card h1,.install-card h1{font-size:24px}.muted{color:var(--muted)}.stack{display:grid;gap:11px}.stack label{font-size:11px}.form-row{display:flex;justify-content:space-between;font-size:10px}.check{display:flex;grid-template-columns:auto 1fr}.check input{width:auto}.btn{border:0;border-radius:10px;padding:10px 13px;font-size:11px;font-weight:600}.btn.primary{background:linear-gradient(90deg,var(--blue),var(--pink));color:#fff}.btn.soft{background:#f2f4f7}.btn.full{width:100%}.auth-footer{text-align:center;font-size:10px;color:var(--muted)}.auth-footer a,.form-row a{color:var(--blue)}.install-card{width:min(470px,100%);background:#fff;border:1px solid var(--line);border-radius:20px;padding:32px}@media(max-width:720px){.auth-shell{grid-template-columns:1fr;min-height:0}.auth-visual{display:none}.auth-card{padding:28px 22px}}

:root{--baby-grad:linear-gradient(100deg,#6db2c8 0%,#ed9d9c 100%)}.gradient-btn,.chat-composer button,.premium-badge{background:var(--baby-grad)!important}.welcome{background:var(--baby-grad);border-radius:20px;padding:20px 22px;color:#fff}.welcome .date,.welcome p{color:rgba(255,255,255,.86)}.welcome h1{color:#fff;font-size:29px}.welcome-avatar{border:2px solid rgba(255,255,255,.5);background:rgba(255,255,255,.18);color:#fff}.sound-page{display:block}.sound-sections{display:grid;gap:14px}.sound-category{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;margin:0}.spotify-grid{gap:14px}.sound-tile{min-height:178px;padding:16px}.play-sound{background:var(--baby-grad);width:38px;height:38px}.player{position:fixed!important;left:calc(var(--side) + 32px);right:32px;bottom:22px;top:auto!important;z-index:32;padding:12px 15px!important;border-radius:16px!important;box-shadow:0 14px 42px rgba(31,38,50,.14);text-align:left!important}.player-main{display:flex;align-items:center;gap:12px}.player-cover{width:42px;height:42px;border-radius:11px;background:#f2f5f7;display:grid;place-items:center;font-size:21px}.player-copy{display:grid}.player-copy small{font-size:8px;color:#999}.player-copy b{font-size:12px}.player-copy span{font-size:9px;color:var(--muted)}.player .play{width:38px;height:38px;margin:0 12px 0 auto}.player-controls{display:flex;align-items:center;gap:15px;margin-left:auto}.player-controls label{display:flex;align-items:center;gap:8px}.player-controls input{margin:0}.timers{margin:0}.sleep-card{width:min(590px,100%);padding:28px}.sleep-card form{gap:15px}.time-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field-icon{font-size:16px;color:#6db2c8}.quality-picker{border:0;padding:0;margin:0}.quality-picker legend{font-size:11px;color:#596270;font-weight:600;margin-bottom:8px}.quality-options{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.quality-options input{position:absolute;opacity:0}.quality-options span{min-height:72px;border:1px solid #e0e4e8;border-radius:12px;display:grid;place-items:center;align-content:center;gap:4px;font-size:24px}.quality-options small{font-size:8px;color:#737c87}.quality-options input:checked+span{border-color:#6db2c8;background:linear-gradient(135deg,#f0f8fa,#fdf4f4);box-shadow:0 0 0 2px rgba(109,178,200,.14)}@media(max-width:820px){.player{left:12px;right:12px;bottom:67px}.player-controls{display:none}.sound-category{padding:15px}}@media(max-width:560px){.spotify-grid{gap:9px}.sound-tile{min-height:164px;padding:13px}.quality-options{gap:4px}.quality-options span{min-height:64px;font-size:20px}.quality-options small{font-size:7px}.sleep-card{padding:21px 16px}}

/* V8 — escala visual da qualidade do sono */
:root{
  --sleep-q-red:#ef5b5b;
  --sleep-q-orange:#f39a45;
  --sleep-q-yellow:#e8c84a;
  --sleep-q-green:#4dbb7b;
}
.sleep-quality-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:700;
}
.sleep-quality-dot{
  width:9px;height:9px;border-radius:50%;display:inline-block;
}
.sleep-quality-q1,.sleep-quality-q2{color:var(--sleep-q-red)}
.sleep-quality-q3{color:var(--sleep-q-orange)}
.sleep-quality-q4{color:var(--sleep-q-yellow)}
.sleep-quality-q5{color:var(--sleep-q-green)}
.sleep-quality-bg-q1,.sleep-quality-bg-q2{background:var(--sleep-q-red)!important}
.sleep-quality-bg-q3{background:var(--sleep-q-orange)!important}
.sleep-quality-bg-q4{background:var(--sleep-q-yellow)!important}
.sleep-quality-bg-q5{background:var(--sleep-q-green)!important}

/* V9 — cores reais no gráfico de qualidade */
.mini-bars .quality-day{position:relative}
.mini-bars .quality-day strong{font-size:9px;color:#727b87;font-weight:600;margin-bottom:5px}
.mini-bars .quality-day>span{transition:height .25s ease}
.sleep-quality-empty{background:#e8ebef!important}
.quality-legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px;padding-top:13px;border-top:1px solid var(--line)}
.quality-legend span{display:flex;align-items:center;gap:5px;font-size:9px;color:#717985}
.quality-legend i{width:8px;height:8px;border-radius:50%;display:block}

/* V10 — paleta oficial DormeBaby */
:root{
  --baby-blue:#6db2c8;
  --baby-pink:#ed9d9c;
  --baby-grad:linear-gradient(100deg,var(--baby-blue) 0%,var(--baby-pink) 100%);
}
.gradient-btn,
.chat-composer button,
.premium-badge,
.play-sound,
.big-record{
  background:var(--baby-grad)!important;
}
.welcome{background:var(--baby-grad)!important}
.progress span{background:var(--baby-grad)!important}
.check-step input:checked+span{background:var(--baby-grad)!important}

/* CORES SOLICITADAS — sem alterar o design */
.mini-bars span.sleep-quality-bg-q1,
.mini-bars span.sleep-quality-bg-q2{background:#ef5b5b!important}
.mini-bars span.sleep-quality-bg-q3{background:#f39a45!important}
.mini-bars span.sleep-quality-bg-q4{background:#e8c84a!important}
.mini-bars span.sleep-quality-bg-q5{background:#4dbb7b!important}
.mini-bars span.sleep-quality-empty{background:#e8ebef!important}

/* Qualidade no resumo */
.quality-metric.q-red .metric-icon{background:#fdeaea!important;color:#ef5b5b}
.quality-metric.q-red strong{color:#ef5b5b}
.quality-metric.q-orange .metric-icon{background:#fff1e3!important;color:#f39a45}
.quality-metric.q-orange strong{color:#f39a45}
.quality-metric.q-yellow .metric-icon{background:#fff9dd!important;color:#c6a51e}
.quality-metric.q-yellow strong{color:#c6a51e}
.quality-metric.q-green .metric-icon{background:#e8f7ef!important;color:#4dbb7b}
.quality-metric.q-green strong{color:#4dbb7b}

/* Qualidade no novo registro: 1-2 vermelho, 3 laranja, 4 amarelo, 5 verde */
.quality-options label:nth-child(1) input:checked+span,
.quality-options label:nth-child(2) input:checked+span{border-color:#ef5b5b!important;background:#fdeaea!important;box-shadow:0 0 0 2px rgba(239,91,91,.12)!important}
.quality-options label:nth-child(3) input:checked+span{border-color:#f39a45!important;background:#fff1e3!important;box-shadow:0 0 0 2px rgba(243,154,69,.12)!important}
.quality-options label:nth-child(4) input:checked+span{border-color:#e8c84a!important;background:#fff9dd!important;box-shadow:0 0 0 2px rgba(232,200,74,.14)!important}
.quality-options label:nth-child(5) input:checked+span{border-color:#4dbb7b!important;background:#e8f7ef!important;box-shadow:0 0 0 2px rgba(77,187,123,.12)!important}

/* V11 — leitura, margens e refinamento visual */
:root{
  --brand-blue:#6db2c8;
  --brand-pink:#ed9d9c;
  --brand-grad:linear-gradient(90deg,#6db2c8 0%,#ed9d9c 100%);
}

/* Desktop: tipografia um pouco maior e mais confortável */
body{font-size:15px}
.main{padding-top:28px!important}
.welcome{margin-top:0!important;margin-bottom:18px!important}
.welcome h1{font-size:31px!important}
.welcome p{font-size:16px!important}
.sidebar nav a,.logout{font-size:14.5px}
.panel-head h2,.tip-head h2,.section-title h2{font-size:18px}
.metrics article>div>span{font-size:12px}
.metrics strong{font-size:22px}
.metrics small{font-size:10.5px}
.page-title h1{font-size:31px}
.page-title p{font-size:14px}
.diary-table th{font-size:10px}
.diary-table td{font-size:12px}

/* Qualidade sem emoji */
.quality-dot-icon{background:transparent!important}
.quality-dot-icon i{display:block;width:14px;height:14px;border-radius:50%}
.quality-metric.q-red .quality-dot-icon i{background:#ef5b5b}
.quality-metric.q-orange .quality-dot-icon i{background:#f39a45}
.quality-metric.q-yellow .quality-dot-icon i{background:#e8c84a}
.quality-metric.q-green .quality-dot-icon i{background:#4dbb7b}

/* Novo registro: mais legível */
.sleep-card{width:min(620px,100%)!important}
.sleep-card h2{font-size:22px!important}
.modal-sub{font-size:12.5px!important}
.sleep-card label{font-size:12px!important}
.sleep-card input,.sleep-card select,.sleep-card textarea{font-size:14px!important;padding:12px 12px!important}
.sleep-card .field-icon{font-size:17px}
.quality-picker legend{font-size:12px!important}
.quality-options span{min-height:78px!important;font-size:25px!important}
.quality-options small{font-size:8.5px!important}
.sleep-card .gradient-btn{font-size:13.5px!important}

/* Plano: dias minimalistas com underline, sem bloco preto */
.day-tabs{
  display:flex!important;
  gap:22px!important;
  border-bottom:1px solid var(--line);
  margin-bottom:18px!important;
  overflow:auto;
}
.day-tabs a{
  min-width:auto!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  padding:10px 1px 12px!important;
  color:#7b838e!important;
  font-size:12px!important;
  position:relative;
}
.day-tabs a.active{
  color:#222!important;
  background:transparent!important;
  font-weight:700;
}
.day-tabs a.active:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:3px;
  border-radius:3px 3px 0 0;
  background:var(--brand-grad);
}

/* NanaBot: robo minimalista */
.bot-mark{
  width:36px!important;height:36px!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,#edf7fa,#fdf1f2)!important;
  color:#4a6f78!important;
  border:1px solid #e2e7ea;
  display:grid!important;place-items:center!important;
}
.robot-face{
  width:21px;height:17px;border:1.7px solid #567c85;border-radius:6px;
  position:relative;display:flex;align-items:center;justify-content:center;gap:4px
}
.robot-face:before{
  content:"";position:absolute;width:1.5px;height:5px;background:#567c85;top:-6px;left:50%;
  transform:translateX(-50%)
}
.robot-face:after{
  content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:#567c85;top:-8px;left:50%;
  transform:translateX(-50%)
}
.robot-face i{width:3px;height:3px;border-radius:50%;background:#567c85;display:block}
.chat-row.user{
  display:grid!important;
  grid-template-columns:1fr 36px!important;
  gap:10px!important;
  align-items:start
}
.chat-row.user .chat-text{grid-column:1;grid-row:1}
.chat-user-avatar{
  grid-column:2;grid-row:1;
  width:36px;height:36px;border-radius:50%;
  overflow:hidden;background:#edf0f4;display:grid;place-items:center;
  font-size:11px;font-weight:700;color:#5e6670
}
.chat-user-avatar img{width:100%;height:100%;object-fit:cover}

/* Sons: mais respiro e cada som com personalidade visual própria */
.sound-sections{gap:18px!important}
.sound-category{padding:22px!important}
.sound-category h2{font-size:19px!important;margin-bottom:18px!important}
.spotify-grid{gap:14px!important}
.sound-tile{
  min-height:190px!important;
  padding:16px!important;
  border-radius:16px!important;
  overflow:hidden;
  position:relative
}
.sound-tile:before{
  content:"";position:absolute;inset:0 0 auto 0;height:5px;background:#e9ecef
}
.sound-white:before,.sound-pink:before,.sound-shush:before{background:linear-gradient(90deg,#c6d8de,#e8c9cf)}
.sound-fan:before,.sound-brown:before{background:linear-gradient(90deg,#b8c7ce,#9ba7ad)}
.sound-rain:before,.sound-river:before{background:linear-gradient(90deg,#78b9d4,#9fd5df)}
.sound-ocean:before{background:linear-gradient(90deg,#5295c7,#72c6d0)}
.sound-forest:before{background:linear-gradient(90deg,#7da887,#b0c695)}
.sound-night:before{background:linear-gradient(90deg,#7f82a8,#b49bb2)}
.sound-lullaby:before,.sound-musicbox:before{background:linear-gradient(90deg,#d8a2bd,#edc6a4)}
.sound-piano:before{background:linear-gradient(90deg,#999,#d5d5d5)}
.sound-harp:before{background:linear-gradient(90deg,#d4b56f,#e8d6a7)}
.sound-dream:before{background:linear-gradient(90deg,#a89bd0,#dfadc4)}
.sound-emoji{font-size:33px!important;margin-top:18px!important}
.sound-tile b{font-size:13px!important}
.sound-tile small{font-size:10px!important}
.play-sound{width:38px!important;height:38px!important}

/* Perfil: só a foto da mãe */
.profile-photos.one-photo{grid-template-columns:1fr!important;max-width:420px}

/* Mobile: margens e toque */
@media(max-width:820px){
  .main{padding:76px 12px 88px!important}
  .welcome{border-radius:16px!important;padding:16px!important}
  .welcome-person{gap:12px!important}
  .welcome-avatar{width:48px!important;height:48px!important}
  .welcome h1{font-size:25px!important}
  .welcome p{font-size:13px!important}
  .panel{border-radius:15px}
  .summary,.ai-tips,.chart-card,.diary-ai,.routine-list,.profile,.preferences,.subscription{padding:16px!important}
  .metrics{gap:9px!important}
  .metrics article{padding:13px!important}
  .day-tabs{gap:18px!important;padding:0 3px}
  .day-tabs a{font-size:11px!important}
  .sound-category{padding:14px!important}
  .spotify-grid{gap:10px!important}
  .sound-tile{min-height:170px!important}
  .chat-top,.chat-stream,.chat-composer-wrap{padding-left:2px!important;padding-right:2px!important}
  .chat-composer{border-radius:15px!important}
  .sleep-card{padding:20px 15px!important}
  .sleep-card .fields.two,.time-pair{gap:8px!important}
}
@media(max-width:560px){
  body{font-size:14px}
  .main{padding-left:10px!important;padding-right:10px!important}
  .metrics article{min-height:76px!important}
  .quality-options{grid-template-columns:repeat(5,1fr)!important}
  .quality-options span{min-height:64px!important;font-size:21px!important}
  .sound-category h2{font-size:17px!important}
  .spotify-grid{grid-template-columns:1fr 1fr!important}
}

/* V12 — refinamentos sem mudar o design */

/* Tipografia consistente no app */
body{font-size:15px}
.main p,.panel p,.page-title p{line-height:1.55}
button,input,select,textarea{font-size:14px}

/* Resumo: corrigir excesso de espaço inferior */
.metrics article{
  min-height:108px!important;
  padding:14px 15px!important;
  align-items:center!important;
}
.metrics article>div{align-content:center!important}
.metrics strong{margin-top:10px!important}
.metrics small{margin-top:2px!important}

/* Ícone NanaBot sempre nas áreas de dica */
.nanabot-tip-title,.nanabot-suggestion-head{
  display:flex;align-items:flex-start;gap:11px
}
.nanabot-mini{
  width:35px;height:35px;border-radius:10px;flex:0 0 auto;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#edf7fa,#fdf1f2);
  border:1px solid #e2e7ea
}
.nanabot-mini .robot-face{transform:scale(.8)}

/* Premium */
.premium-title{display:flex;align-items:center;gap:11px}
.premium-lock{
  width:36px;height:36px;border-radius:10px;
  display:grid;place-items:center;background:#f5f6f8;
  font-size:17px;flex:0 0 auto
}

/* Plano: 7 dias sempre cabem no desktop, sem scroll */
.day-tabs{
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  gap:0!important;
  overflow:visible!important;
}
.day-tabs a{
  width:100%!important;
  min-width:0!important;
  text-align:center!important;
  white-space:nowrap!important;
}

/* Sugestão NanaBot */
.routine-tip .eyebrow{display:block;margin-bottom:4px}

/* Sons: aba favoritos */
.sound-filter-tabs{
  display:flex;gap:18px;
  border-bottom:1px solid var(--line);
  margin-bottom:18px;
}
.sound-filter-tabs button{
  position:relative;border:0;background:transparent;
  padding:9px 1px 12px;color:#7a828d;
  font-size:12px;font-weight:600
}
.sound-filter-tabs button.active{color:#222}
.sound-filter-tabs button.active:after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;
  border-radius:3px 3px 0 0;background:var(--brand-grad)
}
.sound-filter-tabs span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;padding:0 5px;border-radius:99px;
  background:#f1f3f5;color:#757d88;font-size:9px;margin-left:3px
}
.sound-tile.hide-by-filter{display:none!important}

/* tirar completamente a faixa/colorido superior dos sons */
.sound-tile:before{display:none!important}
.sound-tile{padding-top:16px!important}

/* preferências: botão não ocupa espaço exagerado */
.preferences-actions{
  display:flex;align-items:center;gap:12px;margin-top:2px
}
.preference-save{
  width:auto!important;display:inline-flex!important;
  min-width:150px;justify-content:center
}

/* Selects: seta com respiro à direita */
select{
  appearance:none;
  -webkit-appearance:none;
  background-image:
    linear-gradient(45deg,transparent 50%,#7e8792 50%),
    linear-gradient(135deg,#7e8792 50%,transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 13px) 50%;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
  padding-right:38px!important;
}

/* Registro de sono: totalmente fixo no desktop, sem deslocar para direita */
.modal{overflow-y:auto!important;overflow-x:hidden!important}
.modal-card.sleep-card{
  margin:24px auto!important;
  max-width:620px!important;
  width:calc(100% - 32px)!important;
  overflow-x:hidden!important;
}
.sleep-card form,.sleep-card .fields,.sleep-card .time-pair{
  min-width:0!important;max-width:100%!important
}
.sleep-card input,.sleep-card select,.sleep-card textarea{
  min-width:0!important;max-width:100%!important
}
.quality-options{min-width:0!important}
.quality-options label{min-width:0!important}

/* Fontes gerais mais consistentes */
.routine-step b,.sound-tile b,.ebook-card b{font-size:13px!important}
.routine-step p,.sound-tile small,.ebook-card small{font-size:10px!important}
.profile label,.preferences label,.sleep-card label{font-size:12px!important}

/* Mobile: margens e seleção */
@media(max-width:820px){
  .main{padding:76px 11px 88px!important}
  .day-tabs{
    grid-template-columns:repeat(7,minmax(44px,1fr))!important;
    overflow-x:auto!important;
    scrollbar-width:none
  }
  .day-tabs::-webkit-scrollbar{display:none}
  .sound-filter-tabs{margin-left:2px;margin-right:2px}
  .preferences-actions{align-items:flex-start;flex-direction:column}
  .preference-save{width:auto!important}
  .modal-card.sleep-card{
    width:calc(100% - 20px)!important;
    margin:10px auto!important
  }
}
@media(max-width:560px){
  .metrics article{min-height:82px!important}
  .metrics strong{font-size:18px!important}
  .quality-options span{min-height:62px!important}
  .sound-filter-tabs{gap:15px}
}

/* V13 */
.tabs button{color:#7b828c!important}
.tabs button.active{color:#111318!important;background:#fff!important;font-weight:700!important}
@media(min-width:821px){
  .sidebar nav a{position:relative;background:transparent!important;color:#555e6a!important}
  .sidebar nav a.active{color:#111318!important;font-weight:700!important}
  .sidebar nav a.active:before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:#111318}
}
.ebook-card.locked{opacity:.5;filter:saturate(.5);pointer-events:none;position:relative}
.ebook-lock{position:absolute;right:12px;top:11px;font-size:13px}
.quality-options{grid-template-columns:repeat(4,1fr)!important}
.quality-options label:nth-child(1) input:checked+span{border-color:#ef5b5b!important;background:#fdeaea!important}
.quality-options label:nth-child(2) input:checked+span{border-color:#f39a45!important;background:#fff1e3!important}
.quality-options label:nth-child(3) input:checked+span{border-color:#e8c84a!important;background:#fff9dd!important}
.quality-options label:nth-child(4) input:checked+span{border-color:#4dbb7b!important;background:#e8f7ef!important}
.mini-bars span.sleep-quality-bg-q1{background:#ef5b5b!important}
.mini-bars span.sleep-quality-bg-q2{background:#f39a45!important}
.mini-bars span.sleep-quality-bg-q3{background:#e8c84a!important}
.mini-bars span.sleep-quality-bg-q4{background:#4dbb7b!important}
.nanabot-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;min-height:calc(100vh - 105px)}
.chat-history{overflow:hidden;height:calc(100vh - 105px);position:sticky;top:20px}
.chat-history-head{height:58px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.chat-history-head h2{font-size:14px;margin:0}.chat-history-head button{width:30px;height:30px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:17px}
.chat-history-list{padding:8px;display:grid;gap:3px;max-height:calc(100% - 58px);overflow:auto}
.chat-history-list a{display:grid;grid-template-columns:1fr auto;gap:7px;padding:10px;border-radius:9px;color:#5e6671;font-size:11px}
.chat-history-list a:hover{background:#f5f6f8}.chat-history-list a.active{background:#f0f2f4;color:#111;font-weight:600}
.chat-history-list a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-history-list a small{font-size:8px;color:#9aa0a8}
.chat-history-empty{padding:8px;font-size:10px;color:#999}.nanabot-heading{display:flex;align-items:center;gap:10px}
@media(min-width:821px){
  .player{left:calc(var(--side) + 42px)!important;right:42px!important;bottom:24px!important;padding:15px 18px!important;min-height:76px}
  .player-cover{width:50px!important;height:50px!important;font-size:25px!important}.player-copy b{font-size:14px!important}.player-copy span{font-size:10px!important}
  .player .play{width:46px!important;height:46px!important;background:var(--brand-grad)!important;font-size:14px}.player-controls{max-width:480px!important;gap:20px!important}.player-controls label{min-width:220px!important}
}
#volume{accent-color:#6db2c8!important}.timers button.active{color:#111!important;background:linear-gradient(90deg,rgba(109,178,200,.16),rgba(237,157,156,.16))!important;border-color:#d8dfe3!important}
@media(max-width:820px){.nanabot-layout{grid-template-columns:1fr}.chat-history{position:static;height:auto;max-height:180px}.chat-history-list{display:flex;overflow-x:auto;overflow-y:hidden;max-height:none}.chat-history-list a{min-width:170px}}

/* V14 — ajustes solicitados */

/* Resumo mais compacto e alinhado */
.metrics article{
  min-height:100px!important;
  padding:13px 14px!important;
}
.metrics strong{margin-top:8px!important}
.metrics article:nth-child(3) .metric-icon{background:var(--blue-soft)!important}

/* Uma única dica NanaBot */
.ai-tips.single-tip{padding:20px 22px!important}
.single-tip-content{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;margin-top:15px;padding-top:15px;border-top:1px solid var(--line)
}
.single-tip-content p{
  margin:0!important;max-width:780px;
  font-size:13px!important;line-height:1.6;color:#4f5864
}
.nanabot-black-link{
  flex:0 0 auto;
  display:inline-flex;align-items:center;gap:8px;
  background:#111318;color:#fff!important;
  border-radius:10px;padding:10px 14px;
  font-size:11px!important;font-weight:600
}
.nanabot-black-link span{font-size:17px;line-height:1}

/* Plano: modal de adicionar passo */
.routine-modal-card{width:min(520px,calc(100% - 28px))!important}
.routine-modal-card form{display:grid;gap:12px}
.routine-modal-card h2{font-size:20px;margin:4px 0 0}
#routineStatus{font-size:11px;color:#657080}

/* NanaBot: histórico vira drawer oculto */
.nanabot-layout{
  display:block!important;
  position:relative
}
.chat-history{
  position:fixed!important;
  left:calc(var(--side) + 18px);
  top:18px!important;
  bottom:18px;
  width:260px;
  height:auto!important;
  z-index:80;
  transform:translateX(calc(-100% - var(--side) - 40px));
  transition:transform .2s ease;
  box-shadow:0 18px 50px rgba(18,24,32,.14);
  background:#fff
}
.chat-history.open{transform:translateX(0)}
.chat-history-backdrop{
  position:fixed;inset:0;background:rgba(17,19,24,.18);
  z-index:79;display:none
}
.chat-history-backdrop.open{display:block}
.chat-history-head>div{display:flex;gap:5px}
.chat-history-toggle{
  border:1px solid var(--line);
  background:#fff;color:#444d59;
  border-radius:9px;padding:8px 11px;
  font-size:11px;font-weight:600
}
.chat-top{
  display:flex!important;align-items:center;justify-content:space-between!important;
  gap:12px
}

/* Sons: player em uma linha, mais minimalista e texto maior */
.player{
  min-height:auto!important;
  padding:11px 14px!important
}
.player-main{
  display:grid!important;
  grid-template-columns:44px minmax(150px,1fr) 44px minmax(300px,460px)!important;
  gap:12px!important;
  align-items:center!important;
}
.player-cover{
  width:44px!important;height:44px!important;
  font-size:22px!important;border-radius:11px!important
}
.player-copy b{font-size:15px!important}
.player-copy span{font-size:11px!important}
.player-copy small{font-size:8px!important}
.player .play{
  width:42px!important;height:42px!important;
  margin:0!important;
  background:var(--brand-grad)!important
}
.player-controls{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  max-width:none!important;
  margin:0!important
}
.player-controls label{
  min-width:180px!important;
  display:flex!important;align-items:center!important;gap:8px!important;
  font-size:11px!important
}
.player-controls .timers{min-width:160px}
#volume{accent-color:#6db2c8!important}

/* Mobile */
@media(max-width:820px){
  .single-tip-content{display:grid;gap:14px}
  .nanabot-black-link{width:max-content}
  .chat-history{
    left:10px!important;top:74px!important;bottom:74px!important;
    width:min(290px,calc(100vw - 20px))!important;
    transform:translateX(calc(-100% - 20px))
  }
  .chat-history.open{transform:translateX(0)}
  .player-main{
    grid-template-columns:40px minmax(0,1fr) 40px!important
  }
  .player-controls{display:none!important}
  .player-copy b{font-size:13px!important}
  .player-copy span{font-size:9px!important}
}

/* V15 — plano por idade + CTA NanaBot minimalista */
.nanabot-text-link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#17191d!important;
  font-size:12px!important;
  font-weight:650;
  padding:4px 0;
  background:transparent!important;
}
.nanabot-text-link span{
  font-size:19px;
  line-height:1;
  transition:transform .15s ease;
}
.nanabot-text-link:hover span{transform:translateX(3px)}
.age-plan-note{
  margin-top:7px!important;
  font-size:10.5px!important;
  color:#8a929d!important
}
.age-plan-btn{white-space:nowrap}
.age-plan-modal-card{
  width:min(560px,calc(100% - 28px))!important
}
.age-plan-modal-card h2{font-size:21px;margin:4px 0 2px}
.recommended-preview{
  margin:18px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.recommended-preview>div{
  display:grid;
  grid-template-columns:58px 1fr;
  gap:13px;
  padding:12px 2px;
  border-bottom:1px solid var(--line);
  align-items:start
}
.recommended-preview>div:last-child{border-bottom:0}
.recommended-preview time{
  font-size:11px;
  font-weight:700;
  color:#22272e;
  padding-top:2px
}
.recommended-preview span{display:grid;gap:3px}
.recommended-preview b{font-size:12.5px;color:#252a31}
.recommended-preview small{font-size:10px;line-height:1.45;color:#7b8490}
.plan-disclaimer{
  display:block;
  margin-top:10px;
  text-align:center;
  font-size:9px;
  color:#9299a2
}
.center-link{display:flex!important;justify-content:center;text-decoration:none}
@media(max-width:820px){
  .single-tip-content{align-items:start}
  .nanabot-text-link{width:max-content}
  .age-plan-btn{white-space:normal}
  .recommended-preview>div{grid-template-columns:52px 1fr}
}

/* V16 — plano de sono completo e visível */
.age-plan-panel{padding:22px!important;margin-bottom:18px}
.age-plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:22px}
.age-plan-head h2{font-size:18px;margin:3px 0 5px}
.age-plan-head p{font-size:11px!important;color:#737c87;margin:0!important;line-height:1.5}
.age-plan-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-top:19px}
.age-plan-steps article{border:1px solid var(--line);border-radius:13px;padding:13px;min-width:0;background:#fff}
.age-step-number{display:block;font-size:9px;color:#a1a7af;margin-bottom:10px}
.age-plan-steps time{display:block;font-size:11px;font-weight:700;color:#252a31;margin-bottom:7px}
.age-plan-steps b{display:block;font-size:11.5px;color:#252a31;margin-bottom:5px}
.age-plan-steps p{font-size:9.5px!important;color:#7c8490!important;line-height:1.45;margin:0!important}
.age-plan-footnote{display:block;margin-top:12px;color:#969ca5;font-size:9px}
.text-plan-link{color:#17191d!important;font-size:11px;font-weight:650;white-space:nowrap}
@media(max-width:1050px){.age-plan-steps{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){
 .age-plan-panel{padding:16px!important}
 .age-plan-head{display:grid;gap:14px}
 .age-plan-steps{grid-template-columns:1fr}
 .age-plan-steps article{display:grid;grid-template-columns:28px 48px 1fr;gap:8px;align-items:start}
 .age-step-number,.age-plan-steps time{margin:0}
}

/* V17 — plano por idade dentro da própria rotina do dia */
.age-plan-panel{display:none!important}
.routine-main-head{
  align-items:flex-start!important;
}
.routine-main-head>div:first-child{
  display:grid;
  gap:4px
}
.routine-main-head h2{margin:0!important}
.routine-main-head small{
  font-size:9.5px;
  color:#9299a3
}
.age-refresh{
  color:#222!important;
  font-weight:650!important
}
@media(max-width:650px){
  .routine-main-head{
    display:grid!important;
    gap:12px!important
  }
  .routine-main-head>div:last-child{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important
  }
}

/* V18 — plano de dia inteiro e dica NanaBot compacta */
.routine-layout{align-items:start!important}
.routine-tip{
  align-self:start!important;
  height:max-content!important;
  min-height:0!important;
  padding:17px!important;
}
.routine-tip .nanabot-suggestion-head{margin-bottom:9px!important}
.routine-tip h2{margin:2px 0 0!important;font-size:15px!important}
.routine-tip>p{
  margin:0!important;
  font-size:11px!important;
  line-height:1.5!important;
}
.routine-main-head small{font-size:10px!important;color:#8c949e!important}
.routine-step{min-height:70px!important}
.routine-step b{font-size:13px!important}
.routine-step p{font-size:10.5px!important}
.age-refresh{display:none!important}

/* V19 — Diário do Sono compacto, 30 dias e NanaBot */
.nanabot-diary-tip{
  padding:18px!important;
  height:auto!important;
  min-height:0!important;
  align-self:start!important
}
.nanabot-diary-tip .nanabot-suggestion-head{margin-bottom:10px}
.nanabot-diary-tip h2{font-size:16px!important;margin:2px 0 0!important}
.nanabot-diary-tip>p{
  margin:0 0 12px!important;
  font-size:11.5px!important;
  line-height:1.55!important;
  color:#59616d
}

.diary-history{
  padding:20px!important;
  margin-top:14px
}
.diary-history-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:16px
}
.diary-history-head h2{
  margin:4px 0 3px;
  font-size:18px
}
.diary-history-head p{
  margin:0!important;
  font-size:10.5px!important;
  color:#8a929c!important
}
.clear-date-filter{
  color:#17191d!important;
  font-size:11px;
  font-weight:650;
  white-space:nowrap
}

.sleep-calendar{
  display:grid;
  grid-template-columns:repeat(15,minmax(42px,1fr));
  gap:6px;
  padding:2px 0 14px;
  overflow-x:auto;
  scrollbar-width:thin
}
.calendar-day{
  min-height:68px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  display:grid;
  place-items:center;
  align-content:center;
  gap:2px;
  position:relative;
  color:#535c68;
  transition:.15s
}
.calendar-day:hover{border-color:#cfd4da;background:#fafbfc}
.calendar-day small{
  font-size:8px;
  color:#a0a6af;
  font-weight:600
}
.calendar-day b{
  font-size:13px;
  color:#30363d
}
.calendar-day>span{
  font-size:7px;
  color:#a4aab2
}
.calendar-day i{
  position:absolute;
  bottom:6px;
  width:5px;height:5px;border-radius:50%;
  background:#a0a5ad
}
.calendar-day.q1 i{background:#ef5b5b}
.calendar-day.q2 i{background:#f39a45}
.calendar-day.q3 i{background:#e8c84a}
.calendar-day.q4 i{background:#4dbb7b}
.calendar-day.active{
  border-color:#222;
  box-shadow:0 0 0 1px #222 inset;
  background:#fafafa
}

.diary-list-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:15px 0 10px;
  border-top:1px solid var(--line)
}
.diary-list-head h3{
  margin:0;
  font-size:13px
}
.diary-list-head>span{
  font-size:9.5px;
  color:#9299a3
}
.compact-sleep-list{
  display:grid
}
.compact-sleep-list article{
  min-height:66px;
  display:grid;
  grid-template-columns:95px minmax(0,1fr) 92px 30px;
  gap:12px;
  align-items:center;
  border-top:1px solid var(--line)
}
.compact-sleep-list article:first-child{border-top:0}
.sleep-list-date{display:grid;gap:3px}
.sleep-list-date b{font-size:11px}
.sleep-list-date small{font-size:9px;color:#8b929c}
.sleep-list-main{display:grid;gap:3px;min-width:0}
.sleep-list-main b{
  font-size:11.5px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.sleep-list-main small{
  font-size:9px;
  color:#7f8791;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.sleep-list-quality{
  display:flex;
  align-items:center;
  gap:6px
}
.sleep-list-quality span{
  width:8px;height:8px;border-radius:50%;background:#b6bbc2
}
.sleep-list-quality small{font-size:9px;color:#747c87}
.sleep-list-quality.q1 span{background:#ef5b5b}
.sleep-list-quality.q2 span{background:#f39a45}
.sleep-list-quality.q3 span{background:#e8c84a}
.sleep-list-quality.q4 span{background:#4dbb7b}
.compact-empty{padding:32px 16px!important}

/* gráfico: rótulos em português com mais alinhamento */
.mini-bars>div small{
  width:100%;
  text-align:center;
  font-size:9px!important;
  color:#737b86!important
}
.mini-bars>div{
  align-items:center!important
}

@media(max-width:1050px){
  .sleep-calendar{
    grid-template-columns:repeat(10,minmax(44px,1fr))
  }
}
@media(max-width:820px){
  .diary-history{padding:15px!important}
  .sleep-calendar{
    display:flex;
    overflow-x:auto;
    gap:7px;
    padding-bottom:13px
  }
  .calendar-day{
    flex:0 0 54px;
    min-height:66px
  }
  .compact-sleep-list article{
    grid-template-columns:70px minmax(0,1fr) 28px;
    gap:8px;
    padding:9px 0
  }
  .sleep-list-quality{
    grid-column:2;
    width:max-content
  }
  .compact-sleep-list .delete{
    grid-column:3;
    grid-row:1 / 3
  }
}

/* V20 — NanaBot direto na tela, sem popup */

/* estrutura geral */
.nanabot-layout{
  display:grid!important;
  grid-template-columns:220px minmax(0,1fr)!important;
  gap:16px!important;
  min-height:calc(100vh - 96px)!important;
  align-items:stretch!important;
}

/* histórico sempre visível no desktop */
.chat-history{
  position:static!important;
  transform:none!important;
  width:auto!important;
  height:calc(100vh - 96px)!important;
  max-height:calc(100vh - 96px)!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:#fff!important;
}
.chat-history-backdrop{display:none!important}
.chat-history-head{
  height:52px!important;
  padding:0 12px!important
}
.chat-history-head h2{
  font-size:13px!important;
  margin:0!important
}
.chat-history-head button{
  width:28px!important;
  height:28px!important;
  border-radius:8px!important;
  font-size:16px!important
}
.chat-history-list{
  max-height:calc(100% - 52px)!important;
  overflow-y:auto!important;
  padding:7px!important
}
.chat-history-list a{
  padding:9px 9px!important;
  border-radius:8px!important;
  font-size:10.5px!important
}

/* conversa */
.nanabot-layout .chat-page{
  min-height:calc(100vh - 96px)!important;
  height:calc(100vh - 96px)!important;
  display:grid!important;
  grid-template-rows:auto 1fr auto!important;
  min-width:0!important;
}

/* título/subtítulo com margem menor */
.chat-top{
  padding:4px 8px 12px!important;
  min-height:54px!important;
  border-bottom:1px solid var(--line)!important
}
.nanabot-heading{
  gap:9px!important;
  align-items:center!important
}
.nanabot-heading h1{
  font-size:25px!important;
  line-height:1.05!important;
  margin:0 0 2px!important
}
.nanabot-heading p{
  font-size:11px!important;
  line-height:1.25!important;
  margin:0!important;
  color:#7b838e!important
}
.nanabot-heading .nanabot-mini{
  width:34px!important;
  height:34px!important
}

/* mensagens */
.chat-stream{
  width:100%!important;
  max-width:820px!important;
  margin:0 auto!important;
  padding:20px 12px!important;
  overflow-y:auto!important;
  min-height:0!important
}
.chat-row{
  margin-bottom:18px!important
}
.chat-text{
  font-size:13.5px!important;
  line-height:1.6!important
}

/* caixa de pergunta fixa, sem crescer */
.chat-composer-wrap{
  width:100%!important;
  max-width:820px!important;
  margin:0 auto!important;
  padding:8px 10px 10px!important;
  background:var(--bg)!important
}
.chat-composer{
  height:50px!important;
  min-height:50px!important;
  max-height:50px!important;
  display:flex!important;
  align-items:center!important;
  padding:5px 6px 5px 14px!important;
  border-radius:14px!important
}
.chat-composer input{
  flex:1!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  margin:0!important;
  padding:0 8px 0 0!important;
  font-size:13.5px!important;
  box-shadow:none!important
}
.chat-composer button{
  height:38px!important;
  min-width:72px!important;
  border-radius:10px!important;
  padding:0 14px!important;
  font-size:11px!important
}
.suggestions{
  margin-bottom:7px!important
}
.suggestions button{
  font-size:9.5px!important;
  padding:7px 9px!important
}
.chat-composer-wrap>small{
  margin-top:6px!important;
  font-size:8.5px!important
}

/* mobile: histórico vira faixa horizontal no topo, ainda direto na tela */
@media(max-width:820px){
  .nanabot-layout{
    grid-template-columns:1fr!important;
    gap:10px!important;
    min-height:auto!important
  }
  .chat-history{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    border-radius:14px!important
  }
  .chat-history-head{
    height:44px!important
  }
  .chat-history-list{
    display:flex!important;
    gap:6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    max-height:none!important;
    padding:6px 8px 8px!important;
    scrollbar-width:none
  }
  .chat-history-list::-webkit-scrollbar{display:none}
  .chat-history-list a{
    min-width:150px!important;
    max-width:180px!important;
    flex:0 0 auto!important
  }
  .nanabot-layout .chat-page{
    height:calc(100vh - 245px)!important;
    min-height:520px!important
  }
  .chat-top{
    padding:2px 4px 10px!important
  }
  .nanabot-heading h1{
    font-size:22px!important
  }
  .chat-stream{
    padding:16px 4px!important
  }
  .chat-composer-wrap{
    padding:6px 2px 8px!important
  }
  .chat-composer{
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important
  }
}

/* Histórico infinito — Diário do Sono */
.infinite-history{
  padding:20px!important;
  margin-top:14px
}
.infinite-history .diary-history-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:12px
}
.infinite-history .diary-history-head h2{
  margin:4px 0 3px;
  font-size:18px
}
.infinite-history .diary-history-head p{
  margin:0!important;
  font-size:10.5px!important;
  color:#8c949e!important
}
.history-count{
  font-size:9.5px;
  color:#9299a3;
  white-space:nowrap
}
.infinite-history .compact-sleep-list{
  max-height:560px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  padding-right:3px
}
.infinite-history .compact-sleep-list::-webkit-scrollbar{
  width:5px
}
.infinite-history .compact-sleep-list::-webkit-scrollbar-thumb{
  background:#d8dde2;
  border-radius:99px
}
.infinite-history .compact-sleep-list article{
  min-height:66px;
  display:grid;
  grid-template-columns:110px minmax(0,1fr) 92px 30px;
  gap:12px;
  align-items:center;
  border-top:1px solid var(--line)
}
.infinite-history .compact-sleep-list article:first-child{border-top:0}
.infinite-loader{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 0 2px;
  color:#8c949e
}
.infinite-loader small,.history-end small{font-size:9.5px}
.loader-dot{
  width:7px;height:7px;border-radius:50%;
  background:linear-gradient(90deg,#6db2c8,#ed9d9c);
  animation:historyPulse 1s ease-in-out infinite
}
.history-end{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:14px 0 2px;
  color:#8c949e
}
.history-end span{font-size:11px;color:#4dbb7b}
@keyframes historyPulse{
  50%{opacity:.35;transform:scale(.8)}
}
@media(max-width:820px){
  .infinite-history{padding:15px!important}
  .infinite-history .compact-sleep-list{
    max-height:520px
  }
  .infinite-history .compact-sleep-list article{
    grid-template-columns:78px minmax(0,1fr) 28px;
    gap:8px;
    padding:9px 0
  }
  .infinite-history .sleep-list-quality{
    grid-column:2;
    width:max-content
  }
  .infinite-history .delete{
    grid-column:3;
    grid-row:1/3
  }
  .history-count{display:none}
}

/* V23 — NanaBot clean + conversas à direita */
.nanabot-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 220px!important;
  gap:18px!important;
  align-items:stretch!important;
  min-height:calc(100vh - 96px)!important;
}

/* chat principal */
.nanabot-layout .chat-page{
  min-height:calc(100vh - 96px)!important;
  height:calc(100vh - 96px)!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:16px!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:1fr auto!important;
}
.nanabot-layout .chat-top{display:none!important}

.chat-stream{
  max-width:820px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:26px 18px 20px!important;
  overflow-y:auto!important;
  min-height:0!important;
  background:#fff!important;
}
.chat-row.assistant:first-child{
  margin-top:4px!important;
}
.chat-row.assistant:first-child .chat-text{
  font-size:15px!important;
}
.chat-row.assistant:first-child .chat-text strong{
  font-size:16px!important;
  color:#1d2127!important;
}

/* conversas à direita */
.chat-history{
  position:static!important;
  transform:none!important;
  width:auto!important;
  height:calc(100vh - 96px)!important;
  max-height:calc(100vh - 96px)!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:16px!important;
}
.chat-history-head{
  height:auto!important;
  min-height:58px!important;
  padding:12px 12px 10px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
  align-items:start!important;
  border-bottom:1px solid var(--line)!important;
}
.chat-history-head h2{
  margin:0!important;
  font-size:13px!important;
  color:#20252b!important;
}
.new-chat-link{
  width:max-content!important;
  height:auto!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#17191d!important;
  font-size:10.5px!important;
  font-weight:650!important;
  text-align:left!important;
}
.new-chat-link:after{
  content:" ›";
  font-size:14px;
  vertical-align:-1px
}
.chat-history-list{
  padding:7px!important;
  max-height:calc(100% - 58px)!important;
  overflow-y:auto!important;
}
.chat-history-list a{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:6px!important;
  padding:9px 9px!important;
  border-radius:8px!important;
  font-size:10.5px!important;
  color:#606873!important;
}
.chat-history-list a:hover{
  background:#f7f8f9!important;
}
.chat-history-list a.active{
  background:#f1f3f5!important;
  color:#17191d!important;
  font-weight:650!important;
}

/* composer */
.chat-composer-wrap{
  background:#fff!important;
  max-width:820px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:8px 18px 14px!important;
}

/* mobile: conversas ficam abaixo da conversa, horizontais */
@media(max-width:820px){
  .nanabot-layout{
    grid-template-columns:1fr!important;
    gap:10px!important;
    min-height:auto!important;
  }
  .nanabot-layout .chat-page{
    height:calc(100vh - 180px)!important;
    min-height:500px!important;
  }
  .chat-history{
    height:auto!important;
    max-height:none!important;
    order:2!important;
  }
  .chat-history-head{
    min-height:44px!important;
    padding:9px 10px!important;
    grid-template-columns:1fr auto!important;
    align-items:center!important;
  }
  .chat-history-list{
    display:flex!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    max-height:none!important;
    gap:6px!important;
    padding:6px 8px 8px!important;
    scrollbar-width:none!important;
  }
  .chat-history-list::-webkit-scrollbar{display:none}
  .chat-history-list a{
    min-width:150px!important;
    max-width:180px!important;
    flex:0 0 auto!important;
  }
  .chat-stream{
    padding:20px 10px!important;
  }
  .chat-composer-wrap{
    padding:8px 10px 12px!important;
  }
}

/* V24 — NanaBot estilo Labys / ChatGPT: compacto e fluido */
.nanabot-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 250px!important;
  gap:14px!important;
  min-height:calc(100vh - 96px)!important;
  align-items:stretch!important;
}

/* conversa principal: sem card gigante "solto" */
.nanabot-layout .chat-page{
  height:calc(100vh - 96px)!important;
  min-height:620px!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:18px!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:1fr auto!important;
}

/* área de mensagens centralizada */
.chat-stream{
  width:100%!important;
  max-width:760px!important;
  margin:0 auto!important;
  padding:34px 22px 20px!important;
  overflow-y:auto!important;
  min-height:0!important;
  background:#fff!important;
}

/* Saudação compacta, sem muito espaço */
.chat-welcome{
  margin-top:0!important;
  margin-bottom:24px!important;
}
.chat-welcome .chat-text{
  padding-top:4px!important;
}
.chat-welcome .chat-text p{
  font-size:14px!important;
  line-height:1.55!important;
}
.chat-welcome .chat-text strong{
  font-size:15px!important;
}

/* mensagens em coluna, próximas e consistentes */
.chat-row.assistant{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
  margin-bottom:18px!important;
}
.chat-row.assistant .bot-mark{
  width:34px!important;
  height:34px!important;
  margin:0!important;
}
.chat-row.assistant .chat-text{
  max-width:650px!important;
  padding:2px 0 0!important;
  font-size:13px!important;
  line-height:1.6!important;
}
.chat-row.assistant .chat-text p{margin:0!important}

.chat-row.user{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 34px!important;
  gap:10px!important;
  align-items:start!important;
  margin-bottom:18px!important;
}
.chat-row.user .chat-text{
  justify-self:end!important;
  max-width:72%!important;
  background:#f2f3f5!important;
  padding:10px 13px!important;
  border-radius:14px!important;
  font-size:13px!important;
  line-height:1.5!important;
}
.chat-user-avatar{
  width:34px!important;
  height:34px!important;
}

/* composer como ChatGPT/Labys */
.chat-composer-wrap{
  width:100%!important;
  max-width:760px!important;
  margin:0 auto!important;
  padding:8px 22px 16px!important;
  background:#fff!important;
}
.suggestions{
  gap:6px!important;
  margin-bottom:8px!important;
  overflow-x:auto!important;
  scrollbar-width:none!important;
}
.suggestions::-webkit-scrollbar{display:none}
.suggestions button{
  flex:0 0 auto!important;
  border:1px solid #e1e4e8!important;
  background:#fff!important;
  border-radius:999px!important;
  padding:7px 10px!important;
  font-size:9.5px!important;
  color:#5f6772!important;
}
.chat-composer{
  height:52px!important;
  min-height:52px!important;
  max-height:52px!important;
  display:flex!important;
  align-items:center!important;
  border:1px solid #dfe3e7!important;
  border-radius:16px!important;
  padding:6px 7px 6px 14px!important;
  box-shadow:0 4px 14px rgba(20,28,38,.035)!important;
}
.chat-composer input{
  flex:1!important;
  height:38px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  margin:0!important;
  padding:0 10px 0 0!important;
  font-size:13px!important;
}
.chat-composer button{
  height:38px!important;
  min-width:70px!important;
  border-radius:11px!important;
  padding:0 13px!important;
  font-size:10.5px!important;
}
.chat-composer-wrap>small{
  display:block!important;
  text-align:center!important;
  margin-top:6px!important;
  font-size:8px!important;
  color:#a0a6ae!important;
}

/* histórico lateral: compacto, não um segundo "app" */
.chat-history{
  position:static!important;
  width:auto!important;
  height:calc(100vh - 96px)!important;
  max-height:calc(100vh - 96px)!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:18px!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
.chat-history-head{
  min-height:62px!important;
  padding:12px 12px 10px!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:8px!important;
  border-bottom:1px solid var(--line)!important;
}
.chat-history-head>div{
  min-width:0!important;
}
.chat-history-head h2{
  margin:0 0 2px!important;
  font-size:13px!important;
  line-height:1.2!important;
}
.chat-history-head small{
  display:block!important;
  font-size:8.5px!important;
  color:#9aa1aa!important;
  white-space:nowrap!important;
}
.new-chat-link{
  width:auto!important;
  height:28px!important;
  padding:0 9px!important;
  border:1px solid #e0e3e7!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#24292f!important;
  font-size:9px!important;
  font-weight:650!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
}
.new-chat-link:after{content:""!important}

.chat-history-list{
  padding:7px!important;
  overflow-y:auto!important;
  max-height:calc(100% - 62px)!important;
}
.chat-history-list a{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:7px!important;
  align-items:center!important;
  min-height:38px!important;
  padding:8px 9px!important;
  border-radius:9px!important;
  font-size:10.5px!important;
  color:#626a75!important;
}
.chat-history-list a span{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.chat-history-list a small{
  font-size:8px!important;
  color:#a0a5ad!important;
}
.chat-history-list a:hover{
  background:#f7f8f9!important;
}
.chat-history-list a.active{
  background:#f1f3f5!important;
  color:#181b20!important;
  font-weight:600!important;
}

/* mobile: conversa primeiro, histórico vira faixa compacta */
@media(max-width:820px){
  .nanabot-layout{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .nanabot-layout .chat-page{
    height:calc(100vh - 170px)!important;
    min-height:520px!important;
    border-radius:15px!important;
  }
  .chat-stream{
    padding:22px 10px 16px!important;
  }
  .chat-composer-wrap{
    padding:7px 10px 12px!important;
  }
  .chat-history{
    order:2!important;
    height:auto!important;
    max-height:none!important;
    border-radius:14px!important;
  }
  .chat-history-head{
    min-height:48px!important;
    padding:9px 10px!important;
    align-items:center!important;
  }
  .chat-history-head small{display:none!important}
  .chat-history-list{
    display:flex!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:6px!important;
    max-height:none!important;
    padding:6px 8px 8px!important;
    scrollbar-width:none!important;
  }
  .chat-history-list::-webkit-scrollbar{display:none}
  .chat-history-list a{
    min-width:145px!important;
    max-width:180px!important;
    flex:0 0 auto!important;
  }
}

/* V25 — NanaBot em uma única tela, sem cards brancos separados */
.nanabot-single{
  min-height:calc(100vh - 96px);
  display:grid;
  grid-template-rows:auto auto 1fr;
  gap:10px;
}

/* topo simples */
.nanabot-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 2px;
}
.nanabot-toolbar-btn{
  border:0;
  background:transparent;
  color:#20242a;
  font-size:11px;
  font-weight:650;
  padding:7px 9px;
  border-radius:8px;
}
.nanabot-toolbar-btn:hover{background:#eceff2}
.nanabot-toolbar-btn.primary-lite{
  background:#fff;
  border:1px solid var(--line);
}

/* histórico abre abaixo do topo, sem card */
.nanabot-history-inline{
  background:transparent;
  padding:0 2px 2px;
}
.nanabot-history-scroll{
  display:flex;
  gap:7px;
  overflow-x:auto;
  padding:3px 0 4px;
  scrollbar-width:none;
}
.nanabot-history-scroll::-webkit-scrollbar{display:none}
.nanabot-history-scroll a{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:220px;
  min-height:34px;
  padding:7px 10px;
  border-radius:9px;
  background:#fff;
  border:1px solid var(--line);
  color:#5c6570;
  font-size:10px;
}
.nanabot-history-scroll a span{
  max-width:150px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.nanabot-history-scroll a small{
  font-size:8px;
  color:#9ca3ad;
}
.nanabot-history-scroll a.active{
  color:#17191d;
  border-color:#cfd4da;
  background:#f8f9fa;
}
.history-empty-inline{
  font-size:10px;
  color:#949ba4;
}

/* um único fundo cinza contínuo */
.nanabot-chat-shell{
  min-height:0;
  height:calc(100vh - 150px);
  display:grid;
  grid-template-rows:1fr auto;
  background:transparent;
}

/* mensagens sem caixa branca externa */
.nanabot-single .chat-stream{
  width:100%!important;
  max-width:820px!important;
  margin:0 auto!important;
  padding:30px 18px 18px!important;
  overflow-y:auto!important;
  min-height:0!important;
  background:transparent!important;
}

.nanabot-single .chat-row.assistant{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:10px!important;
  margin-bottom:20px!important;
  align-items:start!important;
}
.nanabot-single .chat-row.assistant .chat-text{
  max-width:680px!important;
  font-size:13px!important;
  line-height:1.6!important;
  color:#252a31!important;
  padding:2px 0 0!important;
}
.nanabot-single .chat-row.assistant .chat-text p{margin:0!important}
.nanabot-single .chat-row.user{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 34px!important;
  gap:10px!important;
  margin-bottom:20px!important;
  align-items:start!important;
}
.nanabot-single .chat-row.user .chat-text{
  justify-self:end!important;
  max-width:72%!important;
  background:#fff!important;
  border:1px solid #e1e4e8!important;
  padding:10px 13px!important;
  border-radius:14px!important;
  font-size:13px!important;
  line-height:1.5!important;
}

/* composer único no fundo cinza */
.nanabot-single .chat-composer-wrap{
  width:100%!important;
  max-width:820px!important;
  margin:0 auto!important;
  padding:8px 18px 14px!important;
  background:transparent!important;
}
.nanabot-single .suggestions{
  display:flex!important;
  gap:6px!important;
  overflow-x:auto!important;
  margin-bottom:8px!important;
  scrollbar-width:none!important;
}
.nanabot-single .suggestions::-webkit-scrollbar{display:none}
.nanabot-single .suggestions button{
  flex:0 0 auto!important;
  border:1px solid #dfe3e7!important;
  background:#fff!important;
  border-radius:999px!important;
  padding:7px 10px!important;
  font-size:9.5px!important;
  color:#5e6671!important;
}
.nanabot-single .chat-composer{
  height:52px!important;
  min-height:52px!important;
  max-height:52px!important;
  display:flex!important;
  align-items:center!important;
  border:1px solid #d9dee3!important;
  border-radius:16px!important;
  background:#fff!important;
  padding:6px 7px 6px 14px!important;
  box-shadow:0 6px 18px rgba(22,28,36,.04)!important;
}
.nanabot-single .chat-composer input{
  flex:1!important;
  height:38px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  margin:0!important;
  padding:0 10px 0 0!important;
  font-size:13px!important;
}
.nanabot-single .chat-composer button{
  height:38px!important;
  min-width:70px!important;
  border-radius:11px!important;
  font-size:10.5px!important;
}
.nanabot-single .chat-composer-wrap>small{
  display:block!important;
  text-align:center!important;
  margin-top:6px!important;
  font-size:8px!important;
  color:#9ea5ae!important;
}

@media(max-width:820px){
  .nanabot-single{
    min-height:auto;
    gap:8px;
  }
  .nanabot-chat-shell{
    height:calc(100vh - 150px);
    min-height:520px;
  }
  .nanabot-single .chat-stream{
    padding:22px 10px 14px!important;
  }
  .nanabot-single .chat-composer-wrap{
    padding:7px 10px 12px!important;
  }
  .nanabot-toolbar{
    padding:0;
  }
}

/* V26 — refinamento geral de margens e alinhamento */
:root{--content-gap:16px}

/* consistência geral */
.page-title{margin-bottom:20px!important}
.page-title h1{line-height:1.12!important}
.page-title p{margin-top:4px!important}
.panel{overflow:visible}
.panel-head{margin-bottom:16px!important}
.main section+section{margin-top:0}

/* logo desktop e mobile mais alinhada */
.brand{
  height:58px!important;
  padding:0 12px!important;
  margin-bottom:18px!important;
  align-items:center!important;
  justify-content:flex-start!important
}
.brand img{
  width:44px!important;
  height:44px!important;
  object-fit:contain!important
}
.mobile-head>a:nth-child(2){
  display:flex!important;
  align-items:center!important;
  justify-content:center!important
}
.mobile-head>a:nth-child(2) img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important
}

/* plano NanaBot */
.plan-nanabot-link{
  margin-top:12px!important;
  display:inline-flex!important
}

/* análise de choro infinita */
.infinite-cry-history .panel-head{
  align-items:flex-start!important
}
.infinite-cry-history .panel-head h2{margin:0 0 3px!important}
.infinite-cry-history .panel-head small{
  font-size:9px;color:#939aa4
}
.infinite-cry-history .panel-head>span{
  font-size:9px;color:#969da6;white-space:nowrap
}
.infinite-cry-history .cry-list{
  max-height:520px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  padding-right:2px
}
.infinite-cry-history .cry-list::-webkit-scrollbar{width:5px}
.infinite-cry-history .cry-list::-webkit-scrollbar-thumb{
  background:#d9dde2;border-radius:99px
}
.cry-actions{
  display:flex;align-items:center;gap:7px
}
.cry-delete{
  border:0;background:#f2f4f6;
  width:27px;height:27px;border-radius:8px;
  color:#7d858f;font-size:15px;line-height:1
}
.cry-delete:hover{background:#eceff2;color:#222}
.infinite-cry-history .infinite-loader,
.infinite-cry-history .history-end{
  padding-top:12px
}

/* Sons: categorias em uma linha e layout mais respirado */
.sound-filter-tabs{
  margin-bottom:10px!important
}
.sound-category-tabs{
  display:flex;
  align-items:center;
  gap:18px;
  border-bottom:1px solid var(--line);
  margin:0 0 18px;
  overflow-x:auto;
  scrollbar-width:none
}
.sound-category-tabs::-webkit-scrollbar{display:none}
.sound-category-tabs button{
  flex:0 0 auto;
  position:relative;
  border:0;background:transparent;
  padding:9px 1px 12px;
  color:#7c848e;
  font-size:11px;
  font-weight:600;
  white-space:nowrap
}
.sound-category-tabs button.active{color:#17191d}
.sound-category-tabs button.active:after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;
  height:2px;background:#17191d;border-radius:2px 2px 0 0
}
.sound-category.hide-category{display:none!important}
.sound-category{
  margin-bottom:16px!important;
}
.sound-category h2{
  margin:0 0 14px!important;
  font-size:18px!important;
}
.spotify-grid{
  align-items:stretch!important;
}

/* Perfil: nada colado */
.profile,.preferences,.subscription{
  padding:22px!important
}
.profile-photos{
  margin-bottom:24px!important
}
.profile .fields,
.preferences .fields{
  gap:14px!important
}
.profile label,.preferences label{
  display:block;
  line-height:1.35!important
}
.profile input,.profile select,
.preferences input,.preferences select{
  margin-top:7px!important
}
.profile-actions,.preferences-actions{
  margin-top:20px!important
}
.preferences h2,.subscription h2{
  margin-bottom:16px!important
}
.subscription{
  gap:20px!important
}
.danger{
  margin-top:14px!important;
  padding:20px!important
}
.danger h2{margin-bottom:7px!important}

/* pequenas folgas em áreas do app */
.summary,.ai-tips,.routine-list,.chart-card,.diary-ai,.cry-record,.cry-history{
  padding-top:19px!important;
  padding-bottom:19px!important
}

@media(max-width:820px){
  .main{padding-left:11px!important;padding-right:11px!important}
  .brand img{width:40px!important;height:40px!important}
  .profile,.preferences,.subscription{padding:16px!important}
  .profile .fields,.preferences .fields{gap:11px!important}
  .sound-category-tabs{gap:15px!important}
  .infinite-cry-history .cry-list{max-height:500px}
}

/* V27 — Player de sons realmente em uma única linha */
.now-playing,
.sound-player,
.player-bar{
  display:grid!important;
  grid-template-columns:minmax(210px,1fr) 46px minmax(240px,1fr) auto!important;
  align-items:center!important;
  gap:16px!important;
  min-height:76px!important;
  padding:12px 16px!important;
}

/* bloco capa + nome */
.now-playing .track-info,
.sound-player .track-info,
.player-bar .track-info{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
}
.now-playing .track-info img,
.sound-player .track-info img,
.player-bar .track-info img{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  border-radius:10px!important;
  object-fit:cover!important;
}
.now-playing .track-info b,
.sound-player .track-info b,
.player-bar .track-info b{
  display:block!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* play central */
.now-playing .play-main,
.sound-player .play-main,
.player-bar .play-main{
  grid-column:2!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  margin:0!important;
  align-self:center!important;
  justify-self:center!important;
}

/* volume fica na mesma linha */
.now-playing .volume-row,
.sound-player .volume-row,
.player-bar .volume-row{
  grid-column:3!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0!important;
  min-width:0!important;
}
.now-playing .volume-row label,
.sound-player .volume-row label,
.player-bar .volume-row label{
  margin:0!important;
  white-space:nowrap!important;
}
.now-playing .volume-row input,
.sound-player .volume-row input,
.player-bar .volume-row input{
  width:100%!important;
  min-width:100px!important;
  margin:0!important;
}

/* timer também na mesma linha */
.now-playing .timer-buttons,
.sound-player .timer-buttons,
.player-bar .timer-buttons{
  grid-column:4!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  margin:0!important;
  white-space:nowrap!important;
}
.now-playing .timer-buttons button,
.sound-player .timer-buttons button,
.player-bar .timer-buttons button{
  margin:0!important;
}

/* impede filhos antigos de quebrarem para outra linha */
.now-playing>*,
.sound-player>*,
.player-bar>*{
  align-self:center!important;
}

/* tablet */
@media(max-width:1050px) and (min-width:821px){
  .now-playing,
  .sound-player,
  .player-bar{
    grid-template-columns:minmax(190px,1fr) 42px minmax(180px,.8fr) auto!important;
    gap:10px!important;
  }
}

/* mobile: ainda uma linha, com rolagem horizontal discreta se necessário */
@media(max-width:820px){
  .now-playing,
  .sound-player,
  .player-bar{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:10px!important;
    min-height:68px!important;
    padding:10px 12px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  .now-playing::-webkit-scrollbar,
  .sound-player::-webkit-scrollbar,
  .player-bar::-webkit-scrollbar{display:none!important}

  .now-playing .track-info,
  .sound-player .track-info,
  .player-bar .track-info{
    flex:0 0 180px!important;
  }
  .now-playing .play-main,
  .sound-player .play-main,
  .player-bar .play-main{
    flex:0 0 40px!important;
  }
  .now-playing .volume-row,
  .sound-player .volume-row,
  .player-bar .volume-row{
    flex:0 0 180px!important;
  }
  .now-playing .timer-buttons,
  .sound-player .timer-buttons,
  .player-bar .timer-buttons{
    flex:0 0 auto!important;
  }
}

/* V28 — correção definitiva do player real de Sons para Dormir */

/* DESKTOP */
@media(min-width:821px){
  #soundPlayer.player{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;

    min-height:68px!important;
    height:68px!important;
    padding:9px 14px!important;
    overflow:hidden!important;
  }

  #soundPlayer .player-main{
    flex:1 1 auto!important;
    min-width:0!important;

    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:11px!important;
  }

  #soundPlayer .player-cover{
    flex:0 0 42px!important;
    width:42px!important;
    height:42px!important;
    margin:0!important;
    border-radius:10px!important;
  }

  #soundPlayer .player-copy{
    flex:1 1 auto!important;
    min-width:150px!important;
    display:block!important;
    margin:0!important;
  }

  #soundPlayer .player-copy small{
    display:block!important;
    margin:0 0 1px!important;
    font-size:8px!important;
    line-height:1.1!important;
  }

  #soundPlayer .player-copy b{
    display:block!important;
    margin:0!important;
    font-size:14px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  #soundPlayer .player-copy span{
    display:block!important;
    margin-top:2px!important;
    font-size:9.5px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  #soundPlayer #playPause{
    flex:0 0 42px!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    margin:0!important;
    border-radius:50%!important;
    background:linear-gradient(90deg,#6db2c8,#ed9d9c)!important;
  }

  #soundPlayer .player-controls{
    flex:0 0 auto!important;
    min-width:430px!important;

    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:14px!important;
    margin:0!important;
  }

  #soundPlayer .player-controls label{
    flex:0 0 220px!important;
    width:220px!important;
    min-width:220px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    gap:9px!important;
    margin:0!important;
    white-space:nowrap!important;
    font-size:10px!important;
  }

  #soundPlayer #volume{
    flex:1 1 auto!important;
    width:auto!important;
    min-width:130px!important;
    margin:0!important;
    padding:0!important;
  }

  #soundPlayer .timers{
    flex:0 0 auto!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:5px!important;
    margin:0!important;
    min-width:0!important;
  }

  #soundPlayer .timers button{
    flex:0 0 auto!important;
    width:auto!important;
    margin:0!important;
    padding:7px 10px!important;
    white-space:nowrap!important;
  }
}

/* notebook mais estreito: reduz só o necessário, continua em UMA linha */
@media(min-width:821px) and (max-width:1100px){
  #soundPlayer.player{
    gap:10px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  #soundPlayer .player-controls{
    min-width:350px!important;
    gap:8px!important;
  }
  #soundPlayer .player-controls label{
    flex-basis:165px!important;
    width:165px!important;
    min-width:165px!important;
  }
  #soundPlayer #volume{
    min-width:90px!important;
  }
  #soundPlayer .timers button{
    padding:6px 7px!important;
    font-size:8px!important;
  }
}

/* MOBILE: mantém o comportamento compacto anterior */
@media(max-width:820px){
  #soundPlayer.player{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    height:auto!important;
  }
  #soundPlayer .player-main{
    display:flex!important;
    flex:1!important;
    align-items:center!important;
  }
  #soundPlayer .player-controls{
    display:none!important;
  }
}

/* V29 — Perfil com espaçamento confortável */
.profile{
  padding:24px!important;
}
.profile .fields{
  gap:18px!important;
  margin-bottom:17px!important;
}
.profile .fields.two{
  column-gap:18px!important;
  row-gap:16px!important;
}
.profile label{
  font-size:12px!important;
  line-height:1.4!important;
  color:#535c67!important;
}
.profile input,
.profile select{
  margin-top:8px!important;
  min-height:44px!important;
  padding:11px 12px!important;
}
.profile-photos{
  margin-bottom:26px!important;
  padding-bottom:20px!important;
  border-bottom:1px solid var(--line)!important;
}
.profile-actions{
  margin-top:22px!important;
}
.preferences{
  padding:24px!important;
}
.preferences form{
  gap:18px!important;
}
.preferences .fields.two{
  gap:18px!important;
}
.preferences label{
  font-size:12px!important;
}
.preferences select{
  margin-top:8px!important;
  min-height:44px!important;
}
.preferences-actions{
  margin-top:20px!important;
}

@media(max-width:820px){
  .profile,.preferences{padding:17px!important}
  .profile .fields.two,.preferences .fields.two{
    grid-template-columns:1fr!important;
    gap:13px!important;
  }
}

/* V31 — status real DeepSeek + chat mais limpo */
.nanabot-toolbar{
  justify-content:space-between!important;
  min-height:38px!important;
}
.nanabot-toolbar-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.deepseek-status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.65);
  border:1px solid #e1e4e8;
  color:#69717c;
  font-size:9.5px;
  font-weight:600;
  white-space:nowrap;
}
.deepseek-status i{
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#c5cad0;
  box-shadow:0 0 0 3px rgba(197,202,208,.12);
}
.deepseek-status.connected{
  color:#347556;
  background:#f4fbf7;
  border-color:#d9eee1;
}
.deepseek-status.connected i{
  background:#43b776;
  box-shadow:0 0 0 3px rgba(67,183,118,.12);
}
.deepseek-status.error{
  color:#9a5555;
  background:#fff7f7;
  border-color:#f0dada;
}
.deepseek-status.error i{
  background:#e26969;
  box-shadow:0 0 0 3px rgba(226,105,105,.12);
}
.deepseek-status.checking i{
  animation:deepseekPulse .9s ease-in-out infinite;
}
@keyframes deepseekPulse{50%{opacity:.35}}

/* tira a barra lateral visível, mas mantém rolagem */
.nanabot-single .chat-stream{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
.nanabot-single .chat-stream::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}

/* joga o campo de pergunta um pouco mais para baixo no desktop */
@media(min-width:821px){
  .nanabot-single .chat-composer-wrap{
    padding-top:18px!important;
    padding-bottom:16px!important;
  }
  .nanabot-single .chat-stream{
    padding-bottom:8px!important;
  }
}

/* status continua compacto no celular */
@media(max-width:820px){
  .nanabot-toolbar{
    align-items:center!important;
    gap:8px!important;
  }
  .deepseek-status{
    padding:5px 7px;
    font-size:8.5px;
  }
  .deepseek-status span{
    max-width:120px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* V33 — indicador de IA discreto: somente a bolinha */
.deepseek-status{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.deepseek-status i{
  width:8px!important;
  height:8px!important;
  margin:0!important;
}
.deepseek-status .sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

/* desktop: campo de pergunta mais próximo da parte inferior */
@media(min-width:821px){
  .nanabot-chat-shell{
    height:calc(100vh - 138px)!important;
  }
  .nanabot-single .chat-composer-wrap{
    padding-top:24px!important;
    padding-bottom:8px!important;
  }
}

/* V34 — IA interligada ao Diário, Plano e Choro */
.ai-quick{
  padding:18px!important;
  margin-bottom:14px!important;
}
.ai-quick .nanabot-suggestion-head p{
  margin:3px 0 0!important;
  font-size:10.5px!important;
  color:#858d97!important;
}
.ai-quick form{
  display:flex;
  gap:8px;
  margin-top:14px;
}
.ai-quick form input{
  flex:1;
  margin:0!important;
  min-height:42px;
}
.ai-quick form button{
  width:auto!important;
  flex:0 0 auto;
  min-width:110px;
}
.ai-preview{
  margin-top:14px;
  border-top:1px solid var(--line);
  padding-top:13px;
}
.ai-preview-card{
  display:grid;
  gap:8px;
}
.ai-preview-card h3{
  margin:0;
  font-size:13px;
}
.ai-preview-card p,.ai-preview-card small{
  margin:0!important;
  font-size:10px!important;
  color:#747d87!important;
  line-height:1.5;
}
.ai-preview-actions{
  display:flex;
  gap:7px;
  margin-top:4px;
}
.ai-preview-actions button{
  width:auto!important;
  padding:8px 11px!important;
  border-radius:9px!important;
  font-size:10px!important;
}
.ai-preview-actions .cancel-ai{
  border:1px solid var(--line);
  background:#fff;
  color:#555e68
}
.cry-ai{
  border:1px solid #dfe4e8;
  background:#fff;
  padding:6px 8px;
  border-radius:8px;
  font-size:9px;
  color:#343a42;
}
.cry-ai:hover{background:#f6f7f8}
.cry-history article p{
  white-space:pre-line;
}
@media(max-width:820px){
  .ai-quick form{
    display:grid;
    grid-template-columns:1fr;
  }
  .ai-quick form button{
    width:100%!important;
  }
}

/* V35 — respostas da NanaBot fáceis de ler */
.chat-stream .msg.bot p{
  line-height:1.62!important;
  font-size:12px!important;
}
.chat-stream .msg.bot p > p{
  margin:0 0 9px!important;
}
.chat-stream .msg.bot p > p:last-child{
  margin-bottom:0!important;
}
.chat-stream .msg.bot strong{
  font-weight:700;
  color:#20242a;
}
.chat-stream .msg.bot .nana-heading{
  margin:12px 0 6px;
  font-weight:700;
  font-size:12.5px;
  color:#20242a;
}
.chat-stream .msg.bot .nana-heading:first-child{
  margin-top:0;
}
.chat-stream .msg.bot .nana-list{
  margin:5px 0 10px 18px!important;
  padding:0!important;
}
.chat-stream .msg.bot .nana-list li{
  margin:0 0 6px!important;
  padding-left:2px;
  line-height:1.55;
}
.chat-stream .msg.bot .nana-gap{
  height:3px;
}
@media(max-width:820px){
  .chat-stream .msg.bot p{
    font-size:13px!important;
    line-height:1.6!important;
  }
}

/* V37 */
.ai-plan-quick{display:none!important}

/* V39 — histórico NanaBot compacto e apagável */
.nanabot-history-inline{
  max-width:100%!important;
  overflow:hidden!important;
}
.nanabot-history-scroll{
  max-height:150px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  padding:4px 2px 6px!important;
  scrollbar-width:thin!important;
}
.nanabot-history-scroll::-webkit-scrollbar{
  width:5px!important;
}
.nanabot-history-scroll::-webkit-scrollbar-thumb{
  background:#d8dde2!important;
  border-radius:99px!important;
}
.history-chat-item{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 26px!important;
  align-items:center!important;
  gap:4px!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:9px!important;
  overflow:hidden!important;
}
.history-chat-item.active{
  border-color:#cfd4da!important;
  background:#f7f8f9!important;
}
.history-chat-item>a{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  padding:8px 8px!important;
  color:#5d6671!important;
  font-size:10px!important;
}
.history-chat-item>a span{
  min-width:0!important;
  max-width:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.history-chat-item>a small{
  flex:0 0 auto!important;
  font-size:8px!important;
  color:#9aa1aa!important;
}
.delete-chat{
  width:24px!important;
  height:24px!important;
  border:0!important;
  background:transparent!important;
  color:#9aa1aa!important;
  font-size:14px!important;
  border-radius:7px!important;
  margin-right:3px!important;
}
.delete-chat:hover{
  background:#f0f2f4!important;
  color:#4d555f!important;
}

@media(min-width:1100px){
  .nanabot-history-scroll{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:820px){
  .nanabot-history-scroll{
    display:flex!important;
    max-height:none!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
  }
  .nanabot-history-scroll::-webkit-scrollbar{display:none!important}
  .history-chat-item{
    flex:0 0 170px!important;
    min-width:170px!important;
  }
}

/* V40 — correção final do histórico de conversas NanaBot */
#nanabotHistoryInline{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  padding:0!important;
}

#nanabotHistoryInline .nanabot-history-scroll{
  display:block!important;
  width:100%!important;
  max-height:210px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:5px 2px!important;
  margin:0!important;
  scrollbar-width:thin!important;
}

#nanabotHistoryInline .nanabot-history-scroll::-webkit-scrollbar{
  width:5px!important;
  height:5px!important;
}
#nanabotHistoryInline .nanabot-history-scroll::-webkit-scrollbar-thumb{
  background:#d8dde2!important;
  border-radius:999px!important;
}

/* cada conversa ocupa uma linha e nunca estoura */
#nanabotHistoryInline .history-chat-item{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:42px!important;
  margin:0 0 5px!important;
  padding:0!important;
  border:1px solid #e1e4e8!important;
  border-radius:10px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}

#nanabotHistoryInline .history-chat-item:last-child{
  margin-bottom:0!important;
}

#nanabotHistoryInline .history-chat-item.active{
  background:#f7f8f9!important;
  border-color:#cfd4da!important;
}

/* link ocupa a linha inteira, deixando espaço pro X */
#nanabotHistoryInline .history-chat-item > a{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:40px!important;
  padding:9px 42px 9px 11px!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#58616c!important;
  font-size:10.5px!important;
  box-sizing:border-box!important;
}

#nanabotHistoryInline .history-chat-item > a:hover{
  background:#f8f9fa!important;
}

#nanabotHistoryInline .history-chat-item > a span{
  display:block!important;
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#nanabotHistoryInline .history-chat-item > a small{
  display:block!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
  font-size:8px!important;
  color:#9aa1aa!important;
  white-space:nowrap!important;
}

/* botão excluir fica fixo no canto, sem empurrar título/data */
#nanabotHistoryInline .delete-chat{
  position:absolute!important;
  right:7px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:2!important;
  display:grid!important;
  place-items:center!important;
  width:25px!important;
  height:25px!important;
  min-width:25px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  color:#9aa1aa!important;
  font-size:14px!important;
  line-height:1!important;
}

#nanabotHistoryInline .delete-chat:hover{
  background:#eceff2!important;
  color:#383f47!important;
}

/* desktop: dropdown de conversas não cresce indefinidamente */
@media(min-width:821px){
  #nanabotHistoryInline{
    max-width:560px!important;
  }
}

/* mobile: mantém linhas compactas e fáceis de tocar */
@media(max-width:820px){
  #nanabotHistoryInline .nanabot-history-scroll{
    max-height:180px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  #nanabotHistoryInline .history-chat-item{
    min-width:0!important;
    width:100%!important;
    flex:none!important;
  }
}

/* V41 — conversas NanaBot em sidebar à esquerda */
.nanabot-workspace{
  display:grid!important;
  grid-template-columns:235px minmax(0,1fr)!important;
  gap:14px!important;
  min-height:calc(100vh - 96px)!important;
  align-items:stretch!important;
}
.nanabot-sidebar{
  height:calc(100vh - 96px)!important;
  min-height:620px!important;
  display:grid!important;
  grid-template-rows:auto 1fr!important;
  background:transparent!important;
  border:0!important;
}
.nanabot-sidebar-top{
  padding:0 0 10px!important;
}
.new-conversation-main{
  width:100%!important;
  height:38px!important;
  border:1px solid #dfe3e7!important;
  background:#fff!important;
  border-radius:10px!important;
  color:#22272e!important;
  font-size:10.5px!important;
  font-weight:650!important;
}
.new-conversation-main:hover{background:#f7f8f9!important}

.nanabot-conversation-scroll{
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:3px!important;
  scrollbar-width:none!important;
}
.nanabot-conversation-scroll::-webkit-scrollbar{display:none!important}

.conversation-group{
  margin-bottom:18px!important;
}
.conversation-group-title{
  padding:0 7px 7px!important;
  font-size:9px!important;
  font-weight:700!important;
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
  color:#979ea7!important;
}
.conversation-empty{
  padding:9px 8px!important;
  color:#a0a6ae!important;
  font-size:9.5px!important;
}

.conversation-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:25px minmax(0,1fr) 28px!important;
  align-items:center!important;
  min-height:42px!important;
  margin-bottom:3px!important;
  border-radius:9px!important;
  background:transparent!important;
}
.conversation-row:hover{
  background:#f1f3f5!important;
}
.conversation-row.active{
  background:#e9ecef!important;
}
.conversation-link{
  min-width:0!important;
  display:grid!important;
  gap:2px!important;
  padding:7px 4px!important;
  color:#535c67!important;
}
.conversation-link span{
  min-width:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:10.5px!important;
  font-weight:600!important;
}
.conversation-link small{
  font-size:8px!important;
  color:#9ba2ab!important;
}
.conversation-favorite,
.conversation-menu{
  width:25px!important;
  height:28px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#a0a6ae!important;
  border-radius:7px!important;
  font-size:13px!important;
}
.conversation-favorite.active{color:#c99b3c!important}
.conversation-favorite:hover,
.conversation-menu:hover{
  background:#e1e4e7!important;
  color:#4e5660!important;
}
.conversation-menu{
  font-size:11px!important;
  letter-spacing:1px!important;
}

.conversation-popover{
  position:absolute!important;
  right:2px!important;
  top:36px!important;
  z-index:50!important;
  width:128px!important;
  padding:5px!important;
  border:1px solid #e0e3e7!important;
  border-radius:9px!important;
  background:#fff!important;
  box-shadow:0 12px 28px rgba(21,27,34,.12)!important;
}
.conversation-popover button{
  width:100%!important;
  border:0!important;
  background:transparent!important;
  padding:8px!important;
  border-radius:7px!important;
  text-align:left!important;
  font-size:9.5px!important;
  color:#4f5862!important;
}
.conversation-popover button:hover{
  background:#f3f4f6!important;
}
.conversation-popover .danger-option{
  color:#a85353!important;
}

/* chat takes the rest of the screen */
.nanabot-workspace .nanabot-single{
  min-width:0!important;
  min-height:calc(100vh - 96px)!important;
}
.nanabot-workspace .nanabot-toolbar{
  min-height:30px!important;
}

/* edit title modal */
.rename-chat-card{
  width:min(430px,calc(100% - 26px))!important;
}
.rename-chat-card h2{
  margin:4px 0 14px!important;
  font-size:18px!important;
}
.rename-chat-card form{
  display:grid!important;
  gap:14px!important;
}
.rename-chat-card input{
  margin-top:7px!important;
}

/* mobile */
@media(max-width:820px){
  .nanabot-workspace{
    grid-template-columns:1fr!important;
    gap:10px!important;
    min-height:auto!important;
  }
  .nanabot-sidebar{
    height:auto!important;
    min-height:0!important;
    order:1!important;
  }
  .nanabot-workspace .nanabot-single{
    order:2!important;
  }
  .nanabot-conversation-scroll{
    max-height:210px!important;
    overflow-y:auto!important;
  }
  .conversation-group{
    margin-bottom:10px!important;
  }
}

/* V42 — sidebar NanaBot recolhível no desktop */
.nanabot-sidebar-top{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 32px!important;
  gap:6px!important;
  align-items:center!important;
}
.nanabot-sidebar-collapse{
  width:32px!important;
  height:38px!important;
  padding:0!important;
  border:1px solid #dfe3e7!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#59616b!important;
  font-size:20px!important;
  line-height:1!important;
}
.nanabot-sidebar-collapse:hover{background:#f5f6f7!important}

@media(min-width:821px){
  .nanabot-workspace{
    transition:grid-template-columns .2s ease!important;
  }
  .nanabot-workspace.sidebar-collapsed{
    grid-template-columns:48px minmax(0,1fr)!important;
  }
  .nanabot-workspace.sidebar-collapsed .nanabot-sidebar-top{
    grid-template-columns:1fr!important;
  }
  .nanabot-workspace.sidebar-collapsed .new-conversation-main{
    display:none!important;
  }
  .nanabot-workspace.sidebar-collapsed .nanabot-conversation-scroll{
    display:none!important;
  }
  .nanabot-workspace.sidebar-collapsed .nanabot-sidebar-collapse{
    width:40px!important;
    justify-self:center!important;
    transform:rotate(180deg);
  }
  .nanabot-workspace.sidebar-collapsed .nanabot-sidebar{
    min-width:48px!important;
  }
}
@media(max-width:820px){
  .nanabot-sidebar-collapse{display:none!important}
  .nanabot-sidebar-top{grid-template-columns:1fr!important}
}

/* V43 — Plano concluído em verde */
.routine-step:has(input[type="checkbox"]:checked),
.routine-item:has(input[type="checkbox"]:checked),
.plan-step:has(input[type="checkbox"]:checked){
  border-color:#bfe4cd!important;
  background:#f1fbf5!important;
}
.routine-step:has(input[type="checkbox"]:checked) b,
.routine-item:has(input[type="checkbox"]:checked) b,
.plan-step:has(input[type="checkbox"]:checked) b{
  color:#2f8f59!important;
}
.routine-step input[type="checkbox"]:checked,
.routine-item input[type="checkbox"]:checked,
.plan-step input[type="checkbox"]:checked{
  accent-color:#4dbb7b!important;
}
.routine-step.done,.routine-item.done,.plan-step.done,
.routine-step.completed,.routine-item.completed,.plan-step.completed{
  border-color:#bfe4cd!important;
  background:#f1fbf5!important;
}
.routine-step.done b,.routine-item.done b,.plan-step.done b,
.routine-step.completed b,.routine-item.completed b,.plan-step.completed b{
  color:#2f8f59!important;
}

/* V44 — concluído: somente check/indicador verde, sem apagar o card */
.routine-step:has(input[type="checkbox"]:checked),
.routine-item:has(input[type="checkbox"]:checked),
.plan-step:has(input[type="checkbox"]:checked),
.routine-step.done,
.routine-item.done,
.plan-step.done,
.routine-step.completed,
.routine-item.completed,
.plan-step.completed{
  background:#fff!important;
  border-color:var(--line)!important;
  opacity:1!important;
  filter:none!important;
}

.routine-step:has(input[type="checkbox"]:checked) b,
.routine-item:has(input[type="checkbox"]:checked) b,
.plan-step:has(input[type="checkbox"]:checked) b,
.routine-step.done b,
.routine-item.done b,
.plan-step.done b,
.routine-step.completed b,
.routine-item.completed b,
.plan-step.completed b{
  color:inherit!important;
  opacity:1!important;
  text-decoration:none!important;
}

/* checkbox nativo/controle marcado */
.routine-step input[type="checkbox"]:checked,
.routine-item input[type="checkbox"]:checked,
.plan-step input[type="checkbox"]:checked{
  accent-color:#4dbb7b!important;
}

/* elementos visuais que antes usavam o degradê azul/rosa ao concluir */
.routine-step:has(input[type="checkbox"]:checked) .check,
.routine-step:has(input[type="checkbox"]:checked) .checkbox,
.routine-step:has(input[type="checkbox"]:checked) .routine-check,
.routine-item:has(input[type="checkbox"]:checked) .check,
.routine-item:has(input[type="checkbox"]:checked) .checkbox,
.routine-item:has(input[type="checkbox"]:checked) .routine-check,
.plan-step:has(input[type="checkbox"]:checked) .check,
.plan-step:has(input[type="checkbox"]:checked) .checkbox,
.plan-step:has(input[type="checkbox"]:checked) .routine-check,
.routine-step.done .check,
.routine-item.done .check,
.plan-step.done .check,
.routine-step.completed .check,
.routine-item.completed .check,
.plan-step.completed .check{
  background:#4dbb7b!important;
  background-image:none!important;
  border-color:#4dbb7b!important;
  color:#fff!important;
  opacity:1!important;
}

/* se o estado concluído usa pseudo-elemento */
.routine-step:has(input[type="checkbox"]:checked)::before,
.routine-item:has(input[type="checkbox"]:checked)::before,
.plan-step:has(input[type="checkbox"]:checked)::before,
.routine-step.done::before,
.routine-item.done::before,
.plan-step.done::before,
.routine-step.completed::before,
.routine-item.completed::before,
.plan-step.completed::before{
  background:#4dbb7b!important;
  background-image:none!important;
  opacity:1!important;
}

/* V45 — Plano de Sono > Rotina: check verde sólido + texto riscado */

/* O quadrado marcado nunca usa o degradê azul/rosa */
.routine-list input[type="checkbox"]:checked,
.routine-steps input[type="checkbox"]:checked,
.plan-routine input[type="checkbox"]:checked,
.routine-step input[type="checkbox"]:checked,
.routine-item input[type="checkbox"]:checked,
.plan-step input[type="checkbox"]:checked{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  border:1px solid #4DBB7B!important;
  border-radius:5px!important;
  background:#4DBB7B!important;
  background-image:none!important;
  box-shadow:none!important;
  opacity:1!important;
  position:relative!important;
}

/* desenha o ✓ branco */
.routine-list input[type="checkbox"]:checked::after,
.routine-steps input[type="checkbox"]:checked::after,
.plan-routine input[type="checkbox"]:checked::after,
.routine-step input[type="checkbox"]:checked::after,
.routine-item input[type="checkbox"]:checked::after,
.plan-step input[type="checkbox"]:checked::after{
  content:""!important;
  position:absolute!important;
  left:5px!important;
  top:2px!important;
  width:4px!important;
  height:8px!important;
  border:solid #fff!important;
  border-width:0 2px 2px 0!important;
  transform:rotate(45deg)!important;
}

/* passo concluído: mantém o card normal e risca o conteúdo textual */
.routine-step:has(input[type="checkbox"]:checked),
.routine-item:has(input[type="checkbox"]:checked),
.plan-step:has(input[type="checkbox"]:checked){
  background:#fff!important;
  opacity:1!important;
  filter:none!important;
}

.routine-step:has(input[type="checkbox"]:checked) .routine-title,
.routine-step:has(input[type="checkbox"]:checked) .step-title,
.routine-step:has(input[type="checkbox"]:checked) .title,
.routine-step:has(input[type="checkbox"]:checked) strong,
.routine-step:has(input[type="checkbox"]:checked) b,
.routine-item:has(input[type="checkbox"]:checked) .routine-title,
.routine-item:has(input[type="checkbox"]:checked) .step-title,
.routine-item:has(input[type="checkbox"]:checked) .title,
.routine-item:has(input[type="checkbox"]:checked) strong,
.routine-item:has(input[type="checkbox"]:checked) b,
.plan-step:has(input[type="checkbox"]:checked) .routine-title,
.plan-step:has(input[type="checkbox"]:checked) .step-title,
.plan-step:has(input[type="checkbox"]:checked) .title,
.plan-step:has(input[type="checkbox"]:checked) strong,
.plan-step:has(input[type="checkbox"]:checked) b{
  text-decoration:line-through!important;
  text-decoration-thickness:1px!important;
  text-decoration-color:#727980!important;
  color:inherit!important;
  opacity:1!important;
}

/* classes de estado usadas pelo JS/PHP */
.routine-step.done .routine-title,.routine-step.done .step-title,.routine-step.done .title,.routine-step.done strong,.routine-step.done b,
.routine-item.done .routine-title,.routine-item.done .step-title,.routine-item.done .title,.routine-item.done strong,.routine-item.done b,
.plan-step.done .routine-title,.plan-step.done .step-title,.plan-step.done .title,.plan-step.done strong,.plan-step.done b,
.routine-step.completed .routine-title,.routine-step.completed .step-title,.routine-step.completed .title,.routine-step.completed strong,.routine-step.completed b,
.routine-item.completed .routine-title,.routine-item.completed .step-title,.routine-item.completed .title,.routine-item.completed strong,.routine-item.completed b,
.plan-step.completed .routine-title,.plan-step.completed .step-title,.plan-step.completed .title,.plan-step.completed strong,.plan-step.completed b{
  text-decoration:line-through!important;
  text-decoration-thickness:1px!important;
  text-decoration-color:#727980!important;
  opacity:1!important;
}

/* V46 — Plano de Sono > Rotina: bolinha verde real */
.routine-list .check-step{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:24px!important;
  height:24px!important;
  margin:0!important;
  padding:0!important;
  cursor:pointer!important;
}

.routine-list .check-step input{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* desmarcado = bolinha branca com contorno */
.routine-list .check-step span{
  display:block!important;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
  border-radius:50%!important;
  border:1.5px solid #cfd4da!important;
  background:#fff!important;
  background-image:none!important;
  box-shadow:none!important;
  position:relative!important;
  transition:.15s ease!important;
}

/* marcado = verde sólido, SEM degradê */
.routine-list .check-step input:checked + span{
  border-color:#4DBB7B!important;
  background:#4DBB7B!important;
  background-image:none!important;
  box-shadow:none!important;
}

/* check branco dentro da bolinha */
.routine-list .check-step input:checked + span::after{
  content:""!important;
  position:absolute!important;
  left:6px!important;
  top:3px!important;
  width:5px!important;
  height:9px!important;
  border:solid #fff!important;
  border-width:0 2px 2px 0!important;
  transform:rotate(45deg)!important;
}

/* rotina concluída: continua normal, apenas texto riscado */
.routine-list .routine-step.done{
  opacity:1!important;
  background:#fff!important;
  filter:none!important;
}

.routine-list .routine-step.done b,
.routine-list .routine-step.done p{
  opacity:1!important;
}

.routine-list .routine-step.done b{
  text-decoration:line-through!important;
  text-decoration-thickness:1px!important;
  text-decoration-color:#707780!important;
  color:inherit!important;
}

/* V47 — atualização discreta da sugestão do Plano */
.nanabot-plan-live.is-updating{
  opacity:.55;
  transition:opacity .15s ease;
}
.nanabot-plan-live,
.nanabot-diary-live{
  display:block;
}

/* V50 — NanaBot: sugestões abaixo da resposta */
.nanabot-followups{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:7px 0 15px 38px;
}
.nanabot-followups button{
  border:1px solid #dfe3e7;
  background:#fff;
  color:#4f5862;
  border-radius:999px;
  padding:7px 11px;
  font-size:9.5px;
  font-weight:550;
  line-height:1.2;
  cursor:pointer;
}
.nanabot-followups button:hover{
  background:#f5f6f7;
  border-color:#d3d8dd;
  color:#252a30;
}

/* "Pensando..." fica imediatamente acima da barra e só aparece durante resposta */
.nanabot-thinking{
  display:none;
  min-height:19px;
  margin:0 4px 5px;
  color:#858c95;
  font-size:9.5px;
  font-weight:550;
  letter-spacing:.01em;
}
.nanabot-thinking.show{
  display:block;
}
.nanabot-thinking .thinking-dots{
  display:inline-block;
  min-width:14px;
  animation:nanaThinkingPulse 1.1s ease-in-out infinite;
}
@keyframes nanaThinkingPulse{
  0%,100%{opacity:.35}
  50%{opacity:1}
}

@media(max-width:820px){
  .nanabot-followups{
    margin-left:34px;
    gap:6px;
  }
  .nanabot-followups button{
    padding:7px 10px;
    font-size:9px;
  }
}

/* V51 — follow-ups variam conforme a conversa */
.nanabot-followups{
  max-width:680px;
}
.nanabot-followups button{
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.nanabot-followups button:hover{
  transform:translateY(-1px);
}

/* V52 — Resumo inicial por sexo do bebê + dica compacta */

/* Menino: azul começa pela esquerda */
.gender-boy{
  background:linear-gradient(110deg,
    rgba(109,178,200,.22) 0%,
    rgba(109,178,200,.12) 38%,
    rgba(237,157,156,.10) 100%)!important;
}

/* Menina: rosa começa pela esquerda */
.gender-girl{
  background:linear-gradient(110deg,
    rgba(237,157,156,.23) 0%,
    rgba(237,157,156,.13) 38%,
    rgba(109,178,200,.09) 100%)!important;
}

/* Sem sexo definido: mantém equilíbrio atual */
.gender-neutral{
  background:linear-gradient(110deg,
    rgba(109,178,200,.14) 0%,
    rgba(237,157,156,.12) 100%)!important;
}

/* Dica da NanaBot mais curta visualmente */
.nanabot-summary-copy{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
  line-height:1.55!important;
  max-height:4.65em!important;
}

/* CTA fica sempre separado e visível embaixo */
.nanabot-summary-cta{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  margin-top:10px!important;
  color:#22272d!important;
  font-size:10.5px!important;
  font-weight:650!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
.nanabot-summary-cta span{
  font-size:14px!important;
  line-height:1!important;
}
.nanabot-summary-cta:hover{
  opacity:.68!important;
}

@media(max-width:820px){
  .nanabot-summary-copy{
    -webkit-line-clamp:3!important;
  }
  .nanabot-summary-cta{
    margin-top:9px!important;
    font-size:10px!important;
  }
}

/* V53 — CTA da dica NanaBot preso no canto inferior direito */
.ai-tips,
.nanabot-tip,
.summary-ai,
.nana-summary-card{
  position:relative!important;
}

/* dá espaço embaixo para o link nunca bater no texto */
.nanabot-summary-copy{
  padding-bottom:26px!important;
}

/* posicionamento fixo dentro do card */
.nanabot-summary-cta{
  position:absolute!important;
  right:22px!important;
  bottom:16px!important;
  margin:0!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  z-index:2!important;
}

/* mobile: continua no canto, mas com respiro menor */
@media(max-width:820px){
  .nanabot-summary-copy{
    padding-bottom:28px!important;
  }
  .nanabot-summary-cta{
    right:16px!important;
    bottom:14px!important;
  }
}

/* V54 — CTA da NanaBot sempre no rodapé do card, independentemente do tamanho da mensagem */

/* card da dica vira coluna */
.ai-tips,
.nanabot-tip,
.summary-ai,
.nana-summary-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
}

/* conteúdo ocupa o espaço normalmente */
.nanabot-summary-copy{
  position:static!important;
  display:block!important;
  max-height:none!important;
  overflow:visible!important;
  -webkit-line-clamp:unset!important;
  -webkit-box-orient:unset!important;
  padding-bottom:0!important;
  margin-bottom:12px!important;
}

/* CTA deixa de ser absoluto e vai sempre para a última linha do card */
.nanabot-summary-cta{
  position:static!important;
  right:auto!important;
  bottom:auto!important;
  align-self:flex-end!important;
  margin-top:auto!important;
  margin-right:0!important;
  margin-bottom:0!important;
  padding-top:2px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:4px!important;
  width:auto!important;
  white-space:nowrap!important;
}

/* se o card interno tiver wrapper de conteúdo, garante coluna também */
.ai-tips .tip-body,
.ai-tips .ai-body,
.nanabot-tip .tip-body,
.summary-ai .tip-body,
.nana-summary-card .tip-body{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  flex:1 1 auto!important;
}

/* mobile */
@media(max-width:820px){
  .nanabot-summary-copy{
    margin-bottom:10px!important;
  }
  .nanabot-summary-cta{
    align-self:flex-end!important;
    margin-top:4px!important;
  }
}

/* V55 — Diário: sugestão real do DeepSeek */
#diaryNanaSuggestion,
.nanabot-diary-live{
  display:block;
  transition:opacity .18s ease;
}
#diaryNanaSuggestion.is-updating,
.nanabot-diary-live.is-updating{
  opacity:.55;
}

/* V56 — alvo correto da IA no Diário */
#diaryNanaSuggestion{
  display:block!important;
}
#diaryNanaSuggestion .diary-ai-loading{
  color:#9198a1!important;
  font-size:10.5px!important;
  font-style:normal!important;
}

/* V57 — Diário usa o mesmo fluxo assíncrono do Plano */
.nanabot-diary-live{
  display:block!important;
  transition:opacity .18s ease!important;
}
.nanabot-diary-live.is-updating{
  opacity:.55!important;
}

/* V58 — análise de choro Gemini + NanaBot */
.cry-analyzing{margin-top:10px;font-size:10px;color:#7f8790;text-align:center}
.cry-nana-result{margin-top:12px;padding:13px 14px;border-radius:12px;background:#f7f8f9;border:1px solid #e9ecef}
.cry-nana-result .eyebrow{display:block;margin-bottom:6px;font-size:8px;letter-spacing:.06em;color:#8a929c}
.cry-nana-result p{margin:0!important;font-size:11px!important;line-height:1.58!important;color:#3f4650!important}
.cry-nana-result p p{margin:0 0 6px!important}
.cry-nana-result a{display:flex;justify-content:flex-end;align-items:center;gap:4px;margin-top:9px;color:#22272d;font-size:9.5px;font-weight:650;text-decoration:none}
.cry-nana-result a:hover{opacity:.68}
#sendCry:disabled{opacity:.6;cursor:wait}

/* V59 — Análise de Choro refinada */

/* Botão principal de gravação vermelho */
.cry-record .big-record{
  width:78px!important;
  height:78px!important;
  border-radius:50%!important;
  border:0!important;
  background:#ef6f72!important;
  background-image:none!important;
  box-shadow:0 8px 24px rgba(239,111,114,.18)!important;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease!important;
}
.cry-record .big-record:hover{
  transform:scale(1.025)!important;
  box-shadow:0 10px 28px rgba(239,111,114,.22)!important;
}
.cry-record .big-record>span{
  width:24px!important;
  height:24px!important;
  border-radius:50%!important;
  background:#fff!important;
  display:block!important;
  margin:auto!important;
}
.cry-record .big-record.recording{
  background:#df555a!important;
  animation:cryRecordPulse 1.4s ease-in-out infinite!important;
}
.cry-record .big-record.recording>span{
  width:22px!important;
  height:22px!important;
  border-radius:6px!important;
}
@keyframes cryRecordPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(239,111,114,.22)}
  50%{box-shadow:0 0 0 10px rgba(239,111,114,.05)}
}

.cry-record{
  text-align:center!important;
}
.cry-record h2{
  margin-bottom:5px!important;
}
.cry-record>p{
  max-width:380px!important;
  margin:0 auto 20px!important;
  color:#7b838d!important;
}
.cry-record #recordLabel{
  display:block!important;
  margin-top:12px!important;
  font-size:11px!important;
}
.cry-record #recordTime{
  display:block!important;
  margin-top:3px!important;
}

/* Resultado NanaBot */
.cry-nana-result{
  padding:14px 15px!important;
  background:#f8f9fa!important;
  border:1px solid #e8ebee!important;
  border-radius:12px!important;
}
.cry-nana-result>p{
  margin:0!important;
  color:#424951!important;
  line-height:1.6!important;
}
.cry-result-actions{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
  margin-top:11px!important;
  padding-top:9px!important;
  border-top:1px solid #e7e9ec!important;
}
.cry-listen{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  width:auto!important;
  min-height:30px!important;
  padding:5px 8px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:#3f4750!important;
  font-size:9.5px!important;
  font-weight:650!important;
}
.cry-listen:hover{
  background:#eef1f3!important;
}
.cry-listen span{
  display:inline-grid!important;
  place-items:center!important;
  width:18px!important;
  height:18px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid #dfe3e7!important;
  font-size:7px!important;
}
.cry-listen:disabled{
  opacity:.6!important;
}
.cry-result-actions>a{
  margin:0!important;
  padding:0!important;
  flex:0 0 auto!important;
}

@media(max-width:620px){
  .cry-record .big-record{
    width:72px!important;
    height:72px!important;
  }
  .cry-result-actions{
    align-items:flex-end!important;
  }
  .cry-listen{
    padding-left:4px!important;
  }
}

/* V60 — botão de gravação vermelho: seletor exato */
#recordBtn,
.cry-record #recordBtn,
.cry-record .big-record,
button#recordBtn.big-record,
button#recordBtn.cry-record-button{
  width:78px!important;
  height:78px!important;
  min-width:78px!important;
  min-height:78px!important;
  border-radius:50%!important;
  border:0!important;
  background:#EF6F72!important;
  background-color:#EF6F72!important;
  background-image:none!important;
  box-shadow:0 8px 24px rgba(239,111,114,.20)!important;
  opacity:1!important;
  filter:none!important;
}

#recordBtn > span,
.cry-record #recordBtn > span{
  display:block!important;
  width:23px!important;
  height:23px!important;
  margin:auto!important;
  border-radius:50%!important;
  background:#fff!important;
  background-color:#fff!important;
  background-image:none!important;
}

#recordBtn.recording,
.cry-record #recordBtn.recording{
  background:#D95359!important;
  background-color:#D95359!important;
  background-image:none!important;
}

#recordBtn.recording > span,
.cry-record #recordBtn.recording > span{
  width:21px!important;
  height:21px!important;
  border-radius:6px!important;
  background:#fff!important;
}

/* V62 — Análise de Choro: Nova gravação fixa no desktop */
@media(min-width:821px){
  .cry-layout-sticky{
    display:grid!important;
    grid-template-columns:minmax(260px,34%) minmax(0,1fr)!important;
    gap:16px!important;
    align-items:start!important;
  }

  .cry-layout-sticky .cry-record{
    position:sticky!important;
    top:18px!important;
    align-self:start!important;
    z-index:3!important;
    height:auto!important;
    max-height:calc(100vh - 36px)!important;
  }

  .cry-layout-sticky .cry-history{
    position:relative!important;
    min-width:0!important;
    overflow:visible!important;
  }
}

/* Mobile/tablet: fluxo normal */
@media(max-width:820px){
  .cry-layout-sticky{
    display:block!important;
  }

  .cry-layout-sticky .cry-record{
    position:static!important;
    top:auto!important;
    max-height:none!important;
    margin-bottom:12px!important;
  }
}

/* V63 — Nova gravação compacta, quadradinha e fixa no topo */
@media(min-width:821px){

  .cry-layout-sticky{
    display:grid!important;
    grid-template-columns:320px minmax(0,1fr)!important;
    gap:16px!important;
    align-items:start!important;
  }

  .cry-layout-sticky .cry-record{
    position:sticky!important;
    top:16px!important;
    align-self:start!important;

    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;

    padding:28px 24px 24px!important;
    margin:0!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;

    border-radius:18px!important;
    overflow:visible!important;
  }

  .cry-layout-sticky .cry-record h2{
    margin:0 0 5px!important;
    font-size:20px!important;
    line-height:1.2!important;
  }

  .cry-layout-sticky .cry-record > p{
    margin:0 auto 20px!important;
    max-width:245px!important;
    font-size:12px!important;
    line-height:1.45!important;
  }

  .cry-layout-sticky .cry-record #recordBtn{
    margin:4px auto 10px!important;
  }

  .cry-layout-sticky .cry-record #recordLabel{
    margin-top:4px!important;
  }

  .cry-layout-sticky .cry-record #recordTime{
    margin-bottom:0!important;
  }

  .cry-layout-sticky .cry-record #sendCry{
    margin-top:14px!important;
    width:auto!important;
    min-width:150px!important;
  }

  .cry-layout-sticky .cry-record #cryAnalyzing{
    margin-top:10px!important;
  }

  /* histórico continua crescendo normalmente */
  .cry-layout-sticky .cry-history{
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
  }
}

/* Mobile continua em fluxo normal */
@media(max-width:820px){
  .cry-layout-sticky .cry-record{
    position:static!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
  }
}

/* V64 — Player de Sons preso embaixo da área do app */

/* Desktop */
@media(min-width:821px){
  #soundPlayer.sound-player-docked{
    position:fixed!important;
    left:calc(var(--sidebar-w, 228px) + 24px)!important;
    right:24px!important;
    bottom:18px!important;
    z-index:70!important;

    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:10px 14px!important;

    border:1px solid #e1e5e9!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.97)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    box-shadow:0 10px 28px rgba(24,30,38,.10)!important;
  }

  /* quando visível, cria respiro no final da página de sons */
  body:has(#soundPlayer:not(.hidden)) .sounds-page,
  body:has(#soundPlayer:not(.hidden)) .sounds-content,
  body:has(#soundPlayer:not(.hidden)) .sounds-page-docked{
    padding-bottom:92px!important;
  }
}

/* Mobile: acima da navegação inferior */
@media(max-width:820px){
  #soundPlayer.sound-player-docked{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:72px!important;
    z-index:90!important;

    width:auto!important;
    margin:0!important;
    padding:9px 11px!important;

    border:1px solid #e2e5e8!important;
    border-radius:13px!important;
    background:rgba(255,255,255,.98)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
    box-shadow:0 10px 24px rgba(24,30,38,.12)!important;
  }

  body:has(#soundPlayer:not(.hidden)) .sounds-page,
  body:has(#soundPlayer:not(.hidden)) .sounds-content,
  body:has(#soundPlayer:not(.hidden)) .sounds-page-docked{
    padding-bottom:150px!important;
  }
}

/* deixa o player em uma linha compacta */
#soundPlayer.sound-player-docked{
  align-items:center!important;
  gap:10px!important;
}

#soundPlayer.sound-player-docked .player-track,
#soundPlayer.sound-player-docked .sound-player-track,
#soundPlayer.sound-player-docked .now-track{
  min-width:0!important;
  flex:1 1 auto!important;
}

#soundPlayer.sound-player-docked #trackTitle{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#soundPlayer.sound-player-docked #trackDesc{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* player só aparece quando alguma faixa toca */
#soundPlayer.hidden{
  display:none!important;
}

/* V65 — player NÃO flutua. Fica dentro de Sons, após todas as categorias. */
.sounds-player-bottom-wrap{
  position:static!important;
  display:block!important;
  width:100%!important;
  margin:16px 0 0!important;
  padding:0!important;
  clear:both!important;
}
#soundPlayer,
#soundPlayer.player{
  position:static!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  z-index:auto!important;
  transform:none!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:11px 14px!important;
  background:#fff!important;
  border:1px solid #e1e5e8!important;
  border-radius:14px!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#soundPlayer.hidden{display:none!important}
#soundPlayer:not(.hidden){display:block!important}
body:has(#soundPlayer:not(.hidden)) .sound-page,
body:has(#soundPlayer:not(.hidden)) .sounds-page,
body:has(#soundPlayer:not(.hidden)) .sounds-content,
body:has(#soundPlayer:not(.hidden)) .sounds-page-docked{
  padding-bottom:0!important;
}
@media(max-width:820px){
  .sounds-player-bottom-wrap{margin-top:12px!important}
  #soundPlayer,#soundPlayer.player{
    position:static!important;
    inset:auto!important;
    width:100%!important;
  }
}

/* V66 — player exatamente entre as abas e as categorias */
.sounds-player-bottom-wrap{
  display:none!important;
}

.sounds-player-inline-wrap{
  display:block!important;
  width:100%!important;
  margin:10px 0 14px!important;
  padding:0!important;
}

.sounds-player-inline-wrap #soundPlayer,
.sounds-player-inline-wrap .player{
  position:static!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  z-index:auto!important;
  transform:none!important;

  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:10px 14px!important;

  border:1px solid #e1e5e8!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

.sounds-player-inline-wrap #soundPlayer.hidden{
  display:none!important;
}

.sounds-player-inline-wrap #soundPlayer:not(.hidden){
  display:block!important;
}

/* deixa bem compacto para ocupar só uma faixa */
.sounds-player-inline-wrap .player-main{
  min-height:42px!important;
}

.sounds-player-inline-wrap .player-controls{
  margin-top:8px!important;
}

/* remove qualquer espaço extra herdado das versões anteriores */
body:has(#soundPlayer:not(.hidden)) .sound-page,
body:has(#soundPlayer:not(.hidden)) .sounds-page,
body:has(#soundPlayer:not(.hidden)) .sounds-content,
body:has(#soundPlayer:not(.hidden)) .sounds-page-docked{
  padding-bottom:0!important;
}

@media(max-width:820px){
  .sounds-player-inline-wrap{
    margin:8px 0 12px!important;
  }
  .sounds-player-inline-wrap #soundPlayer{
    position:static!important;
    width:100%!important;
  }
}

/* V67 — Player de Sons corrigido: uma barra horizontal no desktop */
.sounds-player-inline-wrap{
  margin:10px 0 14px!important;
}

.sounds-player-inline-wrap #soundPlayer{
  display:none!important;
  width:100%!important;
  padding:10px 14px!important;
  overflow:hidden!important;
}

.sounds-player-inline-wrap #soundPlayer:not(.hidden){
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:18px!important;
}

/* Bloco faixa */
.sounds-player-inline-wrap .player-main{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 42px!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  min-height:44px!important;
}

.sounds-player-inline-wrap .player-cover{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:10px!important;
  background:#f4f6f7!important;
  font-size:18px!important;
}

.sounds-player-inline-wrap .player-copy{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:1px!important;
}

.sounds-player-inline-wrap .player-copy small{
  font-size:8px!important;
  line-height:1.2!important;
  color:#9aa1aa!important;
}

.sounds-player-inline-wrap .player-copy b{
  font-size:12px!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.sounds-player-inline-wrap .player-copy span{
  font-size:9px!important;
  line-height:1.25!important;
  color:#7d858f!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Play alinhado à direita do bloco da faixa */
.sounds-player-inline-wrap #playPause{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
}

/* Volume e timer no mesmo nível */
.sounds-player-inline-wrap .player-controls{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  margin:0!important;
  min-width:0!important;
}

.sounds-player-inline-wrap .player-controls label{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  margin:0!important;
  font-size:8.5px!important;
  color:#717983!important;
  white-space:nowrap!important;
}

.sounds-player-inline-wrap #volume{
  width:150px!important;
  max-width:150px!important;
  margin:0!important;
}

.sounds-player-inline-wrap .timers{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex-wrap:nowrap!important;
}

.sounds-player-inline-wrap .timers button{
  height:30px!important;
  min-width:48px!important;
  padding:0 9px!important;
  border-radius:8px!important;
  font-size:8.5px!important;
  white-space:nowrap!important;
}

/* Desktop grande: tudo em uma linha */
@media(min-width:1100px){
  .sounds-player-inline-wrap #soundPlayer:not(.hidden){
    grid-template-columns:minmax(300px,1fr) auto!important;
  }
}

/* Tablet/mobile: duas linhas limpas, sem corte */
@media(max-width:1099px){
  .sounds-player-inline-wrap #soundPlayer:not(.hidden){
    grid-template-columns:1fr!important;
    gap:9px!important;
  }

  .sounds-player-inline-wrap .player-controls{
    justify-content:flex-start!important;
    padding-top:8px!important;
    border-top:1px solid #edf0f2!important;
  }

  .sounds-player-inline-wrap #volume{
    width:min(180px,42vw)!important;
  }
}

@media(max-width:620px){
  .sounds-player-inline-wrap #soundPlayer{
    padding:10px 11px!important;
  }

  .sounds-player-inline-wrap .player-main{
    grid-template-columns:38px minmax(0,1fr) 38px!important;
  }

  .sounds-player-inline-wrap .player-cover{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }

  .sounds-player-inline-wrap #playPause{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
  }

  .sounds-player-inline-wrap .player-controls{
    flex-wrap:wrap!important;
    gap:8px!important;
  }

  .sounds-player-inline-wrap .player-controls label{
    width:100%!important;
  }

  .sounds-player-inline-wrap #volume{
    flex:1 1 auto!important;
    width:auto!important;
    max-width:none!important;
  }
}

/* V68 — nova categoria sem quebrar as abas */
.sound-category-tabs{
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
}
.sound-category-tabs::-webkit-scrollbar{display:none!important}
.sound-category-tabs button{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}

/* V69 — respiro entre as categorias de Sons para Dormir */
.sound-category-tabs{
  gap:18px!important;
}
.sound-category-tabs button{
  padding-left:2px!important;
  padding-right:2px!important;
}
@media(max-width:820px){
  .sound-category-tabs{
    gap:15px!important;
  }
}

/* V70 — Perfil com a mesma largura visual das demais páginas */
@media(min-width:821px){
  .profile-page,
  .profile-wrap,
  .profile-grid,
  .profile-content,
  .profile-section,
  .preferences-page,
  .preferences-wrap{
    width:100%!important;
    max-width:none!important;
  }

  /* cards/blocos principais do perfil acompanham o container da página */
  .profile-page .panel,
  .profile-wrap .panel,
  .profile-grid .panel,
  .profile-content .panel{
    width:100%!important;
    max-width:none!important;
  }
}

/* V71 — Perfil realmente na mesma largura das outras páginas */
@media(min-width:821px){

  .profile-page-wide{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }

  .profile-page-wide .page-title,
  .profile-page-wide form.profile,
  .profile-page-wide .preferences,
  .profile-page-wide .subscription,
  .profile-page-wide .danger{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* remove limites antigos específicos do perfil */
  .profile-page-wide form.profile.panel,
  .profile-page-wide section.panel.preferences,
  .profile-page-wide section.panel.subscription{
    max-width:none!important;
    width:100%!important;
  }

  /* mantém conteúdo interno confortável, mas usando toda a largura */
  .profile-page-wide form.profile{
    padding-left:24px!important;
    padding-right:24px!important;
  }

  .profile-page-wide .preferences,
  .profile-page-wide .subscription,
  .profile-page-wide .danger{
    padding-left:24px!important;
    padding-right:24px!important;
  }

  /* campos continuam em duas colunas */
  .profile-page-wide .fields.two{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:18px!important;
  }
}

/* mobile preservado */
@media(max-width:820px){
  .profile-page-wide{
    width:100%!important;
  }
}

/* =========================================================
   V72 — AUTENTICAÇÃO DORMEBABY
========================================================= */
.auth-v72{
  --auth-blue:#6DB2C8;
  --auth-pink:#ED9D9C;
  --auth-text:#181b20;
  --auth-muted:#717985;
  min-height:100vh;
  margin:0;
  background:
    radial-gradient(circle at 10% 5%,rgba(109,178,200,.10),transparent 28%),
    radial-gradient(circle at 95% 95%,rgba(237,157,156,.10),transparent 30%),
    #f6f7f9;
  color:var(--auth-text);
}
.auth-v72 *{box-sizing:border-box}
.auth-v72-shell{
  width:min(100%,520px);
  min-height:100vh;
  margin:0 auto;
  padding:38px 20px 28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.auth-v72-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin:0 0 18px;
}
.auth-v72-brand img{width:34px;height:34px;object-fit:contain}
.auth-v72-brand span{font-size:14px;font-weight:720;letter-spacing:-.02em}
.auth-v72-card{
  width:100%;
  padding:30px;
  border:1px solid #e1e4e8;
  border-radius:20px;
  background:rgba(255,255,255,.97);
  box-shadow:0 18px 50px rgba(28,35,43,.055);
}
.auth-kicker{
  margin-bottom:6px;
  font-size:8.5px;
  font-weight:750;
  letter-spacing:.11em;
  color:#969da6;
}
.auth-v72-card h1{
  margin:0;
  font-size:25px;
  line-height:1.15;
  letter-spacing:-.035em;
}
.auth-sub{
  margin:8px 0 22px;
  font-size:11px;
  line-height:1.55;
  color:var(--auth-muted);
}
.auth-form{display:grid;gap:14px}
.auth-form label{
  display:grid;
  gap:6px;
  font-size:9.5px;
  font-weight:650;
  color:#5f6873;
}
.auth-form input{
  width:100%;
  height:44px;
  padding:0 13px;
  border:1px solid #dfe3e7;
  border-radius:10px;
  outline:0;
  background:#fff;
  color:#22262b;
  font:inherit;
  font-size:11px;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.auth-form input:focus{
  border-color:#a9b8c0;
  box-shadow:0 0 0 3px rgba(109,178,200,.09);
}
.auth-two{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.password-field{position:relative}
.password-field input{padding-right:65px}
.password-field button{
  position:absolute;
  right:8px;top:50%;
  transform:translateY(-50%);
  border:0;background:transparent;
  color:#7d858e;
  font-size:8.5px;font-weight:650;
  cursor:pointer;
}
.auth-primary{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:44px;
  margin-top:2px;
  padding:0 15px;
  border:0;
  border-radius:10px;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C);
  color:#fff;
  font-size:10.5px;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  transition:transform .15s ease,opacity .15s ease;
}
.auth-primary:hover{transform:translateY(-1px)}
.auth-link-button{margin-top:18px}
.auth-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:16px;
}
.auth-meta a,.auth-bottom a,.auth-resend button{
  color:#252a30;
  font-size:9.5px;
  font-weight:650;
  text-decoration:none;
}
.auth-bottom{
  margin:20px 0 0;
  text-align:center;
  color:#8a919a;
  font-size:9.5px;
}
.auth-divider{
  display:flex;align-items:center;gap:10px;
  margin:18px 0 0;color:#a0a6ae;font-size:8px;
}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:#eceef0;flex:1}
.auth-alert{
  margin:0 0 15px;
  padding:10px 12px;
  border-radius:9px;
  font-size:9.5px;
  line-height:1.45;
}
.auth-alert.error{background:#fff3f3;color:#995151;border:1px solid #f3dddd}
.auth-alert.success{background:#f1faf5;color:#47795b;border:1px solid #dceddf}
.auth-legal{
  max-width:390px;
  margin:14px auto 0;
  text-align:center;
  font-size:8px;
  line-height:1.5;
  color:#a0a6ad;
}
.auth-steps{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 22px;
}
.auth-steps span{
  display:grid;place-items:center;
  width:24px;height:24px;
  border:1px solid #dfe3e7;
  border-radius:50%;
  color:#9aa1a9;
  font-size:8.5px;font-weight:700;
}
.auth-steps span.active{
  border-color:transparent;
  background:linear-gradient(135deg,#6DB2C8,#ED9D9C);
  color:#fff;
}
.auth-steps span.done{
  border-color:#65b987;background:#65b987;color:#fff;
}
.auth-steps i{width:38px;height:1px;background:#e4e7ea}
.auth-steps i.done{background:#65b987}
.auth-code-card{text-align:center}
.auth-mail-icon,.auth-success-icon{
  width:48px;height:48px;
  margin:0 auto 15px;
  display:grid;place-items:center;
  border-radius:14px;
  background:#f5f6f8;
  font-size:18px;
}
.auth-success-icon{background:#eef9f2;color:#4b9a6a}
.auth-code-input{
  height:60px!important;
  text-align:center!important;
  font-size:24px!important;
  font-weight:720!important;
  letter-spacing:10px!important;
  padding-left:22px!important;
}
.auth-code-inline{
  font-size:16px!important;
  font-weight:700!important;
  letter-spacing:5px!important;
}
.auth-resend{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:5px;
  margin-top:15px;
  color:#939aa2;
  font-size:9px;
}
.auth-resend button{
  border:0;background:transparent;padding:0;cursor:pointer;
}
.auth-resend button:hover{text-decoration:underline}

@media(min-width:1000px){
  .auth-v72-shell{width:480px;padding-top:32px;padding-bottom:32px}
}
@media(max-width:620px){
  .auth-v72-shell{
    width:100%;
    min-height:100svh;
    padding:20px 14px;
    justify-content:center;
  }
  .auth-v72-card{
    padding:24px 18px;
    border-radius:17px;
  }
  .auth-v72-card h1{font-size:23px}
  .auth-two{grid-template-columns:1fr}
  .auth-v72-brand{margin-bottom:13px}
  .auth-code-input{font-size:22px!important;letter-spacing:8px!important}
}

/* =========================================================
   V73 — Auth desktop maior, no padrão visual do aplicativo
========================================================= */
.auth-v72-brand{
  margin-bottom:22px!important;
}
.auth-v72-brand img{
  width:48px!important;
  height:48px!important;
}

/* computador */
@media(min-width:821px){
  .auth-v72-shell{
    width:min(100%,760px)!important;
    max-width:760px!important;
    padding:46px 28px 34px!important;
  }

  .auth-v72-card{
    width:100%!important;
    max-width:none!important;
    padding:42px 46px!important;
    border-radius:22px!important;
  }

  .auth-kicker{
    font-size:11px!important;
    margin-bottom:8px!important;
  }

  .auth-v72-card h1{
    font-size:34px!important;
    line-height:1.12!important;
  }

  .auth-sub{
    margin-top:10px!important;
    margin-bottom:28px!important;
    font-size:14px!important;
    line-height:1.55!important;
  }

  .auth-form{
    gap:18px!important;
  }

  .auth-form label{
    gap:8px!important;
    font-size:12px!important;
  }

  .auth-form input{
    height:54px!important;
    padding:0 16px!important;
    border-radius:11px!important;
    font-size:14px!important;
  }

  .password-field input{
    padding-right:78px!important;
  }

  .password-field button{
    right:12px!important;
    font-size:11px!important;
  }

  .auth-meta{
    min-height:20px!important;
  }

  .auth-meta a,
  .auth-bottom a,
  .auth-resend button{
    font-size:12px!important;
  }

  .auth-primary{
    min-height:54px!important;
    border-radius:11px!important;
    font-size:13px!important;
  }

  .auth-bottom{
    margin-top:24px!important;
    font-size:12px!important;
  }

  .auth-divider{
    margin-top:22px!important;
    font-size:10px!important;
  }

  .auth-legal{
    max-width:610px!important;
    margin-top:17px!important;
    font-size:10px!important;
  }

  .auth-alert{
    padding:12px 14px!important;
    font-size:12px!important;
  }

  .auth-code-input{
    height:68px!important;
    font-size:30px!important;
  }

  .auth-code-inline{
    font-size:20px!important;
  }

  .auth-resend{
    margin-top:18px!important;
    font-size:11px!important;
  }

  .auth-steps span{
    width:30px!important;
    height:30px!important;
    font-size:11px!important;
  }

  .auth-steps i{
    width:52px!important;
  }

  .auth-mail-icon,
  .auth-success-icon{
    width:58px!important;
    height:58px!important;
    font-size:22px!important;
  }
}

/* mobile continua compacto */
@media(max-width:820px){
  .auth-v72-brand img{
    width:40px!important;
    height:40px!important;
  }
}

/* =========================================================
   V74 — Auth equilibrado + logo dentro do card
========================================================= */

/* neutraliza o tamanho exagerado da V73 */
.auth-v72-brand{
  margin:0 0 20px!important;
  justify-content:flex-start!important;
}

/* não estica a imagem pequena: caixa visual limpa */
.auth-v72-brand img{
  width:34px!important;
  height:34px!important;
  max-width:34px!important;
  max-height:34px!important;
  object-fit:contain!important;
  image-rendering:auto!important;
  transform:none!important;
}

/* computador: meio-termo entre V72 e V73 */
@media(min-width:821px){
  .auth-v72-shell{
    width:min(100%,620px)!important;
    max-width:620px!important;
    padding:38px 24px 30px!important;
  }

  .auth-v72-card{
    width:100%!important;
    max-width:none!important;
    padding:34px 36px!important;
    border-radius:20px!important;
  }

  .auth-kicker{
    font-size:9.5px!important;
    margin-bottom:7px!important;
  }

  .auth-v72-card h1{
    font-size:29px!important;
    line-height:1.14!important;
  }

  .auth-sub{
    margin-top:9px!important;
    margin-bottom:24px!important;
    font-size:12.5px!important;
    line-height:1.55!important;
  }

  .auth-form{gap:15px!important}

  .auth-form label{
    gap:7px!important;
    font-size:10.5px!important;
  }

  .auth-form input{
    height:49px!important;
    padding:0 14px!important;
    font-size:12.5px!important;
  }

  .password-field input{padding-right:72px!important}
  .password-field button{font-size:9.5px!important}

  .auth-meta a,
  .auth-bottom a,
  .auth-resend button{
    font-size:10.5px!important;
  }

  .auth-primary{
    min-height:49px!important;
    font-size:11.5px!important;
  }

  .auth-bottom{
    margin-top:21px!important;
    font-size:10.5px!important;
  }

  .auth-divider{
    margin-top:19px!important;
    font-size:9px!important;
  }

  .auth-legal{
    max-width:500px!important;
    font-size:8.5px!important;
  }

  .auth-alert{font-size:10.5px!important}

  .auth-code-input{
    height:62px!important;
    font-size:26px!important;
  }

  .auth-code-inline{font-size:18px!important}

  .auth-steps span{
    width:27px!important;
    height:27px!important;
    font-size:9.5px!important;
  }
  .auth-steps i{width:44px!important}

  .auth-mail-icon,.auth-success-icon{
    width:52px!important;
    height:52px!important;
    font-size:20px!important;
  }
}

/* mobile: logo também fica dentro do card */
@media(max-width:820px){
  .auth-v72-brand{
    margin-bottom:18px!important;
  }
  .auth-v72-brand img{
    width:32px!important;
    height:32px!important;
  }
}

/* =========================================================
   V75 — Auth split: foto à esquerda + formulário à direita
========================================================= */

.auth-split-shell{
  width:min(100%,1180px)!important;
  max-width:1180px!important;
  min-height:100vh!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(430px,520px)!important;
  gap:0!important;
  align-items:center!important;
  padding:28px!important;
}

.auth-split-visual{
  position:relative!important;
  height:min(720px,calc(100vh - 56px))!important;
  min-height:560px!important;
  overflow:hidden!important;
  border-radius:24px 0 0 24px!important;
  background:#eee!important;
}

.auth-split-visual img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
}

.auth-photo-note{
  position:absolute!important;
  left:26px!important;
  right:26px!important;
  bottom:24px!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:16px 18px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.92)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  border:1px solid rgba(255,255,255,.6)!important;
}

.auth-photo-note>span{
  display:grid!important;
  place-items:center!important;
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  border-radius:50%!important;
  color:#ED9D9C!important;
  font-size:24px!important;
}

.auth-photo-note div{
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
}

.auth-photo-note b{
  font-size:13px!important;
  color:#1c2025!important;
}

.auth-photo-note small{
  font-size:10px!important;
  color:#7b838d!important;
}

.auth-split-form{
  height:min(720px,calc(100vh - 56px))!important;
  min-height:560px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:42px 36px!important;
  background:#fff!important;
  border:1px solid #e2e5e8!important;
  border-left:0!important;
  border-radius:0 24px 24px 0!important;
}

.auth-split-form .auth-v72-card{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
}

.auth-split-form .auth-v72-brand{
  margin-bottom:26px!important;
}

.auth-split-form .auth-v72-brand img{
  width:38px!important;
  height:38px!important;
  max-width:38px!important;
  max-height:38px!important;
}

.auth-split-form .auth-kicker{
  color:#8d96a0!important;
  letter-spacing:.12em!important;
}

.auth-split-form .auth-v72-card h1{
  font-size:31px!important;
}

.auth-split-form .auth-sub{
  font-size:13px!important;
  max-width:420px!important;
}

.auth-split-form .auth-form label{
  font-size:11px!important;
}

.auth-split-form .auth-form input{
  height:50px!important;
  font-size:13px!important;
  background:#fff!important;
}

.auth-split-form .auth-primary{
  min-height:50px!important;
  font-size:12px!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
}

.auth-split-form .auth-meta a{
  color:#5c8fa1!important;
}

.auth-split-form .auth-legal{
  margin-top:16px!important;
}

@media(max-width:980px){
  .auth-split-shell{
    grid-template-columns:1fr!important;
    width:min(100%,620px)!important;
    padding:22px!important;
  }

  .auth-split-visual{
    display:none!important;
  }

  .auth-split-form{
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
  }

  .auth-split-form .auth-v72-card{
    padding:28px 24px!important;
    border:1px solid #e2e5e8!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:0 14px 38px rgba(24,31,40,.055)!important;
  }
}

@media(max-width:620px){
  .auth-split-shell{
    padding:14px!important;
  }

  .auth-split-form .auth-v72-card{
    padding:24px 18px!important;
  }

  .auth-split-form .auth-v72-card h1{
    font-size:26px!important;
  }
}

/* =========================================================
   V76 — LOGIN FULL SPLIT
   Foto ocupa toda a metade esquerda; formulário direto no fundo branco.
========================================================= */

@media(min-width:981px){
  .auth-v72{
    background:#fff!important;
  }

  .auth-split-shell{
    width:100%!important;
    max-width:none!important;
    min-height:100vh!important;
    height:100vh!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:50% 50%!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }

  .auth-split-visual{
    position:relative!important;
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    margin:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#ece8e2!important;
  }

  .auth-split-visual img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
  }

  .auth-photo-note{
    left:34px!important;
    right:auto!important;
    bottom:32px!important;
    width:min(430px,calc(100% - 68px))!important;
    padding:16px 18px!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.90)!important;
    border:1px solid rgba(255,255,255,.65)!important;
    box-shadow:0 10px 30px rgba(20,24,28,.08)!important;
  }

  .auth-split-form{
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    padding:0!important;
    margin:0!important;

    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:center!important;

    background:#fff!important;
    border:0!important;
    border-radius:0!important;
  }

  .auth-split-form .auth-v72-card{
    width:min(100%,520px)!important;
    max-width:520px!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  .auth-split-form .auth-v72-brand{
    margin:0 0 24px!important;
    justify-content:flex-start!important;
  }

  .auth-split-form .auth-v72-brand img{
    width:38px!important;
    height:38px!important;
    max-width:38px!important;
    max-height:38px!important;
  }

  .auth-split-form .auth-v72-card h1{
    font-size:34px!important;
    line-height:1.1!important;
    letter-spacing:-.035em!important;
  }

  .auth-split-form .auth-sub{
    max-width:440px!important;
    margin:10px 0 28px!important;
    font-size:14px!important;
    line-height:1.55!important;
  }

  .auth-split-form .auth-form{
    gap:17px!important;
  }

  .auth-split-form .auth-form label{
    font-size:11.5px!important;
    gap:7px!important;
  }

  .auth-split-form .auth-form input{
    height:52px!important;
    font-size:13.5px!important;
    border-radius:10px!important;
    background:#fff!important;
  }

  .auth-split-form .auth-primary{
    height:52px!important;
    min-height:52px!important;
    font-size:12.5px!important;
    border-radius:10px!important;
  }

  .auth-split-form .auth-bottom{
    margin-top:22px!important;
    font-size:11px!important;
  }

  .auth-split-form .auth-meta a,
  .auth-split-form .auth-resend button{
    font-size:10.5px!important;
  }

  .auth-split-form .auth-divider{
    margin-top:20px!important;
  }

  .auth-split-form .auth-legal{
    width:min(100%,520px)!important;
    max-width:520px!important;
    margin:18px auto 0!important;
    padding:0!important;
    text-align:center!important;
    font-size:8.5px!important;
  }
}

/* tablet/mobile: só formulário, sem foto */
@media(max-width:980px){
  .auth-split-shell{
    display:block!important;
    width:100%!important;
    min-height:100svh!important;
    padding:0!important;
    background:#fff!important;
  }

  .auth-split-visual{
    display:none!important;
  }

  .auth-split-form{
    min-height:100svh!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:24px 18px!important;
    background:#fff!important;
  }

  .auth-split-form .auth-v72-card{
    width:min(100%,520px)!important;
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    background:#fff!important;
  }
}

/* =========================================================
   V77 — Login minimalista com foto enviada pelo usuário
========================================================= */

@media(min-width:981px){
  .auth-split-shell{
    grid-template-columns:52% 48%!important;
  }

  .auth-split-visual{
    height:100vh!important;
    min-height:100vh!important;
  }

  .auth-split-visual img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 56%!important;
  }

  /* remove destaque extra sobre a foto para deixar mais minimalista */
  .auth-photo-note{
    display:none!important;
  }

  .auth-split-form{
    padding:0 7vw!important;
    align-items:center!important;
  }

  .auth-split-form .auth-v72-card{
    width:min(100%,430px)!important;
    max-width:430px!important;
    text-align:center!important;
  }

  .auth-split-form .auth-v72-brand{
    justify-content:center!important;
    margin:0 0 28px!important;
  }

  .auth-split-form .auth-v72-brand img{
    width:42px!important;
    height:42px!important;
    max-width:42px!important;
    max-height:42px!important;
  }

  .auth-split-form .auth-kicker{
    text-align:center!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
  }

  .auth-split-form .auth-v72-card h1{
    text-align:center!important;
    font-size:30px!important;
    line-height:1.12!important;
    margin-bottom:0!important;
  }

  .auth-split-form .auth-sub{
    max-width:360px!important;
    margin:9px auto 26px!important;
    text-align:center!important;
    font-size:12.5px!important;
    line-height:1.55!important;
  }

  .auth-split-form .auth-form{
    text-align:left!important;
  }

  .auth-split-form .auth-form label{
    font-size:10.5px!important;
  }

  .auth-split-form .auth-form input{
    height:48px!important;
    font-size:12.5px!important;
    border-radius:10px!important;
  }

  .auth-split-form .auth-primary{
    min-height:48px!important;
    height:48px!important;
    font-size:11.5px!important;
    border-radius:10px!important;
  }

  .auth-split-form .auth-meta{
    margin-top:-2px!important;
  }

  .auth-split-form .auth-meta a{
    font-size:10px!important;
  }

  .auth-split-form .auth-divider{
    margin-top:18px!important;
  }

  .auth-split-form .auth-bottom{
    font-size:10.5px!important;
    margin-top:20px!important;
  }

  .auth-split-form .auth-legal{
    width:min(100%,430px)!important;
    max-width:430px!important;
    font-size:8px!important;
    margin-top:16px!important;
  }
}

/* mobile: clean e centralizado */
@media(max-width:980px){
  .auth-split-form .auth-v72-card{
    text-align:center!important;
  }

  .auth-split-form .auth-v72-brand{
    justify-content:center!important;
  }

  .auth-split-form .auth-v72-card h1,
  .auth-split-form .auth-sub,
  .auth-split-form .auth-kicker{
    text-align:center!important;
  }

  .auth-split-form .auth-form{
    text-align:left!important;
  }
}

/* =========================================================
   V78 — split sem bordas + logo nítida + criar conta à direita
========================================================= */

/* remove qualquer respiro branco externo no desktop */
html,
body.auth-v72{
  margin:0!important;
  padding:0!important;
  width:100%!important;
  min-height:100%!important;
}

@media(min-width:981px){
  body.auth-v72{
    overflow:hidden!important;
  }

  .auth-split-shell{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    gap:0!important;
  }

  .auth-split-visual{
    position:relative!important;
    margin:0!important;
    padding:0!important;
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
  }

  .auth-split-visual img{
    display:block!important;
    width:100%!important;
    height:100vh!important;
    margin:0!important;
    padding:0!important;
    object-fit:cover!important;
    object-position:center 56%!important;
    border:0!important;
  }

  .auth-split-form{
    margin:0!important;
    border:0!important;
    border-radius:0!important;
  }

  /* logo sem upscale agressivo */
  .auth-split-form .auth-v72-brand img{
    width:auto!important;
    height:34px!important;
    max-width:52px!important;
    max-height:34px!important;
    object-fit:contain!important;
    image-rendering:auto!important;
    transform:none!important;
  }

  /* "Criar conta" alinhado à direita */
  .auth-bottom-right{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:4px!important;
    width:100%!important;
    text-align:right!important;
    margin-top:18px!important;
  }
}

/* mobile: mantém logo pequena e nítida */
@media(max-width:980px){
  .auth-v72-brand img{
    width:auto!important;
    height:32px!important;
    max-width:50px!important;
    max-height:32px!important;
    object-fit:contain!important;
  }

  .auth-bottom-right{
    display:flex!important;
    justify-content:flex-end!important;
    gap:4px!important;
    text-align:right!important;
  }
}

/* =========================================================
   V79 — Login e Cadastro full split, tipografia maior
========================================================= */

.auth-bottom-center{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:4px!important;
  width:100%!important;
  text-align:center!important;
  margin-top:20px!important;
}

/* aumenta um pouco a leitura no lado direito sem perder minimalismo */
@media(min-width:981px){
  .auth-split-form .auth-v72-card{
    width:min(100%,455px)!important;
    max-width:455px!important;
  }

  .auth-split-form .auth-v72-card h1{
    font-size:32px!important;
  }

  .auth-split-form .auth-sub{
    font-size:13.5px!important;
    max-width:390px!important;
  }

  .auth-split-form .auth-form label{
    font-size:11.5px!important;
  }

  .auth-split-form .auth-form input{
    height:50px!important;
    font-size:13px!important;
  }

  .auth-split-form .auth-primary{
    min-height:50px!important;
    height:50px!important;
    font-size:12px!important;
  }

  .auth-split-form .auth-meta a,
  .auth-split-form .auth-bottom,
  .auth-split-form .auth-bottom a,
  .auth-split-form .auth-resend button{
    font-size:11px!important;
  }

  /* Cadastro: mesmo visual do login à direita */
  .auth-register-split .auth-split-form .auth-v72-card{
    width:min(100%,470px)!important;
    max-width:470px!important;
  }

  .auth-register-split .auth-steps{
    margin-bottom:20px!important;
  }

  .auth-register-split .auth-two{
    gap:12px!important;
  }
}

/* mobile também centralizado */
@media(max-width:980px){
  .auth-bottom-center{
    justify-content:center!important;
    text-align:center!important;
  }

  .auth-split-form .auth-v72-card h1{
    font-size:27px!important;
  }

  .auth-split-form .auth-sub{
    font-size:12px!important;
  }
}

/* V80 — Cadastro exatamente no mesmo split do Login */
@media(min-width:981px){
  .auth-register-split{
    grid-template-columns:52% 48%!important;
  }

  .auth-register-split .auth-split-visual{
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }

  .auth-register-split .auth-split-visual img{
    width:100%!important;
    height:100vh!important;
    object-fit:cover!important;
    object-position:center 56%!important;
  }

  .auth-register-split .auth-split-form{
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 6vw!important;
    background:#fff!important;
  }

  .auth-register-split .auth-v72-card{
    width:min(100%,470px)!important;
    max-width:470px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
    text-align:center!important;
  }

  .auth-register-split .auth-v72-brand{
    justify-content:center!important;
    margin-bottom:20px!important;
  }

  .auth-register-split .auth-v72-brand img{
    width:auto!important;
    height:34px!important;
    max-height:34px!important;
  }

  .auth-register-split .auth-kicker,
  .auth-register-split h1,
  .auth-register-split .auth-sub{
    text-align:center!important;
  }

  .auth-register-split .auth-form{
    text-align:left!important;
  }

  .auth-register-split .auth-steps{
    margin-bottom:18px!important;
  }
}

@media(max-width:980px){
  .auth-register-split .auth-split-visual{
    display:none!important;
  }

  .auth-register-split .auth-split-form{
    min-height:100svh!important;
    padding:24px 18px!important;
  }

  .auth-register-split .auth-v72-card{
    width:min(100%,520px)!important;
    margin:0 auto!important;
  }
}

/* V81 — logo nítida nas telas de autenticação */
.auth-v72-brand{
  line-height:0!important;
}

.auth-v72-brand img,
.auth-split-form .auth-v72-brand img,
.auth-register-split .auth-v72-brand img{
  display:block!important;
  width:28px!important;
  height:28px!important;
  max-width:28px!important;
  max-height:28px!important;
  min-width:28px!important;
  min-height:28px!important;
  object-fit:contain!important;
  image-rendering:auto!important;
  transform:none!important;
  scale:1!important;
  filter:none!important;
  opacity:1!important;
}

@media(max-width:980px){
  .auth-v72-brand img,
  .auth-split-form .auth-v72-brand img,
  .auth-register-split .auth-v72-brand img{
    width:28px!important;
    height:28px!important;
    max-width:28px!important;
    max-height:28px!important;
  }
}

/* =========================================================
   V82 — Logo padronizada em TODAS as telas de autenticação
========================================================= */

.auth-v72-brand,
.auth-split-form .auth-v72-brand,
.auth-register-split .auth-v72-brand,
.auth-code-card .auth-v72-brand{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  margin:0 0 24px!important;
  padding:0!important;
  line-height:0!important;
}

.auth-v72-brand img,
.auth-split-form .auth-v72-brand img,
.auth-register-split .auth-v72-brand img,
.auth-code-card .auth-v72-brand img{
  display:block!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  max-width:30px!important;
  max-height:30px!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center!important;
  image-rendering:auto!important;
  transform:none!important;
  scale:1!important;
  filter:none!important;
  opacity:1!important;
}

/* mesmo respiro em login, cadastro, verificar, recuperar e nova senha */
.auth-split-form .auth-v72-card > .auth-v72-brand:first-child,
.auth-v72-card > .auth-v72-brand:first-child{
  margin-bottom:24px!important;
}

/* mobile usa exatamente o mesmo tamanho visual */
@media(max-width:980px){
  .auth-v72-brand,
  .auth-split-form .auth-v72-brand,
  .auth-register-split .auth-v72-brand,
  .auth-code-card .auth-v72-brand{
    margin-bottom:22px!important;
  }

  .auth-v72-brand img,
  .auth-split-form .auth-v72-brand img,
  .auth-register-split .auth-v72-brand img,
  .auth-code-card .auth-v72-brand img{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    max-width:30px!important;
    max-height:30px!important;
  }
}

/* =========================================================
   V83 — olho na senha + link preto + criar conta maior
========================================================= */

/* botão olho */
.password-field .password-eye{
  position:absolute!important;
  right:12px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  background:transparent!important;
  padding:0!important;
  color:#727981!important;
  cursor:pointer!important;
}
.password-field .password-eye svg{
  width:18px!important;
  height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
}
.password-field .password-eye:hover{
  color:#22272d!important;
}
.password-field .password-eye.is-visible{
  color:#22272d!important;
}

/* esqueci minha senha em preto */
.auth-meta a[href="forgot.php"]{
  color:#1f2328!important;
  font-weight:650!important;
}
.auth-meta a[href="forgot.php"]:hover{
  opacity:.68!important;
}

/* Ainda não tem conta? Criar conta — um pouco maior */
.auth-bottom-center{
  font-size:12px!important;
  line-height:1.4!important;
  margin-top:22px!important;
}
.auth-bottom-center a{
  font-size:12px!important;
  font-weight:700!important;
  color:#1f2328!important;
}
@media(min-width:981px){
  .auth-bottom-center,
  .auth-bottom-center a{
    font-size:12.5px!important;
  }
}

/* V84 — largura do conteúdo de autenticação levemente reduzida */
@media(min-width:981px){
  .auth-split-form .auth-v72-card{
    width:min(100%,410px)!important;
    max-width:410px!important;
  }

  .auth-register-split .auth-split-form .auth-v72-card{
    width:min(100%,430px)!important;
    max-width:430px!important;
  }

  .auth-split-form .auth-legal{
    width:min(100%,410px)!important;
    max-width:410px!important;
  }
}

/* V85 — ajustes exatos na autenticação */

/* Olhinho dentro do campo de senha */
.password-field{
  position:relative!important;
}
.password-field input{
  padding-right:48px!important;
}
.password-field .password-eye{
  position:absolute!important;
  right:10px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  color:#737b84!important;
  cursor:pointer!important;
}
.password-field .password-eye svg{
  width:18px!important;
  height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
}
.password-field .password-eye:hover,
.password-field .password-eye.is-visible{
  color:#1f2328!important;
}

/* Esqueci minha senha em preto */
.auth-meta a[href="forgot.php"],
a[href="forgot.php"]{
  color:#1f2328!important;
  font-weight:650!important;
}

/* Ainda não tem conta? Criar conta maior e centralizado */
.auth-bottom,
.auth-bottom-center{
  text-align:center!important;
  justify-content:center!important;
  font-size:12.5px!important;
  line-height:1.45!important;
}
.auth-bottom a,
.auth-bottom-center a{
  font-size:12.5px!important;
  font-weight:700!important;
  color:#1f2328!important;
}

@media(min-width:981px){
  .auth-bottom,
  .auth-bottom-center,
  .auth-bottom a,
  .auth-bottom-center a{
    font-size:13px!important;
  }
}

/* =========================================================
   V90 — Etapa 3 do cadastro: sexo do bebê
========================================================= */

.onboarding-gender-card{
  text-align:center!important;
}

.gender-form{
  margin-top:4px!important;
}

.gender-options{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
  margin-bottom:6px!important;
}

.gender-option{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:128px!important;
  padding:18px 14px!important;
  border:1px solid #dfe3e7!important;
  border-radius:14px!important;
  background:#fff!important;
  cursor:pointer!important;
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}

.gender-option input{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
}

.gender-option:hover{
  transform:translateY(-1px)!important;
}

.gender-option strong{
  margin-top:9px!important;
  font-size:13px!important;
  color:#1f2328!important;
}

.gender-option small{
  margin-top:3px!important;
  font-size:9.5px!important;
  color:#8d949c!important;
}

.gender-dot{
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  border:1px solid transparent!important;
}

.gender-boy .gender-dot{
  background:#d9edf3!important;
  border-color:#b9dae4!important;
}

.gender-girl .gender-dot{
  background:#f8dddd!important;
  border-color:#efc2c1!important;
}

.gender-boy:has(input:checked){
  border-color:#6DB2C8!important;
  box-shadow:0 0 0 3px rgba(109,178,200,.10)!important;
}

.gender-girl:has(input:checked){
  border-color:#ED9D9C!important;
  box-shadow:0 0 0 3px rgba(237,157,156,.11)!important;
}

.gender-boy:has(input:checked) .gender-dot{
  background:#6DB2C8!important;
}

.gender-girl:has(input:checked) .gender-dot{
  background:#ED9D9C!important;
}

@media(max-width:620px){
  .gender-options{
    grid-template-columns:1fr!important;
  }

  .gender-option{
    min-height:105px!important;
  }
}

/* =========================================================
   V93 — degradê do resumo conforme sexo do bebê
   Menina: rosa à esquerda
   Menino: azul à esquerda
========================================================= */

/* menina */
body.baby-gender-girl .summary-hero,
body.baby-gender-girl .home-hero,
body.baby-gender-girl .welcome-card,
body.baby-gender-girl .dashboard-hero{
  background:linear-gradient(90deg,#e9a0a5 0%,#d9a9b1 34%,#a8c6d2 100%)!important;
}

/* menino */
body.baby-gender-boy .summary-hero,
body.baby-gender-boy .home-hero,
body.baby-gender-boy .welcome-card,
body.baby-gender-boy .dashboard-hero{
  background:linear-gradient(90deg,#72b6ca 0%,#91b8c7 34%,#e8a0a3 100%)!important;
}

/* seletores reais detectados */
body.baby-gender-girl .welcome{background:linear-gradient(90deg,#e9a0a5 0%,#d9a9b1 34%,#a8c6d2 100%)!important;}
body.baby-gender-boy .welcome{background:linear-gradient(90deg,#72b6ca 0%,#91b8c7 34%,#e8a0a3 100%)!important;}
body.baby-gender-girl .welcome-person{background:linear-gradient(90deg,#e9a0a5 0%,#d9a9b1 34%,#a8c6d2 100%)!important;}
body.baby-gender-boy .welcome-person{background:linear-gradient(90deg,#72b6ca 0%,#91b8c7 34%,#e8a0a3 100%)!important;}
body.baby-gender-girl .welcome-avatar{background:linear-gradient(90deg,#e9a0a5 0%,#d9a9b1 34%,#a8c6d2 100%)!important;}
body.baby-gender-boy .welcome-avatar{background:linear-gradient(90deg,#72b6ca 0%,#91b8c7 34%,#e8a0a3 100%)!important;}
body.baby-gender-girl .chat-welcome{background:linear-gradient(90deg,#e9a0a5 0%,#d9a9b1 34%,#a8c6d2 100%)!important;}
body.baby-gender-boy .chat-welcome{background:linear-gradient(90deg,#72b6ca 0%,#91b8c7 34%,#e8a0a3 100%)!important;}

/* =========================================================
   V94 — mantém exatamente o equilíbrio original do degradê.
   Apenas inverte os lados conforme o sexo.
========================================================= */

/* Menina: mesmas cores originais, somente rosa à esquerda */
body.baby-gender-girl .welcome,
body.baby-gender-girl .summary-hero,
body.baby-gender-girl .home-hero,
body.baby-gender-girl .welcome-card,
body.baby-gender-girl .dashboard-hero{
  background:linear-gradient(90deg,#ed9d9c 0%,#72b6ca 100%)!important;
}

/* Menino: degradê original — azul à esquerda */
body.baby-gender-boy .welcome,
body.baby-gender-boy .summary-hero,
body.baby-gender-boy .home-hero,
body.baby-gender-boy .welcome-card,
body.baby-gender-boy .dashboard-hero{
  background:linear-gradient(90deg,#72b6ca 0%,#ed9d9c 100%)!important;
}

/* =========================================================
   V95 — corrige o retângulo interno no cartão de boas-vindas
========================================================= */

body.baby-gender-girl .welcome{
  background:linear-gradient(90deg,#ed9d9c 0%,#72b6ca 100%)!important;
}

body.baby-gender-boy .welcome{
  background:linear-gradient(90deg,#72b6ca 0%,#ed9d9c 100%)!important;
}

/* O degradê pertence SOMENTE ao bloco externo */
body.baby-gender-girl .welcome > *,
body.baby-gender-boy .welcome > *,
body.baby-gender-girl .welcome-person,
body.baby-gender-boy .welcome-person,
body.baby-gender-girl .welcome-avatar,
body.baby-gender-boy .welcome-avatar{
  background-color:transparent!important;
  background-image:none!important;
}

/* mantém o arredondamento limpo nas bordas */
body.baby-gender-girl .welcome,
body.baby-gender-boy .welcome{
  overflow:hidden!important;
  background-clip:padding-box!important;
}

/* =========================================================
   V96 — Premium / Mercado Pago
========================================================= */
.premium-body{
  margin:0;
  min-height:100vh;
  background:#f5f6f8;
  color:#181b20;
  font-family:inherit;
}
.premium-page{
  width:min(100% - 32px,760px);
  margin:0 auto;
  padding:38px 0 60px;
}
.premium-back{
  display:inline-block;
  margin-bottom:28px;
  color:#252a30;
  text-decoration:none;
  font-size:12px;
  font-weight:650;
}
.premium-hero{text-align:center;margin-bottom:22px}
.premium-kicker{
  display:block;
  margin-bottom:8px;
  color:#8e959e;
  font-size:9px;
  font-weight:750;
  letter-spacing:.12em;
}
.premium-hero h1,.premium-lock h1{
  margin:0;
  font-size:32px;
  line-height:1.12;
  letter-spacing:-.035em;
}
.premium-hero p,.premium-lock p{
  max-width:540px;
  margin:10px auto 0;
  color:#737b85;
  font-size:13px;
  line-height:1.6;
}
.premium-card{
  padding:30px;
  background:#fff;
  border:1px solid #e0e4e7;
  border-radius:18px;
}
.premium-price{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:5px;
  margin-bottom:28px;
}
.premium-price strong{font-size:34px;letter-spacing:-.04em}
.premium-price span{font-size:12px;color:#838a93}
.premium-benefits{
  display:grid;
  gap:15px;
  margin-bottom:26px;
}
.premium-benefits>div{
  display:grid;
  grid-template-columns:24px 1fr;
  column-gap:8px;
}
.premium-benefits>div>span{
  grid-row:1/3;
  width:22px;height:22px;
  display:grid;place-items:center;
  border-radius:50%;
  background:#eef8f2;
  color:#4d9e6d;
  font-size:10px;font-weight:800;
}
.premium-benefits b{font-size:12px}
.premium-benefits small{margin-top:3px;color:#858d96;font-size:10px}
.premium-main-btn,.premium-lock-btn{
  display:flex;
  width:100%;
  min-height:50px;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:10px;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C);
  color:#fff;
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.premium-note{
  display:block;
  margin-top:11px;
  text-align:center;
  color:#9aa0a8;
  font-size:9px;
}
.premium-active{
  padding:12px;
  border-radius:10px;
  background:#eff9f3;
  color:#4c825f;
  text-align:center;
  font-size:11px;
  font-weight:700;
}
.premium-cancel-form{text-align:center;margin-top:14px}
.premium-cancel-form button{
  border:0;background:transparent;
  color:#777f88;font-size:10px;cursor:pointer;
}
.premium-lock{
  width:min(100%,620px);
  margin:50px auto;
  padding:40px 34px;
  text-align:center;
}
.premium-lock-icon{
  width:46px;height:46px;
  display:grid;place-items:center;
  margin:0 auto 14px;
  border-radius:14px;
  background:#f3f4f6;
  font-size:17px;
  filter:grayscale(1);
}
.premium-lock-btn{
  width:min(100%,340px);
  margin:22px auto 0;
}
.premium-lock>small{
  display:block;
  margin-top:10px;
  color:#9aa0a8;
  font-size:9px;
}
.premium-profile-link{
  display:inline-flex;
  text-decoration:none;
  align-items:center;
  justify-content:center;
}
@media(max-width:620px){
  .premium-page{width:min(100% - 24px,760px);padding-top:24px}
  .premium-card,.premium-lock{padding:24px 18px}
  .premium-hero h1,.premium-lock h1{font-size:26px}
}

.nanabot-premium-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px}
.nanabot-premium-modal.hidden{display:none!important}
.nanabot-premium-backdrop{position:absolute;inset:0;background:rgba(24,27,31,.32);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.nanabot-premium-dialog{position:relative;z-index:1;width:min(100%,400px);padding:30px 26px 24px;border:1px solid #e2e5e8;border-radius:18px;background:#fff;box-shadow:0 24px 70px rgba(25,30,36,.18);text-align:center}
.nanabot-premium-close{position:absolute;right:12px;top:10px;width:30px;height:30px;border:0;border-radius:50%;background:transparent;color:#8b929a;font-size:20px;cursor:pointer}
.nanabot-premium-lock{width:42px;height:42px;margin:0 auto 13px;display:grid;place-items:center;border-radius:13px;background:#f3f4f6;filter:grayscale(1);font-size:15px}
.nanabot-premium-dialog h2{margin:5px 0 8px;font-size:22px;line-height:1.18;letter-spacing:-.025em;color:#1d2126}
.nanabot-premium-dialog p{margin:0 auto;max-width:340px;font-size:11px;line-height:1.6;color:#747d87}
.nanabot-premium-btn{display:flex;align-items:center;justify-content:center;min-height:46px;margin-top:20px;border-radius:10px;background:linear-gradient(100deg,#6DB2C8,#ED9D9C);color:#fff;text-decoration:none;font-size:11px;font-weight:700}
.nanabot-premium-later{margin-top:9px;padding:6px 10px;border:0;background:transparent;color:#848b94;font-size:9.5px;cursor:pointer}
body.nanabot-premium-open{overflow:hidden}
@media(max-width:620px){.nanabot-premium-dialog{padding:27px 20px 22px;border-radius:16px}.nanabot-premium-dialog h2{font-size:20px}}

/* =========================================================
   V98 — card "Guias para acompanhar cada fase" no início
========================================================= */

/* bloco principal premium da home */
.premium-guide-title{
  display:block!important;
  max-width:none!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  font-size:16px!important;
  line-height:1.25!important;
  font-weight:700!important;
  letter-spacing:-.015em!important;
  white-space:normal!important;
  word-break:normal!important;
}

/* evita coluna estreita no cabeçalho do conteúdo premium */
.premium-section-header,
.premium-content-header,
.content-premium-header,
.guide-premium-header{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0!important;
}

.premium-section-header > *,
.premium-content-header > *,
.content-premium-header > *,
.guide-premium-header > *{
  min-width:0!important;
}

/* qualquer título premium na home não pode ficar espremido */
.home .eyebrow + h2,
.home .eyebrow + h3,
.dashboard .eyebrow + h2,
.dashboard .eyebrow + h3{
  max-width:none!important;
  white-space:normal!important;
}

/* cards de e-book bloqueados continuam em uma linha limpa no desktop */
@media(min-width:821px){
  .premium-books,
  .premium-guides,
  .ebook-grid,
  .guide-grid{
    width:100%!important;
  }
}

/* mobile mantém natural */
@media(max-width:820px){
  .premium-guide-title{
    font-size:15px!important;
  }
}

.premium-home-guide{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:14px!important;
}
.premium-home-guide .eyebrow{
  display:block!important;
  margin-bottom:5px!important;
}

/* =========================================================
   V99 — NanaBot Premium: checkout direto + tipografia do site
========================================================= */
.nanabot-premium-dialog{
  width:min(100%,430px)!important;
  padding:34px 30px 27px!important;
}
.nanabot-premium-dialog .eyebrow{
  font-size:10px!important;
  letter-spacing:.1em!important;
}
.nanabot-premium-dialog h2{
  font-size:25px!important;
  line-height:1.18!important;
}
.nanabot-premium-dialog p{
  max-width:365px!important;
  font-size:13px!important;
  line-height:1.55!important;
}
.nanabot-premium-btn{
  min-height:50px!important;
  font-size:13px!important;
}
.nanabot-premium-later{
  font-size:11px!important;
}
@media(max-width:620px){
  .nanabot-premium-dialog{
    width:min(100%,400px)!important;
    padding:29px 22px 24px!important;
  }
  .nanabot-premium-dialog h2{
    font-size:22px!important;
  }
  .nanabot-premium-dialog p{
    font-size:12.5px!important;
  }
}

/* =========================================================
   V101 — Guias Premium com CTA central sobre os 4 blocos
========================================================= */

.premium-guides-wrap{
  position:relative!important;
}

/* deixa os cards visíveis, porém claramente bloqueados */
.premium-guides-wrap .premium-book,
.premium-guides-wrap .premium-guide,
.premium-guides-wrap .ebook-card,
.premium-guides-wrap .guide-card,
.premium-guides-wrap [class*="book"],
.premium-guides-wrap [class*="guide"]{
  opacity:.48!important;
  filter:saturate(.45)!important;
  pointer-events:none!important;
}

/* remove qualquer ícone de cadeado visual residual */
.premium-guides-wrap .lock,
.premium-guides-wrap .locked-icon,
.premium-guides-wrap .premium-lock-icon{
  display:none!important;
}

.premium-guides-overlay{
  position:absolute!important;
  left:50%!important;
  top:64%!important;
  transform:translate(-50%,-50%)!important;
  z-index:8!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:min(100%,360px)!important;
  padding:0 16px!important;
  pointer-events:none!important;
}

.premium-guides-cta{
  pointer-events:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:48px!important;
  width:100%!important;
  padding:0 18px!important;
  border-radius:10px!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:12.5px!important;
  font-weight:700!important;
  box-shadow:0 10px 28px rgba(40,48,58,.12)!important;
}

.premium-guides-cta:hover{
  transform:translateY(-1px)!important;
}

@media(max-width:820px){
  .premium-guides-overlay{
    top:68%!important;
    width:min(100%,320px)!important;
  }
  .premium-guides-cta{
    min-height:46px!important;
    font-size:12px!important;
  }
}

/* =========================================================
   V102 — Guias Premium corretos na tela Resumo
========================================================= */
.home-guides-section{
  width:100%;
  margin-top:26px;
}
.home-guides-header{
  margin-bottom:16px;
}
.home-guides-header span{
  display:block;
  margin-bottom:5px;
  color:#98a0aa;
  font-size:9px;
  line-height:1;
  font-weight:750;
  letter-spacing:.1em;
}
.home-guides-header h2{
  margin:0;
  color:#1d2126;
  font-size:19px;
  line-height:1.25;
  font-weight:700;
  letter-spacing:-.02em;
}
.home-guides-shell{
  position:relative;
  width:100%;
}
.home-guides-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.home-guide-card{
  position:relative;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:10px;
  min-height:130px;
  padding:18px 16px;
  border:1px solid #e1e4e7;
  border-radius:14px;
  background:#fff;
  color:#22272d;
  text-decoration:none;
}
.home-guide-number{
  color:#b4bac1;
  font-size:10px;
}
.home-guide-card strong{
  display:block;
  margin-bottom:6px;
  font-size:12px;
  line-height:1.3;
}
.home-guide-card small{
  display:block;
  color:#8d949d;
  font-size:9.5px;
  line-height:1.45;
}
.home-guides-shell.is-locked .home-guides-grid{
  opacity:.42;
  filter:saturate(.45);
  user-select:none;
}
.home-guides-shell.is-locked .home-guide-card{
  pointer-events:none;
}
.home-guides-paywall{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}
.home-guides-paywall a{
  pointer-events:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  width:min(360px,calc(100% - 32px));
  padding:0 20px;
  border-radius:10px;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C);
  box-shadow:0 10px 28px rgba(35,43,52,.13);
  color:#fff;
  text-decoration:none;
  font-size:12.5px;
  font-weight:700;
}
.home-guides-shell.is-unlocked .home-guide-card{
  transition:transform .15s ease,border-color .15s ease;
}
.home-guides-shell.is-unlocked .home-guide-card:hover{
  transform:translateY(-1px);
  border-color:#cfd4d9;
}
@media(max-width:900px){
  .home-guides-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .home-guides-header h2{font-size:18px}
  .home-guides-grid{grid-template-columns:1fr}
  .home-guide-card{min-height:104px}
  .home-guides-paywall{
    position:sticky;
    bottom:14px;
    margin-top:-62px;
    padding:0 10px 12px;
  }
}

/* V103 — cadeado + CTA curto nos guias Premium */
.home-guides-paywall-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:min(360px,calc(100% - 32px));
}
.home-guides-lock{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid rgba(220,224,228,.9);
  border-radius:12px;
  background:rgba(255,255,255,.94);
  box-shadow:0 6px 18px rgba(35,43,52,.07);
  font-size:15px;
  line-height:1;
  filter:grayscale(1);
}
.home-guides-paywall .home-guides-paywall-inner > a{
  width:100%!important;
}

/* V104 — botão Premium compacto com cadeado dentro */
.home-guides-paywall-inner{
  width:auto!important;
  gap:0!important;
}
.home-guides-lock{
  display:none!important;
}
.home-guides-paywall .home-guides-paywall-inner > a.home-guides-premium-compact{
  width:auto!important;
  min-width:0!important;
  min-height:44px!important;
  padding:0 18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border-radius:10px!important;
  white-space:nowrap!important;
  font-size:12px!important;
  font-weight:700!important;
}
.home-guides-premium-compact span{
  font-size:13px!important;
  line-height:1!important;
  filter:grayscale(1);
}
@media(max-width:560px){
  .home-guides-paywall .home-guides-paywall-inner > a.home-guides-premium-compact{
    min-height:42px!important;
    padding:0 16px!important;
  }
}

/* V105 — cadeado SVG nítido dentro do botão */
.home-guides-premium-compact{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
}

.home-guides-premium-compact .premium-lock-svg{
  width:15px!important;
  height:15px!important;
  flex:0 0 15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

.home-guides-premium-compact > span{
  display:inline-block!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1!important;
}

/* =========================================================
   V106 — MOBILE PROFISSIONAL DORMEBABY
   Revisão geral sem alterar o desktop
========================================================= */

@media(max-width:820px){

  /* ---------- BASE / VIEWPORT ---------- */
  html,
  body{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  body{
    -webkit-text-size-adjust:100%!important;
    padding:0!important;
    margin:0!important;
  }

  img,
  svg,
  video,
  canvas{
    max-width:100%!important;
  }

  button,
  input,
  select,
  textarea{
    max-width:100%!important;
  }

  /* área principal */
  .app-main,
  .main,
  main:not(.auth-v72-shell):not(.premium-page){
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:14px!important;
    padding-right:14px!important;
    padding-bottom:92px!important;
    overflow-x:hidden!important;
  }

  /* títulos de página */
  .page-title,
  .section-title,
  .page-header{
    margin-left:0!important;
    margin-right:0!important;
  }

  .page-title h1,
  .section-title h1,
  .page-header h1{
    font-size:24px!important;
    line-height:1.15!important;
    letter-spacing:-.025em!important;
  }

  .page-title p,
  .section-title p,
  .page-header p{
    font-size:12px!important;
    line-height:1.5!important;
  }

  /* ---------- MENU LATERAL / TOPO MOBILE ---------- */

  /* remove imagem/avatar/logo do menu mobile */
  .sidebar .brand img,
  .sidebar .logo img,
  .sidebar .user-avatar,
  .sidebar .profile-photo,
  .mobile-menu .brand img,
  .mobile-menu .logo img,
  .mobile-menu .user-avatar,
  .mobile-menu .profile-photo,
  .nav-mobile .brand img,
  .nav-mobile .logo img{
    display:none!important;
  }

  /* menu lateral não ocupa espaço no mobile */
  .sidebar{
    display:none!important;
  }

  /* ---------- MENU INFERIOR ---------- */
  .bottom-nav,
  .mobile-bottom-nav,
  .mobile-nav,
  nav.bottom-nav{
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    z-index:999!important;

    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:64px!important;
    min-height:64px!important;

    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;
    gap:2px!important;

    margin:0!important;
    padding:6px!important;

    background:rgba(255,255,255,.97)!important;
    border:1px solid #e2e5e8!important;
    border-radius:17px!important;
    box-shadow:0 12px 35px rgba(28,34,42,.13)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;

    overflow:hidden!important;
  }

  .bottom-nav a,
  .bottom-nav button,
  .mobile-bottom-nav a,
  .mobile-bottom-nav button,
  .mobile-nav a,
  .mobile-nav button{
    position:relative!important;
    min-width:0!important;
    width:100%!important;
    height:52px!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;

    margin:0!important;
    padding:3px 1px!important;

    border:0!important;
    border-radius:12px!important;
    background:transparent!important;
    color:#8a9199!important;
    text-align:center!important;
    text-decoration:none!important;
    overflow:hidden!important;
  }

  .bottom-nav a svg,
  .bottom-nav button svg,
  .mobile-bottom-nav a svg,
  .mobile-bottom-nav button svg,
  .mobile-nav a svg,
  .mobile-nav button svg{
    width:19px!important;
    height:19px!important;
    flex:0 0 19px!important;
  }

  .bottom-nav a span,
  .bottom-nav button span,
  .mobile-bottom-nav a span,
  .mobile-bottom-nav button span,
  .mobile-nav a span,
  .mobile-nav button span{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    font-size:8px!important;
    line-height:1!important;
  }

  .bottom-nav a.active,
  .bottom-nav button.active,
  .mobile-bottom-nav a.active,
  .mobile-bottom-nav button.active,
  .mobile-nav a.active,
  .mobile-nav button.active{
    color:#1f2328!important;
    background:#f5f6f7!important;
  }

  /* ---------- CARDS / PAINÉIS GERAIS ---------- */
  .panel,
  .card,
  .box,
  .widget{
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    border-radius:14px!important;
  }

  .panel{
    padding:16px!important;
  }

  /* evita qualquer card forçando largura */
  [style*="min-width"],
  [class*="grid"] > *,
  [class*="cards"] > *{
    min-width:0!important;
  }

  /* ---------- RESUMO ---------- */

  .welcome{
    border-radius:16px!important;
    padding:18px!important;
    min-height:0!important;
  }

  .welcome h1,
  .welcome h2{
    font-size:22px!important;
    line-height:1.15!important;
  }

  .welcome p{
    font-size:11px!important;
    line-height:1.5!important;
  }

  /* 4 métricas em 2 colunas */
  .metrics,
  .summary-metrics,
  .today-metrics,
  .stats-grid,
  .summary-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  .metrics > *,
  .summary-metrics > *,
  .today-metrics > *,
  .stats-grid > *,
  .summary-grid > *{
    width:100%!important;
    min-width:0!important;
    min-height:96px!important;
    padding:14px!important;
    margin:0!important;
  }

  .metric-value,
  .stat-value{
    font-size:22px!important;
  }

  /* dica NanaBot */
  .nana-tip,
  .nanabot-tip,
  .home-nanabot-tip{
    padding:16px!important;
    border-radius:14px!important;
  }

  .nana-tip p,
  .nanabot-tip p,
  .home-nanabot-tip p{
    font-size:11.5px!important;
    line-height:1.55!important;
  }

  /* Guias premium */
  .home-guides-section{
    margin-top:22px!important;
  }

  .home-guides-header{
    margin-bottom:12px!important;
  }

  .home-guides-header h2{
    font-size:18px!important;
    line-height:1.25!important;
  }

  .home-guides-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  .home-guide-card{
    min-height:118px!important;
    padding:14px 12px!important;
    grid-template-columns:22px minmax(0,1fr)!important;
    gap:7px!important;
    border-radius:12px!important;
  }

  .home-guide-card strong{
    font-size:11px!important;
  }

  .home-guide-card small{
    font-size:8.5px!important;
  }

  .home-guides-paywall{
    position:absolute!important;
    inset:0!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .home-guides-premium-compact{
    min-height:42px!important;
    padding:0 15px!important;
    font-size:11px!important;
  }

  /* ---------- DIÁRIO DO SONO ---------- */
  .diary-grid,
  .sleep-entry-grid,
  .diary-form-grid,
  .sleep-form-grid{
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }

  .diary-grid > *,
  .sleep-entry-grid > *,
  .diary-form-grid > *,
  .sleep-form-grid > *{
    min-width:0!important;
  }

  .sleep-entry,
  .diary-entry,
  .history-item{
    padding:14px!important;
    border-radius:13px!important;
  }

  /* histórico sem estourar largura */
  .diary-history,
  .sleep-history,
  .history-list{
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  /* calendários/gráficos */
  .calendar,
  .calendar-grid,
  .sleep-calendar{
    width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  canvas{
    width:100%!important;
    height:auto!important;
  }

  /* ---------- PLANO DE SONO ---------- */
  .plan-days,
  .weekday-tabs,
  .day-tabs{
    display:flex!important;
    gap:12px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
    padding-bottom:2px!important;
  }

  .plan-days::-webkit-scrollbar,
  .weekday-tabs::-webkit-scrollbar,
  .day-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .plan-days > *,
  .weekday-tabs > *,
  .day-tabs > *{
    flex:0 0 auto!important;
  }

  .routine-item,
  .plan-item{
    padding:13px!important;
    border-radius:12px!important;
  }

  /* ---------- ANÁLISE DE CHORO ---------- */
  .cry-layout,
  .cry-layout-sticky{
    display:block!important;
    width:100%!important;
  }

  .cry-record{
    position:static!important;
    width:100%!important;
    margin:0 0 12px!important;
    padding:22px 16px!important;
    border-radius:15px!important;
  }

  .cry-history{
    width:100%!important;
    min-width:0!important;
  }

  .cry-nana-result{
    padding:13px!important;
    border-radius:12px!important;
  }

  .cry-result-actions{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
  }

  /* ---------- SONS PARA DORMIR ---------- */
  .sound-category-tabs{
    gap:14px!important;
    padding:1px 0 6px!important;
  }

  .sound-category-tabs button{
    font-size:10px!important;
  }

  .sounds-grid,
  .sound-grid,
  .sounds-list{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  .sound-card,
  .sound-item{
    min-width:0!important;
    min-height:98px!important;
    padding:13px!important;
    border-radius:13px!important;
  }

  .sounds-player-inline-wrap{
    margin:10px 0 13px!important;
  }

  .sounds-player-inline-wrap #soundPlayer{
    width:100%!important;
    padding:10px!important;
  }

  .sounds-player-inline-wrap .player-main{
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    gap:8px!important;
  }

  .sounds-player-inline-wrap .player-controls{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding-top:8px!important;
  }

  .sounds-player-inline-wrap .player-controls label{
    width:100%!important;
  }

  .sounds-player-inline-wrap #volume{
    width:100%!important;
    max-width:none!important;
  }

  .sounds-player-inline-wrap .timers{
    width:100%!important;
    display:flex!important;
    gap:6px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  /* ---------- NANABOT ---------- */
  .nanabot-layout,
  .nanabot-workspace,
  .chat-layout{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  /* lista de conversas vira faixa horizontal compacta */
  .nanabot-sidebar,
  .conversation-sidebar,
  .chat-sidebar{
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    position:static!important;
    margin-bottom:10px!important;
    overflow:hidden!important;
  }

  .conversation-list,
  .nanabot-conversations{
    display:flex!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    padding-bottom:3px!important;
  }

  .conversation-list > *,
  .nanabot-conversations > *{
    flex:0 0 auto!important;
    max-width:180px!important;
  }

  .nanabot-chat,
  .chat-main,
  .chat-panel{
    min-width:0!important;
    width:100%!important;
  }

  .nanabot-messages,
  .chat-messages{
    padding-left:0!important;
    padding-right:0!important;
  }

  .message,
  .chat-message{
    max-width:88%!important;
  }

  .nanabot-input,
  .chat-input,
  .chat-composer{
    width:100%!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
  }

  .nanabot-premium-dialog{
    width:calc(100% - 24px)!important;
    max-width:400px!important;
  }

  /* ---------- PERFIL ---------- */
  .profile-page-wide,
  .profile-page-wide form.profile,
  .profile-page-wide .preferences,
  .profile-page-wide .subscription,
  .profile-page-wide .danger{
    width:100%!important;
    max-width:100%!important;
  }

  .profile-page-wide .fields.two,
  .profile .two,
  .preferences .two,
  .fields.two{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .profile-page-wide form.profile,
  .profile-page-wide .preferences,
  .profile-page-wide .subscription,
  .profile-page-wide .danger{
    padding:16px!important;
  }

  /* ---------- PREMIUM ---------- */
  .premium-page{
    width:100%!important;
    max-width:100%!important;
    padding:22px 14px 88px!important;
  }

  .premium-card,
  .premium-lock{
    width:100%!important;
    padding:20px 16px!important;
    border-radius:15px!important;
  }

  .premium-benefits{
    gap:13px!important;
  }

  /* ---------- FORM CONTROLS ---------- */
  input,
  select,
  textarea{
    font-size:16px!important; /* evita zoom no iOS */
  }

  label{
    max-width:100%!important;
  }

  textarea{
    min-height:92px!important;
    resize:vertical!important;
  }

  /* ---------- MODAIS ---------- */
  .modal,
  .popup,
  [role="dialog"]{
    max-width:calc(100vw - 24px)!important;
  }

  /* ---------- SEGURANÇA CONTRA HORIZONTAL SCROLL ---------- */
  table{
    max-width:100%!important;
  }

  .table-wrap,
  .table-responsive{
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
}

/* telefones pequenos */
@media(max-width:420px){

  .app-main,
  .main,
  main:not(.auth-v72-shell):not(.premium-page){
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .metrics,
  .summary-metrics,
  .today-metrics,
  .stats-grid,
  .summary-grid{
    gap:8px!important;
  }

  .metrics > *,
  .summary-metrics > *,
  .today-metrics > *,
  .stats-grid > *,
  .summary-grid > *{
    padding:12px!important;
    min-height:90px!important;
  }

  .home-guides-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .home-guide-card{
    padding:12px 10px!important;
    min-height:112px!important;
  }

  .sounds-grid,
  .sound-grid,
  .sounds-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .bottom-nav,
  .mobile-bottom-nav,
  .mobile-nav,
  nav.bottom-nav{
    left:6px!important;
    right:6px!important;
    bottom:6px!important;
    height:62px!important;
    min-height:62px!important;
  }
}

/* =========================================================
   V107 — MOBILE REAL (seletores exatos do DormeBaby)
========================================================= */
@media(max-width:820px){

  html,body{
    overflow-x:hidden!important;
    width:100%!important;
    max-width:100%!important;
  }

  /* Remove completamente o topo mobile e o menu lateral.
     No celular usamos somente a navegação inferior. */
  .mobile-head,
  .sidebar{
    display:none!important;
  }

  .main{
    margin-left:0!important;
    width:100%!important;
    max-width:100%!important;
    padding:18px 14px 94px!important;
    overflow-x:hidden!important;
  }

  /* MENU INFERIOR REAL */
  .bottom-nav{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    inset:auto 8px max(8px,env(safe-area-inset-bottom)) 8px!important;
    z-index:200!important;
    height:64px!important;
    padding:5px!important;
    border:1px solid #e1e5e8!important;
    border-radius:17px!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 12px 34px rgba(30,36,44,.14)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  .bottom-nav a{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    min-width:0!important;
    height:54px!important;
    padding:3px 1px!important;
    border-radius:12px!important;
    color:#8b929b!important;
    font-size:8px!important;
    line-height:1!important;
    text-decoration:none!important;
  }

  .bottom-nav a svg{
    width:20px!important;
    height:20px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.7!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }

  .bottom-nav a span{
    display:block!important;
    font-size:8px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .bottom-nav a.active{
    color:#191d22!important;
    background:#f3f5f6!important;
    font-weight:650!important;
  }

  /* HOME */
  .welcome{
    min-height:0!important;
    padding:17px!important;
    border-radius:16px!important;
    margin-bottom:12px!important;
  }

  .welcome-person{
    gap:11px!important;
  }

  .welcome-avatar{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
  }

  .welcome h1{
    font-size:22px!important;
    line-height:1.1!important;
    margin:2px 0 3px!important;
  }

  .welcome p{
    font-size:10.5px!important;
  }

  .welcome .date{
    font-size:8.5px!important;
  }

  .panel{
    padding:15px!important;
    border-radius:14px!important;
  }

  .panel-head{
    gap:8px!important;
    margin-bottom:12px!important;
  }

  .panel-head h2{
    font-size:16px!important;
  }

  .tabs{
    gap:2px!important;
  }

  .tabs button{
    padding:6px 8px!important;
    font-size:8.5px!important;
  }

  /* Resumo: EXATAMENTE 2 colunas, inclusive em <=560 */
  .metrics{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  .metrics article{
    min-height:104px!important;
    padding:13px!important;
    gap:8px!important;
    border-radius:12px!important;
  }

  .metrics article .metric-icon{
    font-size:18px!important;
  }

  .metrics article>div>span{
    font-size:9px!important;
    line-height:1.2!important;
  }

  .metrics strong{
    font-size:19px!important;
    line-height:1.15!important;
  }

  .metrics small{
    font-size:8px!important;
  }

  .ai-tips{
    margin-top:12px!important;
  }

  .single-tip-content p{
    font-size:11.5px!important;
    line-height:1.55!important;
    margin-bottom:10px!important;
  }

  .nanabot-text-link{
    font-size:10px!important;
  }

  /* GUIAS: 2 COLUNAS REAIS */
  .home-guides-section{
    margin-top:20px!important;
  }

  .home-guides-header{
    margin-bottom:11px!important;
  }

  .home-guides-header span{
    font-size:8px!important;
  }

  .home-guides-header h2{
    font-size:17px!important;
  }

  .home-guides-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .home-guide-card{
    min-height:116px!important;
    padding:13px 11px!important;
    grid-template-columns:20px minmax(0,1fr)!important;
    gap:6px!important;
    border-radius:12px!important;
  }

  .home-guide-card strong{
    font-size:10.5px!important;
    line-height:1.3!important;
  }

  .home-guide-card small{
    font-size:8px!important;
    line-height:1.4!important;
  }

  .home-guides-paywall{
    position:absolute!important;
    inset:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    margin:0!important;
  }

  .home-guides-premium-compact{
    min-height:41px!important;
    padding:0 14px!important;
    font-size:10.5px!important;
  }

  /* DIÁRIO */
  .page-title.row{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-bottom:14px!important;
  }

  .page-title h1{
    font-size:23px!important;
    margin-bottom:4px!important;
  }

  .page-title p{
    font-size:10.5px!important;
    line-height:1.5!important;
  }

  .page-title .gradient-btn{
    width:100%!important;
    min-height:43px!important;
  }

  .diary-overview{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  .chart-card,
  .diary-ai,
  .diary-history{
    width:100%!important;
    min-width:0!important;
  }

  .mini-bars{
    gap:5px!important;
  }

  .quality-day small{
    font-size:7.5px!important;
  }

  .compact-sleep-list{
    width:100%!important;
    min-width:0!important;
  }

  /* PLANO */
  .routine-layout{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  .day-tabs{
    display:flex!important;
    overflow-x:auto!important;
    gap:8px!important;
    scrollbar-width:none!important;
  }

  .day-tabs::-webkit-scrollbar{display:none!important}
  .day-tabs a{min-width:auto!important;flex:0 0 auto!important}

  .routine-step{
    grid-template-columns:28px 44px minmax(0,1fr)!important;
    gap:8px!important;
  }

  /* SONS — classes reais .spotify-grid / .sound-tile */
  .sound-page{
    display:block!important;
    width:100%!important;
  }

  .sound-category{
    padding:14px!important;
    border-radius:14px!important;
  }

  .spotify-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .sound-tile{
    min-height:145px!important;
    padding:12px!important;
    border-radius:12px!important;
  }

  .sound-emoji{
    font-size:23px!important;
    margin:9px 0!important;
  }

  .sound-tile b{
    font-size:10.5px!important;
  }

  .sound-tile small{
    font-size:8px!important;
  }

  .play-sound{
    width:33px!important;
    height:33px!important;
  }

  .sounds-player-inline-wrap #soundPlayer{
    padding:9px 10px!important;
  }

  .sounds-player-inline-wrap #soundPlayer:not(.hidden){
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  .sounds-player-inline-wrap .player-main{
    grid-template-columns:38px minmax(0,1fr) 36px!important;
  }

  .sounds-player-inline-wrap .player-controls{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
  }

  /* CHORO */
  .cry-layout,
  .cry-layout-sticky{
    display:block!important;
  }

  .cry-record{
    position:static!important;
    width:100%!important;
    margin-bottom:10px!important;
    padding:20px 15px!important;
  }

  .cry-history{
    width:100%!important;
    min-width:0!important;
  }

  .cry-item,
  .cry-history article{
    max-width:100%!important;
  }

  /* PERFIL: classes reais */
  .profile,
  .preferences,
  .subscription,
  .danger{
    width:100%!important;
    max-width:100%!important;
    padding:16px!important;
    margin-bottom:10px!important;
  }

  .profile-photos{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .fields.two{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  .photo-line{
    gap:11px!important;
  }

  .photo-line img,
  .photo-fallback{
    width:62px!important;
    height:62px!important;
  }

  /* inputs sem zoom iOS */
  input,select,textarea{
    font-size:16px!important;
  }
}

/* neutraliza regra antiga que jogava metrics para 1 coluna em 560px */
@media(max-width:560px){
  .metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .spotify-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .home-guides-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .welcome h1{
    font-size:21px!important;
  }

  .main{
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

/* =========================================================
   V108 — MOBILE: logo central + foto à direita + fontes maiores
========================================================= */
@media(max-width:820px){

  /* topo mobile minimalista */
  .mobile-head{
    position:sticky!important;
    top:0!important;
    z-index:180!important;
    display:grid!important;
    grid-template-columns:40px 1fr 40px!important;
    align-items:center!important;
    width:100%!important;
    height:58px!important;
    padding:0 14px!important;
    margin:0!important;
    background:rgba(255,255,255,.96)!important;
    border-bottom:1px solid #edf0f2!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
  }

  .mobile-head-spacer{
    width:40px!important;
    height:40px!important;
  }

  .mobile-head-logo{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:58px!important;
  }

  .mobile-head-logo img{
    display:block!important;
    width:30px!important;
    height:30px!important;
    max-width:30px!important;
    max-height:30px!important;
    object-fit:contain!important;
  }

  .mobile-head .head-user{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:36px!important;
    height:36px!important;
    justify-self:end!important;
    border-radius:50%!important;
    text-decoration:none!important;
    overflow:hidden!important;
    background:#f1f3f5!important;
    color:#252a30!important;
    font-size:13px!important;
    font-weight:700!important;
  }

  .mobile-head .head-user img{
    display:block!important;
    width:36px!important;
    height:36px!important;
    object-fit:cover!important;
    border-radius:50%!important;
  }

  .mobile-head .head-user span{
    display:grid!important;
    place-items:center!important;
    width:36px!important;
    height:36px!important;
  }

  /* espaço principal já considera o topo real */
  .main{
    padding-top:16px!important;
  }

  /* TIPOGRAFIA GERAL MAIOR */
  body{
    font-size:14px!important;
  }

  .welcome h1{
    font-size:25px!important;
  }

  .welcome p{
    font-size:12px!important;
  }

  .welcome .date{
    font-size:9.5px!important;
  }

  .panel-head h2{
    font-size:18px!important;
  }

  .tabs button{
    font-size:9.5px!important;
  }

  .metrics article>div>span{
    font-size:10px!important;
  }

  .metrics strong{
    font-size:21px!important;
  }

  .metrics small{
    font-size:9px!important;
  }

  .single-tip-content p,
  .nanabot-diary-tip p,
  .routine-ai p,
  .cry-nana-result p{
    font-size:12.5px!important;
    line-height:1.58!important;
  }

  .nanabot-text-link{
    font-size:11px!important;
  }

  .eyebrow,
  .home-guides-header span{
    font-size:9px!important;
  }

  .home-guides-header h2{
    font-size:19px!important;
  }

  .home-guide-card strong{
    font-size:11.5px!important;
  }

  .home-guide-card small{
    font-size:9px!important;
  }

  .page-title h1{
    font-size:25px!important;
  }

  .page-title p{
    font-size:11.5px!important;
  }

  .sound-tile b{
    font-size:11.5px!important;
  }

  .sound-tile small{
    font-size:9px!important;
  }

  .sound-category h2,
  .profile h2,
  .preferences h2,
  .subscription h2,
  .danger h2{
    font-size:17px!important;
  }

  .routine-step,
  .sleep-entry,
  .diary-entry,
  .history-item{
    font-size:12px!important;
  }

  .bottom-nav a span{
    font-size:9px!important;
  }

  .bottom-nav a{
    font-size:9px!important;
  }

  /* NanaBot */
  .message,
  .chat-message{
    font-size:13px!important;
    line-height:1.55!important;
  }

  .conversation-list > *,
  .nanabot-conversations > *{
    font-size:11px!important;
  }

  /* Perfil / formulários: labels maiores */
  .profile label,
  .preferences label,
  .subscription label,
  .danger label{
    font-size:11px!important;
  }

  /* mantém inputs em 16px para não dar zoom no iPhone */
  input,
  select,
  textarea{
    font-size:16px!important;
  }
}

@media(max-width:420px){
  .mobile-head{
    height:56px!important;
    padding:0 12px!important;
  }

  .mobile-head-logo{
    height:56px!important;
  }

  .mobile-head-logo img{
    width:28px!important;
    height:28px!important;
  }

  .mobile-head .head-user,
  .mobile-head .head-user img,
  .mobile-head .head-user span{
    width:34px!important;
    height:34px!important;
  }

  .welcome h1{
    font-size:23px!important;
  }

  .metrics strong{
    font-size:20px!important;
  }
}

/* =========================================================
   V109 — MOBILE MAIS LEGÍVEL
   Logo à esquerda + menu à direita + fontes maiores
========================================================= */
@media(max-width:820px){

  /* CABEÇALHO */
  .mobile-head{
    position:sticky!important;
    top:0!important;
    z-index:220!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    height:66px!important;
    padding:0 16px!important;
    margin:0!important;
    background:rgba(255,255,255,.97)!important;
    border-bottom:1px solid #e9edf0!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  .mobile-head-logo{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:auto!important;
    height:66px!important;
    text-decoration:none!important;
  }

  .mobile-head-logo img{
    display:block!important;
    width:40px!important;
    height:40px!important;
    max-width:40px!important;
    max-height:40px!important;
    object-fit:contain!important;
  }

  .mobile-menu-button{
    width:42px!important;
    height:42px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    margin:0!important;
    border:1px solid #e1e5e8!important;
    border-radius:12px!important;
    background:#fff!important;
    color:#20252b!important;
    cursor:pointer!important;
  }

  .mobile-menu-button svg{
    width:22px!important;
    height:22px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
  }

  /* MENU LATERAL MOBILE — todas as páginas extras */
  .sidebar{
    display:flex!important;
    position:fixed!important;
    top:0!important;
    right:0!important;
    left:auto!important;
    bottom:0!important;
    z-index:260!important;

    width:min(84vw,330px)!important;
    max-width:330px!important;
    height:100dvh!important;

    flex-direction:column!important;
    padding:24px 18px 22px!important;

    background:#fff!important;
    border-left:1px solid #e3e6e9!important;
    box-shadow:-18px 0 48px rgba(28,34,42,.15)!important;

    transform:translateX(105%)!important;
    transition:transform .2s ease!important;
    overflow-y:auto!important;
  }

  .sidebar.mobile-open{
    transform:translateX(0)!important;
  }

  .sidebar .brand{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    margin-bottom:24px!important;
  }

  .sidebar .brand img{
    display:block!important;
    width:38px!important;
    height:38px!important;
    max-width:38px!important;
    max-height:38px!important;
    object-fit:contain!important;
  }

  .sidebar nav{
    display:grid!important;
    gap:5px!important;
  }

  .sidebar nav a{
    display:flex!important;
    align-items:center!important;
    min-height:48px!important;
    padding:0 13px!important;
    border-radius:11px!important;
    color:#454c55!important;
    text-decoration:none!important;
    font-size:15px!important;
    line-height:1.2!important;
  }

  .sidebar nav a.active{
    background:#f3f5f6!important;
    color:#171b20!important;
    font-weight:700!important;
  }

  .sidebar .logout{
    margin-top:auto!important;
    padding:13px!important;
    color:#777f88!important;
    font-size:14px!important;
  }

  .mobile-menu-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:250!important;
    background:rgba(20,24,29,.28)!important;
    opacity:0!important;
    transition:opacity .18s ease!important;
  }

  .mobile-menu-backdrop.visible{
    opacity:1!important;
  }

  body.mobile-menu-open{
    overflow:hidden!important;
  }

  /* CONTEÚDO */
  .main{
    padding:18px 14px 100px!important;
  }

  /* TIPOGRAFIA GLOBAL MAIS GRANDE */
  body{
    font-size:16px!important;
    line-height:1.5!important;
  }

  .welcome h1{
    font-size:28px!important;
  }

  .welcome p{
    font-size:14px!important;
  }

  .welcome .date{
    font-size:11px!important;
  }

  .panel-head h2,
  .ai-tips h2,
  .nanabot-diary-tip h2,
  .routine-ai h2{
    font-size:20px!important;
  }

  .tabs button{
    font-size:11px!important;
    padding:7px 10px!important;
  }

  .metrics article{
    min-height:112px!important;
    padding:14px!important;
  }

  .metrics article>div>span{
    font-size:12px!important;
  }

  .metrics strong{
    font-size:23px!important;
  }

  .metrics small{
    font-size:10px!important;
  }

  .single-tip-content p,
  .nanabot-diary-tip p,
  .routine-ai p,
  .cry-nana-result p{
    font-size:14px!important;
    line-height:1.6!important;
  }

  .nanabot-text-link{
    font-size:13px!important;
  }

  .eyebrow,
  .home-guides-header span{
    font-size:10px!important;
  }

  .home-guides-header h2{
    font-size:21px!important;
  }

  .home-guide-card strong{
    font-size:13px!important;
  }

  .home-guide-card small{
    font-size:10.5px!important;
  }

  .page-title h1{
    font-size:28px!important;
  }

  .page-title p{
    font-size:14px!important;
  }

  .gradient-btn,
  .secondary,
  .primary{
    font-size:13px!important;
  }

  /* Diário / histórico */
  .diary-history h2,
  .chart-card h2{
    font-size:18px!important;
  }

  .history-count,
  .quality-day small{
    font-size:10px!important;
  }

  .compact-sleep-list,
  .sleep-entry,
  .diary-entry{
    font-size:13px!important;
  }

  /* Plano */
  .day-tabs a{
    font-size:12px!important;
  }

  .routine-step{
    font-size:13px!important;
  }

  .routine-step strong,
  .routine-step b{
    font-size:14px!important;
  }

  /* Sons */
  .sound-category h2{
    font-size:19px!important;
  }

  .sound-tile b{
    font-size:13px!important;
  }

  .sound-tile small{
    font-size:10.5px!important;
  }

  .sound-category-tabs button{
    font-size:12px!important;
  }

  .sounds-player-inline-wrap .player-copy b{
    font-size:13px!important;
  }

  .sounds-player-inline-wrap .player-copy span,
  .sounds-player-inline-wrap .player-copy small{
    font-size:10px!important;
  }

  /* NanaBot */
  .message,
  .chat-message,
  .nanabot-message{
    font-size:14px!important;
    line-height:1.6!important;
  }

  .nanabot-input textarea,
  .chat-composer textarea{
    font-size:16px!important;
  }

  /* Choro */
  .cry-record h2,
  .cry-history h2{
    font-size:19px!important;
  }

  .cry-record p,
  .cry-history p{
    font-size:13px!important;
  }

  /* Perfil */
  .profile h2,
  .preferences h2,
  .subscription h2,
  .danger h2{
    font-size:20px!important;
  }

  .profile label,
  .preferences label,
  .subscription label,
  .danger label{
    font-size:13px!important;
  }

  .profile p,
  .preferences p,
  .subscription p,
  .danger p{
    font-size:13px!important;
  }

  /* Inputs 16px para legibilidade e sem zoom no iPhone */
  input,
  select,
  textarea{
    font-size:16px!important;
  }

  /* MENU INFERIOR MAIOR */
  .bottom-nav{
    height:72px!important;
    min-height:72px!important;
    padding:6px!important;
    border-radius:18px!important;
  }

  .bottom-nav a{
    height:60px!important;
    gap:5px!important;
  }

  .bottom-nav a svg{
    width:23px!important;
    height:23px!important;
  }

  .bottom-nav a span{
    font-size:10.5px!important;
    line-height:1.05!important;
  }
}

@media(max-width:420px){
  .mobile-head{
    height:64px!important;
    padding:0 13px!important;
  }

  .mobile-head-logo{
    height:64px!important;
  }

  .mobile-head-logo img{
    width:38px!important;
    height:38px!important;
  }

  .mobile-menu-button{
    width:40px!important;
    height:40px!important;
  }

  .main{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .welcome h1{
    font-size:26px!important;
  }

  .metrics strong{
    font-size:22px!important;
  }

  .home-guides-header h2{
    font-size:20px!important;
  }

  .bottom-nav a span{
    font-size:10px!important;
  }
}

/* =========================================================
   V110 — MOBILE MENU / NANABOT / NAV INFERIOR
========================================================= */
@media(max-width:820px){

  /* BOTÃO MENU: somente 3 linhas, sem contorno */
  .mobile-menu-button{
    width:36px!important;
    height:36px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#20252b!important;
  }

  .mobile-menu-button svg{
    width:26px!important;
    height:26px!important;
    stroke-width:1.9!important;
  }

  /* MENU LATERAL: sem logo, somente páginas */
  .sidebar .brand{
    display:none!important;
  }

  .sidebar{
    padding-top:22px!important;
  }

  .sidebar nav{
    margin-top:0!important;
  }

  .sidebar nav a{
    font-size:16px!important;
    min-height:50px!important;
  }

  .sidebar .logout{
    font-size:15px!important;
  }

  /* NANABOT — botão para abrir/fechar conversas */
  .nanabot-mobile-toolbar{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:100%!important;
    margin:0 0 8px!important;
  }

  .nanabot-mobile-toolbar button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    min-height:38px!important;
    padding:0 12px!important;
    border:1px solid #e2e5e8!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#2d333a!important;
    font-size:12px!important;
    font-weight:650!important;
  }

  .nanabot-mobile-toolbar button span{
    font-size:12px!important;
    line-height:1!important;
  }

  .nanabot-mobile-conversations{
    display:none!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin-bottom:8px!important;
  }

  .nanabot-mobile-conversations.is-open{
    display:block!important;
  }

  .nanabot-mobile-conversations .conversation-list,
  .nanabot-mobile-conversations .nanabot-conversations{
    max-height:180px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    display:block!important;
    padding-right:2px!important;
  }

  .nanabot-mobile-conversations .conversation-list > *,
  .nanabot-mobile-conversations .nanabot-conversations > *{
    width:100%!important;
    max-width:100%!important;
    margin-bottom:6px!important;
  }

  /* libera espaço para a barra de pergunta */
  .nanabot-chat,
  .chat-main,
  .chat-panel,
  .nanabot-workspace{
    min-height:0!important;
  }

  .nanabot-input,
  .chat-input,
  .chat-composer{
    position:sticky!important;
    bottom:82px!important;
    z-index:40!important;
    background:#fff!important;
    padding-top:8px!important;
  }

  /* MENU INFERIOR — margens mais equilibradas + fonte maior */
  .bottom-nav{
    left:10px!important;
    right:10px!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    inset:auto 10px max(10px,env(safe-area-inset-bottom)) 10px!important;
    height:74px!important;
    min-height:74px!important;
    padding:7px 6px!important;
    border-radius:18px!important;
  }

  .bottom-nav a{
    height:60px!important;
    min-width:0!important;
    padding:4px 2px!important;
    gap:5px!important;
  }

  .bottom-nav a svg{
    width:24px!important;
    height:24px!important;
  }

  .bottom-nav a span{
    font-size:11px!important;
    line-height:1.05!important;
    font-weight:600!important;
  }

  .bottom-nav a.active span{
    font-weight:700!important;
  }

  /* aumenta espaço inferior do conteúdo para nav maior */
  .main{
    padding-bottom:106px!important;
  }
}

@media(max-width:420px){
  .sidebar nav a{
    font-size:15px!important;
  }

  .bottom-nav{
    left:8px!important;
    right:8px!important;
    inset:auto 8px max(8px,env(safe-area-inset-bottom)) 8px!important;
  }

  .bottom-nav a span{
    font-size:10.5px!important;
  }

  .nanabot-mobile-conversations .conversation-list,
  .nanabot-mobile-conversations .nanabot-conversations{
    max-height:160px!important;
  }
}

/* =========================================================
   V111 — NanaBot mobile + barra de pergunta + bottom nav
========================================================= */
@media(max-width:820px){

  /* NanaBot: Conversas à esquerda / status à direita */
  .nanabot-mobile-toolbar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-height:38px!important;
    margin:0 0 8px!important;
    padding:0 2px!important;
  }

  .nanabot-mobile-toolbar button{
    margin:0!important;
    min-height:36px!important;
    padding:0 10px!important;
    border:0!important;
    border-radius:9px!important;
    background:#f6f7f8!important;
    color:#2c3238!important;
    font-size:12px!important;
    font-weight:650!important;
    box-shadow:none!important;
  }

  .nanabot-mobile-toolbar button span{
    margin-left:3px!important;
    font-size:11px!important;
  }

  .nanabot-mobile-status-dot{
    display:block!important;
    width:9px!important;
    height:9px!important;
    min-width:9px!important;
    min-height:9px!important;
    margin-right:4px!important;
    border-radius:50%!important;
    background:#35b86b!important;
    box-shadow:0 0 0 3px rgba(53,184,107,.10)!important;
  }

  /* Barra de pergunta fixa imediatamente acima do menu inferior */
  .nanabot-input,
  .chat-input,
  .chat-composer,
  .nanabot-composer,
  .nanabot-input-wrap{
    position:fixed!important;
    left:14px!important;
    right:14px!important;
    bottom:96px!important;
    z-index:190!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:8px!important;
    background:#fff!important;
    border:1px solid #e1e5e8!important;
    border-radius:14px!important;
    box-shadow:0 10px 28px rgba(30,36,44,.10)!important;
  }

  /* conteúdo do chat ganha respiro para não ficar atrás da barra */
  .nanabot-workspace,
  .nanabot-chat,
  .chat-main,
  .chat-panel,
  .nanabot-messages,
  .chat-messages{
    padding-bottom:92px!important;
  }

  /* MENU INFERIOR — realmente centralizado */
  .bottom-nav{
    position:fixed!important;
    left:50%!important;
    right:auto!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    transform:translateX(-50%)!important;

    width:calc(100vw - 20px)!important;
    max-width:520px!important;
    height:74px!important;
    min-height:74px!important;

    margin:0!important;
    padding:7px 6px!important;

    border-radius:18px!important;
  }

  .bottom-nav a{
    height:60px!important;
    min-width:0!important;
    padding:4px 2px!important;
  }

  .bottom-nav a span{
    font-size:11px!important;
  }

  .bottom-nav a svg{
    width:24px!important;
    height:24px!important;
  }

  /* conteúdo geral respeita barra inferior centralizada */
  .main{
    padding-bottom:112px!important;
  }
}

@media(max-width:420px){
  .bottom-nav{
    width:calc(100vw - 16px)!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
  }

  .nanabot-input,
  .chat-input,
  .chat-composer,
  .nanabot-composer,
  .nanabot-input-wrap{
    left:12px!important;
    right:12px!important;
    bottom:94px!important;
  }
}

/* =========================================================
   V113 — correção final do menu inferior mobile
   Centralização real + conteúdo levemente mais alto
========================================================= */
@media(max-width:820px){

  body > .bottom-nav,
  .bottom-nav{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    transform:none!important;

    width:auto!important;
    max-width:none!important;
    box-sizing:border-box!important;

    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:stretch!important;
    justify-items:stretch!important;

    height:74px!important;
    min-height:74px!important;
    margin:0!important;
    padding:6px!important;

    border:1px solid #e1e5e8!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.98)!important;
    overflow:hidden!important;
  }

  body > .bottom-nav > a,
  .bottom-nav > a{
    position:relative!important;
    top:-2px!important;

    width:100%!important;
    min-width:0!important;
    height:60px!important;
    margin:0!important;
    padding:4px 1px 6px!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;

    border-radius:12px!important;
    box-sizing:border-box!important;
    text-align:center!important;
  }

  .bottom-nav > a svg{
    display:block!important;
    width:23px!important;
    height:23px!important;
    flex:0 0 23px!important;
    margin:0!important;
  }

  .bottom-nav > a span{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;

    font-size:10.5px!important;
    line-height:11px!important;
    font-weight:600!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  .bottom-nav > a.active span{
    font-weight:700!important;
  }
}

@media(max-width:420px){
  body > .bottom-nav,
  .bottom-nav{
    left:8px!important;
    right:8px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    width:auto!important;
  }

  .bottom-nav > a span{
    font-size:10px!important;
  }
}

/* V114 — NanaBot mobile: somente UMA bolinha verde */
@media(max-width:820px){
  .nanabot-mobile-toolbar .nanabot-mobile-status-dot{
    display:block!important;
  }

  .nanabot-header .status-dot,
  .nanabot-header .online-dot,
  .nanabot-status .status-dot,
  .nanabot-status-dot,
  .chat-status-dot,
  .online-indicator,
  .nanabot-online:not(.nanabot-mobile-status-dot){
    display:none!important;
  }
}

/* V115 — mobile: somente UMA bolinha verde na NanaBot */
@media(max-width:820px){
  .nanabot-mobile-status-dot{
    display:none!important;
  }

  .deepseek-status{
    display:flex!important;
  }
}

@media(max-width:820px){
  .nanabot-mobile-conversations-bar{
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    gap:10px!important;width:100%!important;margin:0 0 10px!important
  }
  .nanabot-mobile-history-btn,.nanabot-mobile-new-btn{
    min-height:40px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
    gap:6px!important;padding:0 11px!important;border:1px solid #e1e5e8!important;border-radius:10px!important;
    background:#fff!important;color:#252a30!important;font-size:12px!important;font-weight:650!important
  }
  .nanabot-mobile-history-btn svg,.nanabot-mobile-new-btn svg{
    width:16px!important;height:16px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important
  }
  .nanabot-mobile-new-btn{margin-left:auto!important;background:#f6f7f8!important}
  .nanabot-mobile-history-panel{
    display:none!important;width:100%!important;max-width:100%!important;min-width:0!important;height:auto!important;
    max-height:260px!important;margin:0 0 10px!important;padding:10px!important;border:1px solid #e2e5e8!important;
    border-radius:13px!important;background:#fff!important;overflow-y:auto!important;overflow-x:hidden!important
  }
  .nanabot-mobile-history-panel.is-open{display:block!important}
  .nanabot-mobile-history-panel .conversation-list,
  .nanabot-mobile-history-panel .nanabot-conversations{
    display:grid!important;grid-template-columns:1fr!important;gap:6px!important;width:100%!important;overflow:visible!important
  }
  .nanabot-mobile-history-panel .conversation-item,
  .nanabot-mobile-history-panel [class*="conversation-item"]{
    width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:10px 11px!important;
    border-radius:10px!important;background:#f8f9fa!important;overflow:hidden!important
  }
  .nanabot-mobile-history-panel .conversation-title,
  .nanabot-mobile-history-panel [class*="title"]{
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:12px!important
  }
  .nanabot-mobile-history-panel [data-new-conversation],
  .nanabot-mobile-history-panel #newConversation,
  .nanabot-mobile-history-panel .new-conversation{display:none!important}

  .nanabot-layout,.nanabot-workspace,.nanabot-chat,.chat-main,.chat-panel{
    width:100%!important;max-width:100%!important;min-width:0!important
  }
  .nanabot-messages,.chat-messages{
    width:100%!important;max-width:100%!important;min-width:0!important;padding-bottom:105px!important
  }
  .message,.chat-message,.nanabot-message{max-width:90%!important}

  .chat-composer,.nanabot-input,.chat-input,.nanabot-composer,.nanabot-input-wrap{
    position:fixed!important;left:12px!important;right:12px!important;bottom:96px!important;z-index:210!important;
    width:auto!important;max-width:none!important;margin:0!important;padding:8px!important;border:1px solid #e1e5e8!important;
    border-radius:14px!important;background:#fff!important;box-shadow:0 10px 28px rgba(28,34,42,.11)!important
  }
}
@media(min-width:821px){.nanabot-mobile-conversations-bar{display:none!important}}

/* =========================================================
   V117 — NanaBot mobile limpo: sem controles duplicados
========================================================= */
@media(max-width:820px){
  /* A única barra mobile permitida */
  .nanabot-mobile-conversations-bar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    width:100%!important;
    margin:0 0 12px!important;
  }

  /* Remove cabeçalhos/controles antigos que estavam repetindo Conversas/status */
  .nanabot-mobile-toolbar,
  .nanabot-head .deepseek-status,
  .nanabot-header .deepseek-status,
  .nanabot-top .deepseek-status,
  .nanabot-head .status,
  .nanabot-header .status{
    display:none!important;
  }

  /* Dentro do painel recolhível, não repetir título "Conversas" nem status */
  .nanabot-mobile-history-panel > h2,
  .nanabot-mobile-history-panel > h3,
  .nanabot-mobile-history-panel .history-title,
  .nanabot-mobile-history-panel .conversations-title,
  .nanabot-mobile-history-panel .deepseek-status{
    display:none!important;
  }

  /* Uma única bolinha verde discreta no topo da área do chat */
  .nanabot-mobile-conversations-bar::after{
    content:""!important;
    display:block!important;
    width:9px!important;
    height:9px!important;
    min-width:9px!important;
    border-radius:50%!important;
    background:#35b86b!important;
    box-shadow:0 0 0 3px rgba(53,184,107,.10)!important;
    order:3!important;
    margin-left:0!important;
  }

  .nanabot-mobile-new-btn{order:2!important;margin-left:auto!important}
  .nanabot-mobile-history-btn{order:1!important}

  /* Não deixa bolinhas/status legados aparecerem soltos */
  .nanabot-mobile-status-dot,
  .nanabot-status-dot,
  .chat-status-dot,
  .online-indicator,
  .nanabot-online{
    display:none!important;
  }
}

/* =========================================================
   V118 — NanaBot mobile: 1 bolinha verde + aviso fixo
========================================================= */
@media(max-width:820px){

  /* remove bolinhas extras criadas por pseudo-elementos/customizações */
  .nanabot-mobile-conversations-bar::after,
  .nanabot-mobile-conversations-bar::before,
  .nanabot-mobile-status-dot,
  .nanabot-status-dot,
  .chat-status-dot,
  .online-indicator,
  .nanabot-online,
  .nanabot-mobile-toolbar .nanabot-mobile-status-dot{
    display:none!important;
    content:none!important;
  }

  /* mantém somente o status real da IA */
  .deepseek-status{
    display:flex!important;
    align-items:center!important;
  }

  .deepseek-status > i{
    display:block!important;
    width:9px!important;
    height:9px!important;
    min-width:9px!important;
    min-height:9px!important;
    border-radius:50%!important;
    background:#35b86b!important;
    box-shadow:0 0 0 3px rgba(53,184,107,.10)!important;
  }

  /* AVISO fixo imediatamente acima da barra de pergunta */
  .nanabot-mobile-disclaimer{
    position:fixed!important;
    left:14px!important;
    right:14px!important;
    bottom:148px!important;
    z-index:205!important;

    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0 6px!important;

    background:transparent!important;
    color:#8b929a!important;
    border:0!important;
    box-shadow:none!important;

    font-size:10px!important;
    line-height:1.35!important;
    text-align:center!important;
  }

  /* barra de pergunta logo abaixo do aviso */
  .chat-composer,
  .nanabot-input,
  .chat-input,
  .nanabot-composer,
  .nanabot-input-wrap{
    bottom:94px!important;
  }

  /* não precisa de tanto espaço no fim do chat */
  .nanabot-messages,
  .chat-messages{
    padding-bottom:128px!important;
  }
}

@media(max-width:420px){
  .nanabot-mobile-disclaimer{
    left:12px!important;
    right:12px!important;
    bottom:146px!important;
    font-size:9.5px!important;
  }
}

/* =========================================================
   V119 — NanaBot mobile: sem rolagem gigante + status no topo
========================================================= */
@media(max-width:820px){

  /* Barra superior: Conversas | Nova conversa | bolinha */
  .nanabot-mobile-conversations-bar{
    display:grid!important;
    grid-template-columns:auto 1fr auto!important;
    align-items:center!important;
    gap:9px!important;
    width:100%!important;
    margin:0 0 10px!important;
  }

  .nanabot-mobile-history-btn{
    justify-self:start!important;
  }

  .nanabot-mobile-new-btn{
    justify-self:end!important;
    margin-left:auto!important;
  }

  .nanabot-mobile-live-dot{
    display:block!important;
    width:9px!important;
    height:9px!important;
    min-width:9px!important;
    min-height:9px!important;
    border-radius:50%!important;
    background:#35b86b!important;
    box-shadow:0 0 0 3px rgba(53,184,107,.10)!important;
    margin-left:1px!important;
  }

  /* Esconde todos os demais indicadores no mobile */
  .deepseek-status,
  .nanabot-mobile-status-dot,
  .nanabot-status-dot,
  .chat-status-dot,
  .online-indicator,
  .nanabot-online,
  .nanabot-mobile-conversations-bar::before,
  .nanabot-mobile-conversations-bar::after{
    display:none!important;
    content:none!important;
  }

  /* Remove alturas/paddings herdados que estavam criando o 'deslize enorme' */
  .nanabot-layout,
  .nanabot-workspace,
  .nanabot-chat,
  .chat-main,
  .chat-panel{
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  .nanabot-messages,
  .chat-messages{
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    padding-bottom:0!important;
    margin-bottom:138px!important; /* só o necessário para aviso + input */
  }

  /* remove spacers vazios herdados */
  .nanabot-spacer,
  .chat-spacer,
  .composer-spacer,
  .nanabot-bottom-spacer{
    display:none!important;
    height:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
  }

  /* aviso imediatamente acima do composer, sem criar altura na página */
  .nanabot-mobile-disclaimer{
    position:fixed!important;
    left:14px!important;
    right:14px!important;
    bottom:148px!important;
    z-index:205!important;
    margin:0!important;
    padding:0 4px!important;
    font-size:9.5px!important;
    line-height:1.25!important;
    color:#8b929a!important;
    text-align:center!important;
    background:transparent!important;
    pointer-events:none!important;
  }

  /* barra de pergunta fixa, mas sem espaço extra além do necessário */
  .chat-composer,
  .nanabot-input,
  .chat-input,
  .nanabot-composer,
  .nanabot-input-wrap{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:94px!important;
    z-index:210!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
  }

  /* a página da NanaBot não precisa reservar um rodapé gigantesco */
  body:has(.nanabot-mobile-conversations-bar) .main{
    padding-bottom:96px!important;
  }
}

@media(max-width:420px){
  .nanabot-mobile-conversations-bar{
    gap:8px!important;
  }

  .nanabot-mobile-live-dot{
    width:8px!important;
    height:8px!important;
    min-width:8px!important;
    min-height:8px!important;
  }

  .nanabot-mobile-disclaimer{
    left:12px!important;
    right:12px!important;
    bottom:146px!important;
  }

  .nanabot-messages,
  .chat-messages{
    margin-bottom:134px!important;
  }
}

/* =========================================================
   V120 — Plano de Sono mobile: dias da semana corrigidos
========================================================= */
@media(max-width:820px){

  /* faixa de dias sempre visível e rolável */
  .plan-weekdays-mobile,
  .day-tabs{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 14px!important;
    padding:2px 2px 6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x proximity!important;
  }

  .plan-weekdays-mobile::-webkit-scrollbar,
  .day-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .plan-weekdays-mobile a,
  .day-tabs a{
    flex:0 0 auto!important;
    min-width:72px!important;
    height:40px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 12px!important;
    margin:0!important;
    border:1px solid #e1e5e8!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#6f7781!important;
    text-decoration:none!important;
    font-size:12px!important;
    font-weight:600!important;
    line-height:1!important;
    scroll-snap-align:start!important;
  }

  .plan-weekdays-mobile a.active,
  .day-tabs a.active{
    background:#f3f5f6!important;
    color:#1f242a!important;
    border-color:#d8dde2!important;
    font-weight:700!important;
  }

  /* conteúdo do plano sem cortar */
  .routine-layout,
  .routine-panel,
  .plan-panel,
  .routine-list{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  .routine-step{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:28px 50px minmax(0,1fr)!important;
    gap:9px!important;
    padding:13px 10px!important;
    align-items:start!important;
  }

  .routine-step > *{
    min-width:0!important;
  }

  .routine-step strong,
  .routine-step b{
    font-size:14px!important;
    line-height:1.3!important;
  }

  .routine-step small,
  .routine-step p{
    font-size:11px!important;
    line-height:1.45!important;
  }

  /* cabeçalho do plano */
  .page-title.row{
    margin-bottom:12px!important;
  }
}

@media(max-width:420px){
  .plan-weekdays-mobile a,
  .day-tabs a{
    min-width:66px!important;
    height:38px!important;
    padding:0 10px!important;
    font-size:11.5px!important;
  }
}

/* =========================================================
   V121 — Plano de Sono: dias deslizáveis em desktop/mobile
   + excluir com X minimalista
========================================================= */

/* Dias da semana — mesmo padrão no desktop e mobile */
.plan-weekdays-scroll{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  width:100%!important;
  max-width:100%!important;
  margin:0 0 16px!important;
  padding:2px 2px 7px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  white-space:nowrap!important;
  scrollbar-width:none!important;
  -webkit-overflow-scrolling:touch!important;
  scroll-snap-type:x proximity!important;
}

.plan-weekdays-scroll::-webkit-scrollbar{
  display:none!important;
}

.plan-weekdays-scroll a{
  flex:0 0 auto!important;
  min-width:96px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 14px!important;
  margin:0!important;
  border:1px solid #e1e5e8!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#6f7781!important;
  text-decoration:none!important;
  font-size:12px!important;
  font-weight:600!important;
  line-height:1!important;
  scroll-snap-align:start!important;
}

.plan-weekdays-scroll a.active{
  background:#f3f5f6!important;
  color:#1f242a!important;
  border-color:#d8dde2!important;
  font-weight:700!important;
}

/* Linha da rotina com coluna própria para o X */
.routine-step{
  grid-template-columns:28px 52px minmax(0,1fr) 34px!important;
  align-items:center!important;
  gap:10px!important;
}

.routine-step > div{
  min-width:0!important;
}

/* X minimalista igual ao Diário */
.delete-step{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  display:grid!important;
  place-items:center!important;
  justify-self:end!important;
  align-self:center!important;
  grid-column:4!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f3f5f6!important;
  color:#8c939b!important;
  box-shadow:none!important;
  cursor:pointer!important;
}

.delete-step span{
  display:block!important;
  font-size:18px!important;
  font-weight:400!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
}

.delete-step:hover{
  background:#eaedef!important;
  color:#343a41!important;
}

/* MOBILE */
@media(max-width:820px){
  .plan-weekdays-scroll{
    gap:8px!important;
    margin-bottom:13px!important;
  }

  .plan-weekdays-scroll a{
    min-width:76px!important;
    height:40px!important;
    padding:0 12px!important;
    font-size:12px!important;
  }

  .routine-step{
    grid-template-columns:28px 46px minmax(0,1fr) 30px!important;
    gap:8px!important;
    padding:12px 9px!important;
  }

  .delete-step{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
  }

  .delete-step span{
    font-size:17px!important;
  }
}

@media(max-width:420px){
  .plan-weekdays-scroll a{
    min-width:70px!important;
    height:38px!important;
    padding:0 10px!important;
    font-size:11.5px!important;
  }

  .routine-step{
    grid-template-columns:26px 43px minmax(0,1fr) 28px!important;
    gap:7px!important;
  }
}

/* =========================================================
   V122 — Plano de Sono
   Desktop mantém o design original
   Mobile usa dias compactos e deslizáveis
========================================================= */

/* DESKTOP: neutraliza o estilo deslizável da V121 */
@media(min-width:821px){
  .day-tabs.plan-weekdays-scroll{
    /* deixa as regras originais do site dominarem */
    overflow:visible!important;
    white-space:normal!important;
    scrollbar-width:auto!important;
  }

  .day-tabs.plan-weekdays-scroll a{
    min-width:0!important;
  }
}

/* MOBILE: dias lado a lado, compactos, roláveis */
@media(max-width:820px){
  .day-tabs.plan-weekdays-scroll{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;

    width:100%!important;
    max-width:100%!important;
    margin:0 0 14px!important;
    padding:2px 0 6px!important;

    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .day-tabs.plan-weekdays-scroll::-webkit-scrollbar{
    display:none!important;
  }

  .day-tabs.plan-weekdays-scroll a{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:68px!important;
    max-width:none!important;
    height:38px!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    margin:0!important;
    padding:0 11px!important;

    border:1px solid #e1e5e8!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#6f7781!important;

    font-size:11.5px!important;
    line-height:1!important;
    font-weight:600!important;
    text-decoration:none!important;
  }

  .day-tabs.plan-weekdays-scroll a.active{
    background:#f3f5f6!important;
    color:#1f242a!important;
    border-color:#d8dde2!important;
    font-weight:700!important;
  }

  /* impede qualquer regra antiga de deixar só um dia ocupando 100% */
  .day-tabs.plan-weekdays-scroll a,
  .day-tabs.plan-weekdays-scroll > *{
    flex-grow:0!important;
  }

  /* rotina abaixo continua organizada */
  .routine-step{
    grid-template-columns:28px 46px minmax(0,1fr) 30px!important;
    gap:8px!important;
    padding:12px 9px!important;
  }
}

@media(max-width:420px){
  .day-tabs.plan-weekdays-scroll{
    gap:7px!important;
  }

  .day-tabs.plan-weekdays-scroll a{
    min-width:64px!important;
    height:37px!important;
    padding:0 9px!important;
    font-size:11px!important;
  }
}

/* =========================================================
   V123 — Plano de Sono DESKTOP corrigido
   Mobile da V122 permanece intacto
========================================================= */
@media(min-width:821px){

  .day-tabs.plan-weekdays-scroll,
  .day-tabs{
    display:grid!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    align-items:stretch!important;
    gap:8px!important;

    width:100%!important;
    max-width:100%!important;
    margin:0 0 18px!important;
    padding:0!important;

    overflow:visible!important;
    white-space:normal!important;
  }

  .day-tabs.plan-weekdays-scroll a,
  .day-tabs a{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:42px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    margin:0!important;
    padding:0 10px!important;

    border:1px solid #e1e5e8!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#737b84!important;

    font-size:11.5px!important;
    font-weight:600!important;
    line-height:1!important;
    text-decoration:none!important;

    box-sizing:border-box!important;
  }

  .day-tabs.plan-weekdays-scroll a.active,
  .day-tabs a.active{
    background:#f3f5f6!important;
    border-color:#d7dce1!important;
    color:#1f2429!important;
    font-weight:700!important;
  }

  .day-tabs.plan-weekdays-scroll a:hover,
  .day-tabs a:hover{
    border-color:#cfd5da!important;
    color:#24292f!important;
  }

  /* Linha da rotina bem distribuída no desktop */
  .routine-step{
    grid-template-columns:30px 56px minmax(0,1fr) 32px!important;
    align-items:center!important;
    gap:12px!important;
    padding:13px 14px!important;
  }

  .routine-step > div{
    min-width:0!important;
  }

  .delete-step{
    grid-column:4!important;
    justify-self:end!important;
    align-self:center!important;
  }
}

/* =========================================================
   V124 — NanaBot mobile:
   Pensando acima da barra + aviso mais alto e à esquerda
========================================================= */
@media(max-width:820px){

  /* "Pensando..." fica imediatamente acima do aviso/composer */
  .nanabot-thinking{
    position:fixed!important;
    left:18px!important;
    right:18px!important;
    bottom:169px!important;
    z-index:207!important;

    width:auto!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    color:#747c85!important;

    font-size:11px!important;
    line-height:1.2!important;
    text-align:left!important;
    pointer-events:none!important;
  }

  .nanabot-thinking .thinking-dots{
    display:inline!important;
  }

  /* aviso sobe um pouco e fica alinhado à esquerda */
  .nanabot-mobile-disclaimer{
    position:fixed!important;
    left:18px!important;
    right:18px!important;
    bottom:150px!important;
    z-index:206!important;

    width:auto!important;
    margin:0!important;
    padding:0!important;

    color:#8b929a!important;
    background:transparent!important;

    font-size:9.5px!important;
    line-height:1.25!important;
    text-align:left!important;
    pointer-events:none!important;
  }

  /* barra continua logo abaixo */
  .chat-composer,
  .nanabot-input,
  .chat-input,
  .nanabot-composer,
  .nanabot-input-wrap{
    bottom:94px!important;
  }

  /* evita espaço exagerado no final */
  .nanabot-messages,
  .chat-messages{
    margin-bottom:142px!important;
    padding-bottom:0!important;
  }
}

@media(max-width:420px){
  .nanabot-thinking{
    left:14px!important;
    right:14px!important;
    bottom:166px!important;
    font-size:10.5px!important;
  }

  .nanabot-mobile-disclaimer{
    left:14px!important;
    right:14px!important;
    bottom:148px!important;
    font-size:9px!important;
  }
}

/* =========================================================
   V125 — NanaBot mobile: rodapé do chat como um único bloco
========================================================= */
@media(max-width:820px){

  /* O conjunto inteiro fica preso acima do menu inferior */
  .chat-composer-wrap{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:92px!important;
    z-index:210!important;

    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;

    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  /* Pensando fica junto do campo, sem flutuar pela tela */
  .chat-composer-wrap .nanabot-thinking{
    position:static!important;
    inset:auto!important;
    width:auto!important;
    margin:0 0 1px 5px!important;
    padding:0!important;

    background:transparent!important;
    color:#6f7781!important;

    font-size:11px!important;
    line-height:1.2!important;
    text-align:left!important;
    pointer-events:none!important;
  }

  /* Aviso logo acima da caixa e alinhado à esquerda */
  .chat-composer-wrap .nanabot-mobile-disclaimer{
    position:static!important;
    inset:auto!important;

    display:block!important;
    width:100%!important;
    margin:0 0 1px!important;
    padding:0 5px!important;

    background:transparent!important;
    color:#9aa1a9!important;
    border:0!important;

    font-size:9.5px!important;
    line-height:1.25!important;
    text-align:left!important;
    pointer-events:none!important;
  }

  /* Formulário volta a ser parte do fluxo desse bloco */
  .chat-composer-wrap .chat-composer{
    position:static!important;
    inset:auto!important;

    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    width:100%!important;
    max-width:none!important;
    min-height:52px!important;
    margin:0!important;
    padding:6px!important;

    border:1px solid #dfe4e8!important;
    border-radius:15px!important;
    background:#fff!important;
    box-shadow:0 8px 24px rgba(28,34,42,.09)!important;
  }

  .chat-composer-wrap .chat-composer input{
    min-width:0!important;
    width:100%!important;
    height:40px!important;
    margin:0!important;
    padding:0 8px!important;

    border:0!important;
    outline:0!important;
    background:transparent!important;

    font-size:14px!important;
  }

  .chat-composer-wrap .chat-composer button{
    min-width:70px!important;
    height:40px!important;
    margin:0!important;
    padding:0 15px!important;

    border:0!important;
    border-radius:11px!important;

    font-size:11px!important;
    font-weight:650!important;
  }

  /* Neutraliza regras antigas que fixavam os filhos individualmente */
  .nanabot-input,
  .chat-input,
  .nanabot-composer,
  .nanabot-input-wrap{
    position:static!important;
    inset:auto!important;
  }

  /* Só reserva o espaço real do rodapé, sem "buraco" enorme */
  .nanabot-messages,
  .chat-messages{
    margin-bottom:128px!important;
    padding-bottom:0!important;
  }

  body:has(.chat-composer-wrap) .main{
    padding-bottom:92px!important;
  }
}

@media(max-width:420px){
  .chat-composer-wrap{
    left:10px!important;
    right:10px!important;
    bottom:90px!important;
  }

  .chat-composer-wrap .nanabot-thinking{
    margin-left:4px!important;
    font-size:10.5px!important;
  }

  .chat-composer-wrap .nanabot-mobile-disclaimer{
    padding-left:4px!important;
    font-size:9px!important;
  }

  .chat-composer-wrap .chat-composer button{
    min-width:66px!important;
    padding:0 12px!important;
  }
}

/* =========================================================
   V126 — Análise de Choro: minimalista desktop + mobile
========================================================= */

/* layout geral */
.cry-v126{
  display:grid!important;
  grid-template-columns:320px minmax(0,1fr)!important;
  gap:14px!important;
  align-items:start!important;
}

/* somente Nova gravação como bloco branco de destaque */
.cry-record-primary{
  position:sticky!important;
  top:18px!important;
  padding:30px 22px!important;
  border:1px solid #e1e5e8!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:none!important;
  text-align:center!important;
}

.cry-record-primary h2{
  margin:0 0 7px!important;
  font-size:23px!important;
  line-height:1.15!important;
  letter-spacing:-.02em!important;
}

.cry-record-primary p{
  margin:0 auto 22px!important;
  max-width:240px!important;
  color:#818993!important;
  font-size:12px!important;
  line-height:1.55!important;
}

/* histórico sem blocão branco */
.cry-history-clean{
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.cry-history-clean > h2,
.cry-history-clean .section-title h2,
.cry-history-clean .panel-head h2{
  font-size:20px!important;
  margin-bottom:4px!important;
}

.cry-history-clean > p,
.cry-history-clean .section-title p,
.cry-history-clean .panel-head p{
  color:#9299a2!important;
  font-size:10.5px!important;
}

/* cada gravação vira card leve */
.cry-history-clean article,
.cry-history-clean .cry-item,
.cry-history-clean .history-item{
  margin:0 0 10px!important;
  padding:14px!important;
  border:1px solid #e1e5e8!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:none!important;
}

/* player */
.cry-history-clean audio{
  width:100%!important;
  margin-top:8px!important;
}

/* análise da NanaBot */
.cry-analysis-card,
.cry-nana-result{
  margin-top:10px!important;
  padding:15px!important;
  border:1px solid #e5e8eb!important;
  border-radius:12px!important;
  background:#f8f9fa!important;
}

.cry-analysis-card .eyebrow,
.cry-nana-result .eyebrow{
  font-size:9px!important;
  letter-spacing:.08em!important;
}

.cry-analysis-card p,
.cry-nana-result p,
.cry-analysis-card .analysis-text,
.cry-nana-result .analysis-text{
  margin:7px 0 0!important;
  color:#4c555f!important;
  font-size:13.5px!important;
  line-height:1.62!important;
}

/* ações abaixo da análise */
.cry-result-actions{
  margin-top:11px!important;
  padding-top:10px!important;
  border-top:1px solid #e4e7ea!important;
}

.cry-listen-nanabot,
[data-cry-listen]{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  min-height:32px!important;
  padding:0 9px!important;
  border:0!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#343b43!important;
  font-size:10.5px!important;
  font-weight:650!important;
  text-decoration:none!important;
  cursor:pointer!important;
}

/* mobile */
@media(max-width:820px){
  .cry-v126{
    display:block!important;
  }

  .cry-record-primary{
    position:static!important;
    width:100%!important;
    margin:0 0 14px!important;
    padding:24px 17px!important;
    border-radius:16px!important;
  }

  .cry-record-primary h2{
    font-size:22px!important;
  }

  .cry-record-primary p{
    font-size:12.5px!important;
  }

  .cry-history-clean{
    width:100%!important;
  }

  .cry-history-clean article,
  .cry-history-clean .cry-item,
  .cry-history-clean .history-item{
    padding:13px!important;
    border-radius:13px!important;
  }

  .cry-analysis-card p,
  .cry-nana-result p,
  .cry-analysis-card .analysis-text,
  .cry-nana-result .analysis-text{
    font-size:14px!important;
    line-height:1.6!important;
  }

  .cry-listen-nanabot,
  [data-cry-listen]{
    min-height:34px!important;
    font-size:11px!important;
  }
}

/* V127 — Análise de Choro usando as classes reais */
.cry-v127{display:grid!important;grid-template-columns:300px minmax(0,1fr)!important;gap:22px!important;align-items:start!important}
.cry-v127 .cry-record-v127{position:sticky!important;top:18px!important;padding:30px 22px 26px!important;margin:0!important;border:1px solid #e0e4e8!important;border-radius:18px!important;background:#fff!important;box-shadow:none!important;text-align:center!important}
.cry-v127 .cry-record-v127 h2{margin:0 0 7px!important;font-size:21px!important;line-height:1.2!important;letter-spacing:-.025em!important}
.cry-v127 .cry-record-v127>p{max-width:225px!important;margin:0 auto 20px!important;color:#7f8790!important;font-size:12px!important;line-height:1.55!important}

/* Histórico deixa de ser um grande bloco branco */
.cry-v127 .cry-history-v127{padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
.cry-v127 .cry-history-v127 .panel-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:14px!important;margin:0 0 13px!important;padding:2px 2px 0!important;border:0!important}
.cry-v127 .cry-history-v127 .panel-head h2{margin:0 0 4px!important;font-size:21px!important;line-height:1.2!important;letter-spacing:-.02em!important}
.cry-v127 .cry-history-v127 .panel-head small{color:#8c949d!important;font-size:11px!important;line-height:1.4!important}
.cry-v127 #cryHistoryCount{flex:0 0 auto!important;color:#969da5!important;font-size:10px!important;font-weight:500!important}

/* Cada gravação individual */
.cry-v127 .cry-list{display:grid!important;gap:10px!important}
.cry-v127 .cry-list>article{padding:15px!important;margin:0!important;border:1px solid #e1e5e8!important;border-radius:15px!important;background:#fff!important;box-shadow:none!important}
.cry-v127 .cry-meta{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 0 10px!important}
.cry-v127 .cry-meta b{font-size:12px!important;font-weight:650!important}
.cry-v127 .cry-actions{display:flex!important;align-items:center!important;gap:7px!important}
.cry-v127 .cry-delete{width:28px!important;height:28px!important;min-width:28px!important;padding:0!important;display:grid!important;place-items:center!important;border:0!important;border-radius:50%!important;background:#f3f5f6!important;color:#8a929a!important;font-size:17px!important;line-height:1!important}
.cry-v127 .cry-list audio{display:block!important;width:100%!important;height:36px!important;margin:0!important}

/* Análise NanaBot realmente maior */
.cry-v127 .cry-nana-result{margin-top:12px!important;padding:16px!important;border:0!important;border-radius:13px!important;background:#f5f7f8!important}
.cry-v127 .cry-nana-result .eyebrow{display:block!important;margin:0 0 7px!important;color:#7f8790!important;font-size:10px!important;font-weight:700!important;letter-spacing:.07em!important}
.cry-v127 .cry-nana-result>p,.cry-v127 .cry-nana-result>p p{margin:0!important;color:#343b43!important;font-size:15px!important;line-height:1.65!important;font-weight:400!important}
.cry-v127 .cry-result-actions{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;margin-top:13px!important;padding-top:11px!important;border-top:1px solid #e1e5e8!important}
.cry-v127 .cry-listen{min-height:34px!important;display:inline-flex!important;align-items:center!important;gap:6px!important;padding:0 11px!important;border:1px solid #dde2e6!important;border-radius:9px!important;background:#fff!important;color:#343a40!important;font-size:11px!important;font-weight:650!important}
.cry-v127 .cry-result-actions a{margin:0!important;font-size:11px!important}
.cry-v127 .infinite-loader,.cry-v127 .history-end,.cry-v127 .empty{background:transparent!important;border:0!important;box-shadow:none!important}

@media(max-width:820px){
 .cry-v127{display:block!important}
 .cry-v127 .cry-record-v127{position:static!important;top:auto!important;width:100%!important;margin:0 0 22px!important;padding:25px 17px 23px!important;border-radius:16px!important}
 .cry-v127 .cry-record-v127 h2{font-size:22px!important}
 .cry-v127 .cry-record-v127>p{max-width:280px!important;font-size:13px!important}
 .cry-v127 .cry-history-v127 .panel-head{align-items:flex-start!important;margin-bottom:12px!important}
 .cry-v127 .cry-history-v127 .panel-head h2{font-size:21px!important}
 .cry-v127 #cryHistoryCount{padding-top:4px!important;font-size:9.5px!important}
 .cry-v127 .cry-list>article{padding:13px!important;border-radius:14px!important}
 .cry-v127 .cry-meta{align-items:flex-start!important}
 .cry-v127 .cry-nana-result{padding:14px!important}
 .cry-v127 .cry-nana-result>p,.cry-v127 .cry-nana-result>p p{font-size:14.5px!important;line-height:1.62!important}
 .cry-v127 .cry-listen,.cry-v127 .cry-result-actions a{font-size:10.5px!important}
}
@media(max-width:430px){.cry-v127 .cry-result-actions{flex-wrap:wrap!important}}

/* V128 — Choro: 3 usos grátis + paywall */
.cry-v127 .cry-list audio,
.cry-v127 .cry-listen{
  display:none!important;
}
.cry-v127 .cry-result-actions{
  justify-content:flex-end!important;
}
.cry-history-v127{
  position:relative!important;
}
.cry-history-v127.cry-premium-locked .cry-list,
.cry-history-v127.cry-premium-locked .panel-head{
  filter:blur(2.5px)!important;
  opacity:.48!important;
  pointer-events:none!important;
  user-select:none!important;
}
.cry-premium-overlay{
  position:absolute!important;
  inset:0!important;
  z-index:8!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
}
.cry-premium-cta{
  pointer-events:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:44px!important;
  padding:0 17px!important;
  border-radius:10px!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
  box-shadow:0 10px 28px rgba(34,42,51,.14)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px!important;
  font-weight:700!important;
}
.cry-premium-cta svg{
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
@media(max-width:820px){
  .cry-premium-cta{
    min-height:42px!important;
    padding:0 15px!important;
    font-size:11.5px!important;
  }
  .cry-history-v127.cry-premium-locked .cry-list,
  .cry-history-v127.cry-premium-locked .panel-head{
    filter:blur(2px)!important;
  }
}

/* =========================================================
   V129 — Análise de Choro sem barra de rolagem interna
   Desktop e mobile
========================================================= */

/* Histórico acompanha o fluxo normal da página */
.cry-v127 .cry-history-v127,
.cry-v127 .infinite-cry-history,
.cry-v127 #cryInfiniteList,
.cry-v127 .cry-list{
  height:auto!important;
  max-height:none!important;
  min-height:0!important;
  overflow:visible!important;
  overflow-x:visible!important;
  overflow-y:visible!important;
  scrollbar-width:none!important;
}

/* remove qualquer scrollbar WebKit herdada */
.cry-v127 .cry-history-v127::-webkit-scrollbar,
.cry-v127 .infinite-cry-history::-webkit-scrollbar,
.cry-v127 #cryInfiniteList::-webkit-scrollbar,
.cry-v127 .cry-list::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}

/* o bloqueio Premium não cria rolagem própria */
.cry-history-v127.cry-premium-locked{
  overflow:visible!important;
  max-height:none!important;
}

/* cards continuam dentro da largura sem gerar scroll horizontal */
.cry-v127 .cry-list > article{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}

.cry-v127 .cry-meta,
.cry-v127 .cry-result-actions{
  min-width:0!important;
  max-width:100%!important;
}

@media(max-width:820px){
  .cry-v127,
  .cry-v127 .cry-history-v127,
  .cry-v127 .infinite-cry-history,
  .cry-v127 #cryInfiniteList,
  .cry-v127 .cry-list{
    overflow:visible!important;
    max-height:none!important;
  }

  .cry-v127 .cry-list > article{
    overflow:hidden!important;
  }
}

/* =========================================================
   V130 — Sons para Dormir: player mobile + 10 min Premium
========================================================= */
.sound-page-v130{
  position:relative!important;
}

/* estado bloqueado */
.sound-page-v130.sound-premium-locked .sound-category,
.sound-page-v130.sound-premium-locked .spotify-grid,
.sound-page-v130.sound-premium-locked .sound-category-tabs,
.sound-page-v130.sound-premium-locked .sounds-player-inline-wrap{
  filter:blur(2.5px)!important;
  opacity:.48!important;
  pointer-events:none!important;
  user-select:none!important;
}

.sound-premium-overlay{
  position:absolute!important;
  inset:0!important;
  z-index:20!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
}

.sound-premium-cta{
  pointer-events:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:44px!important;
  padding:0 17px!important;
  border-radius:10px!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
  box-shadow:0 10px 28px rgba(34,42,51,.14)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px!important;
  font-weight:700!important;
}

.sound-premium-cta svg{
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* PLAYER MOBILE REAL — deixa de ser só o botão solto */
@media(max-width:820px){

  .sounds-player-inline-wrap{
    width:100%!important;
    margin:10px 0 14px!important;
  }

  .sounds-player-inline-wrap #soundPlayer{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
    min-height:0!important;
    padding:11px 12px!important;

    border:1px solid #e1e5e8!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:none!important;
  }

  .sounds-player-inline-wrap #soundPlayer.hidden{
    display:none!important;
  }

  .sounds-player-inline-wrap .player-main{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 40px!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
  }

  .sounds-player-inline-wrap .player-art,
  .sounds-player-inline-wrap .player-icon{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:9px!important;
    background:#f3f5f6!important;
    overflow:hidden!important;
  }

  .sounds-player-inline-wrap .player-copy{
    min-width:0!important;
    text-align:left!important;
  }

  .sounds-player-inline-wrap .player-copy small{
    display:block!important;
    margin-bottom:1px!important;
    color:#9aa1a9!important;
    font-size:8.5px!important;
    line-height:1.1!important;
  }

  .sounds-player-inline-wrap .player-copy b{
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    color:#1f2429!important;
    font-size:13px!important;
    line-height:1.2!important;
  }

  .sounds-player-inline-wrap .player-copy span{
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    margin-top:2px!important;
    color:#89919a!important;
    font-size:9.5px!important;
  }

  .sounds-player-inline-wrap .player-main > button,
  .sounds-player-inline-wrap .player-toggle{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  .sounds-player-inline-wrap .player-controls{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    padding:0!important;
    margin:0!important;
  }

  .sounds-player-inline-wrap .player-controls label{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    min-width:0!important;
    margin:0!important;
    font-size:9px!important;
    color:#8d949d!important;
  }

  .sounds-player-inline-wrap #volume{
    width:100%!important;
    min-width:70px!important;
    max-width:none!important;
  }

  .sounds-player-inline-wrap .timers{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    width:auto!important;
    max-width:150px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  .sounds-player-inline-wrap .timers::-webkit-scrollbar{
    display:none!important;
  }

  .sounds-player-inline-wrap .timers button{
    flex:0 0 auto!important;
    min-width:38px!important;
    height:28px!important;
    padding:0 7px!important;
    border:1px solid #e1e5e8!important;
    border-radius:8px!important;
    background:#fff!important;
    color:#676f78!important;
    font-size:8.5px!important;
  }

  .sound-premium-cta{
    min-height:42px!important;
    padding:0 15px!important;
    font-size:11.5px!important;
  }

  .sound-page-v130.sound-premium-locked .sound-category,
  .sound-page-v130.sound-premium-locked .spotify-grid,
  .sound-page-v130.sound-premium-locked .sound-category-tabs,
  .sound-page-v130.sound-premium-locked .sounds-player-inline-wrap{
    filter:blur(2px)!important;
  }
}

@media(max-width:430px){
  .sounds-player-inline-wrap .player-controls{
    grid-template-columns:1fr!important;
  }

  .sounds-player-inline-wrap .timers{
    max-width:100%!important;
    width:100%!important;
  }
}

/* =========================================================
   V131 — SONS: PLAYER REAL CORRIGIDO
   Seletores exatos + premium shell real
========================================================= */

.sounds-premium-shell{
  position:relative!important;
  width:100%!important;
}

/* Desktop player */
#soundPlayer.sound-player-v131{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  padding:12px 14px!important;
  margin:0!important;

  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:18px!important;

  border:1px solid #e1e5e8!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:none!important;

  position:static!important;
  overflow:visible!important;
}

#soundPlayer.sound-player-v131.hidden{
  display:none!important;
}

#soundPlayer.sound-player-v131 .sound-player-top{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 42px!important;
  align-items:center!important;
  gap:11px!important;
  min-width:0!important;
}

#soundPlayer.sound-player-v131 .player-cover{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  margin:0!important;

  display:grid!important;
  place-items:center!important;

  border-radius:10px!important;
  background:#f3f5f6!important;
  font-size:20px!important;
}

#soundPlayer.sound-player-v131 .player-copy{
  display:block!important;
  min-width:0!important;
  margin:0!important;
}

#soundPlayer.sound-player-v131 .player-copy small{
  display:block!important;
  margin:0 0 2px!important;
  color:#9aa1a9!important;
  font-size:8.5px!important;
  line-height:1.1!important;
}

#soundPlayer.sound-player-v131 .player-copy b{
  display:block!important;
  margin:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#1f2429!important;
  font-size:13px!important;
  line-height:1.2!important;
}

#soundPlayer.sound-player-v131 .player-copy span{
  display:block!important;
  margin-top:2px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#89919a!important;
  font-size:9.5px!important;
  line-height:1.2!important;
}

#soundPlayer.sound-player-v131 #playPause{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:0!important;

  display:grid!important;
  place-items:center!important;

  border:0!important;
  border-radius:50%!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
  color:#fff!important;
  box-shadow:none!important;

  font-size:13px!important;
}

#soundPlayer.sound-player-v131 .sound-player-controls-v131{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:14px!important;
  margin:0!important;
  min-width:0!important;
}

#soundPlayer.sound-player-v131 .sound-volume-label{
  width:230px!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  margin:0!important;
  color:#7d858e!important;
  font-size:9px!important;
  white-space:nowrap!important;
}

#soundPlayer.sound-player-v131 #volume{
  width:100%!important;
  min-width:100px!important;
  margin:0!important;
}

#soundPlayer.sound-player-v131 .sound-timers-v131{
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  margin:0!important;
}

#soundPlayer.sound-player-v131 .sound-timers-v131 button{
  min-width:44px!important;
  height:30px!important;
  margin:0!important;
  padding:0 8px!important;
  border:1px solid #e1e5e8!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#68717a!important;
  font-size:8.5px!important;
}

/* Premium pega player + filtros + cards */
.sounds-premium-shell.sound-premium-locked
.sounds-player-inline-wrap,
.sounds-premium-shell.sound-premium-locked
.sound-page{
  filter:blur(2.5px)!important;
  opacity:.45!important;
  pointer-events:none!important;
  user-select:none!important;
}

.sounds-premium-shell .sound-premium-overlay{
  position:absolute!important;
  inset:0!important;
  z-index:30!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
}

.sounds-premium-shell .sound-premium-cta{
  pointer-events:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-height:44px!important;
  padding:0 17px!important;
  border-radius:10px!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px!important;
  font-weight:700!important;
  box-shadow:0 10px 28px rgba(34,42,51,.14)!important;
}

.sounds-premium-shell .sound-premium-cta svg{
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* MOBILE — player de duas linhas, não apenas play */
@media(max-width:820px){

  .sounds-player-inline-wrap{
    width:100%!important;
    margin:10px 0 13px!important;
  }

  #soundPlayer.sound-player-v131{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;

    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:11px 12px!important;
    margin:0!important;

    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    top:auto!important;

    border-radius:14px!important;
    overflow:visible!important;
  }

  #soundPlayer.sound-player-v131.hidden{
    display:none!important;
  }

  #soundPlayer.sound-player-v131 .sound-player-top{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    align-items:center!important;
    gap:9px!important;
    width:100%!important;
  }

  #soundPlayer.sound-player-v131 .player-cover{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    font-size:18px!important;
  }

  #soundPlayer.sound-player-v131 .player-copy b{
    font-size:13px!important;
  }

  #soundPlayer.sound-player-v131 .player-copy span{
    font-size:9.5px!important;
  }

  #soundPlayer.sound-player-v131 #playPause{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
  }

  /* força controles aparecerem apesar da regra antiga .player-controls{display:none} */
  #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:10px!important;

    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }

  #soundPlayer.sound-player-v131 .sound-volume-label{
    display:grid!important;
    grid-template-columns:auto minmax(70px,1fr)!important;
    align-items:center!important;
    gap:7px!important;

    width:100%!important;
    min-width:0!important;
    margin:0!important;
    font-size:9px!important;
  }

  #soundPlayer.sound-player-v131 #volume{
    display:block!important;
    width:100%!important;
    min-width:70px!important;
    margin:0!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131{
    display:flex!important;
    gap:4px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131::-webkit-scrollbar{
    display:none!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    flex:0 0 auto!important;
    min-width:40px!important;
    height:28px!important;
    padding:0 6px!important;
    font-size:8px!important;
  }

  .sounds-premium-shell.sound-premium-locked
  .sounds-player-inline-wrap,
  .sounds-premium-shell.sound-premium-locked
  .sound-page{
    filter:blur(2px)!important;
  }
}

@media(max-width:430px){
  #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131{
    width:100%!important;
  }
}

/* =========================================================
   V132 — Sons mobile: categorias deslizáveis + timers clicáveis
========================================================= */

/* timers sempre clicáveis quando ainda liberado */
.sounds-premium-shell:not(.sound-premium-locked)
#soundPlayer [data-timer]{
  pointer-events:auto!important;
  cursor:pointer!important;
  position:relative!important;
  z-index:5!important;
}

#soundPlayer [data-timer].active{
  background:#eef7f9!important;
  border-color:#b9dce5!important;
  color:#39798a!important;
  font-weight:700!important;
}

/* categorias deslizam horizontalmente no mobile */
@media(max-width:820px){

  .sound-filter-tabs{
    display:flex!important;
    align-items:center!important;
    gap:14px!important;
    width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .sound-filter-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .sound-filter-tabs > *{
    flex:0 0 auto!important;
  }

  .sound-category-tabs{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;

    gap:17px!important;
    width:100%!important;
    max-width:100%!important;

    margin:8px 0 12px!important;
    padding:3px 2px 8px!important;

    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;

    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x proximity!important;
  }

  .sound-category-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .sound-category-tabs button{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:max-content!important;

    margin:0!important;
    padding:7px 2px!important;

    border:0!important;
    border-radius:0!important;
    background:transparent!important;

    color:#7d858e!important;
    font-size:12px!important;
    font-weight:600!important;
    line-height:1!important;

    scroll-snap-align:start!important;
  }

  .sound-category-tabs button.active{
    color:#20252b!important;
    font-weight:700!important;
    box-shadow:inset 0 -2px 0 #20252b!important;
  }

  /* timer ocupa espaço confortável e continua visível */
  #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    position:relative!important;
    z-index:4!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131{
    position:relative!important;
    z-index:6!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    pointer-events:auto!important;
    cursor:pointer!important;
    min-width:46px!important;
    height:30px!important;
    font-size:9px!important;
  }

  /* bloqueio premium fica limpo e não cria scroll interno */
  .sounds-premium-shell.sound-premium-locked{
    overflow:visible!important;
  }

  .sounds-premium-shell.sound-premium-locked
  .sounds-player-inline-wrap,
  .sounds-premium-shell.sound-premium-locked
  .sound-page{
    filter:blur(2px)!important;
    opacity:.46!important;
  }

  .sounds-premium-shell .sound-premium-overlay{
    position:absolute!important;
    inset:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
}


/* =========================================================
   V133 — Menu inferior mobile minimalista
   Sem fundo cinza no ativo + risco preto em cima
========================================================= */
@media(max-width:820px){

  .bottom-nav{
    background:rgba(255,255,255,.98)!important;
  }

  .bottom-nav > a{
    position:relative!important;
    background:transparent!important;
    color:#8a9199!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  .bottom-nav > a.active{
    background:transparent!important;
    color:#1d2228!important;
    font-weight:700!important;
  }

  /* remove qualquer fundo antigo do ativo */
  .bottom-nav > a.active,
  .bottom-nav > a:focus,
  .bottom-nav > a:active{
    background:transparent!important;
    box-shadow:none!important;
  }

  /* risco preto fino acima do item selecionado */
  .bottom-nav > a.active::before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:26px!important;
    height:2px!important;
    border-radius:999px!important;
    background:#171b20!important;
  }

  .bottom-nav > a span{
    color:inherit!important;
  }

  .bottom-nav > a svg{
    color:inherit!important;
    stroke:currentColor!important;
  }
}

@media(max-width:420px){
  .bottom-nav > a.active::before{
    width:24px!important;
  }
}

/* =========================================================
   V134 — Diário do Sono: excluir registro circular
========================================================= */
.diary-history .delete,
.diary-history .remove,
.diary-history .delete-btn,
.diary-history .remove-btn,
.diary-history .sleep-delete,
.diary-history .diary-delete,
.diary-list .delete,
.diary-list .remove,
.diary-list .delete-btn,
.diary-list .remove-btn,
.diary-list .sleep-delete,
.diary-list .diary-delete,
.sleep-history .delete,
.sleep-history .remove,
.sleep-history .delete-btn,
.sleep-history .remove-btn,
.sleep-history .sleep-delete,
.sleep-history .diary-delete,
[data-delete-sleep],
[data-remove-sleep]{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  max-width:30px!important;
  padding:0!important;
  display:inline-grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:50%!important;
  background:#f3f5f6!important;
  color:#7f8790!important;
  box-shadow:none!important;
  line-height:1!important;
}

@media(max-width:820px){
  .diary-history .delete,
  .diary-history .remove,
  .diary-history .delete-btn,
  .diary-history .remove-btn,
  .diary-history .sleep-delete,
  .diary-history .diary-delete,
  .diary-list .delete,
  .diary-list .remove,
  .diary-list .delete-btn,
  .diary-list .remove-btn,
  .diary-list .sleep-delete,
  .diary-list .diary-delete,
  .sleep-history .delete,
  .sleep-history .remove,
  .sleep-history .delete-btn,
  .sleep-history .remove-btn,
  .sleep-history .sleep-delete,
  .sleep-history .diary-delete,
  [data-delete-sleep],
  [data-remove-sleep]{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    border-radius:50%!important;
  }
}

.delete{border-radius:50%!important;}

/* =========================================================
   V139 — Perfil / Assinatura Premium
========================================================= */
.profile-subscription-v139{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:22px!important;
  padding:22px!important;
}

.profile-subscription-copy{
  min-width:0!important;
}

.profile-subscription-copy h2{
  margin:3px 0 8px!important;
}

.profile-subscription-copy small{
  display:block!important;
  margin-top:5px!important;
  color:#9098a1!important;
  font-size:10.5px!important;
  line-height:1.45!important;
}

.profile-subscription-status{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  margin:0!important;
  font-size:12px!important;
  font-weight:650!important;
}

.profile-subscription-status.is-premium{
  color:#31734a!important;
}

.profile-subscription-status.is-premium > span{
  width:8px!important;
  height:8px!important;
  min-width:8px!important;
  border-radius:50%!important;
  background:#39b76b!important;
}

.profile-subscription-status.is-free{
  color:#747c85!important;
}

.profile-subscription-actions{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
}

.profile-premium-subscribe{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  padding:0 17px!important;
  border-radius:10px!important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:11.5px!important;
  font-weight:700!important;
  box-shadow:0 8px 22px rgba(34,42,51,.10)!important;
}

.profile-premium-cancel-form{
  margin:0!important;
}

.profile-premium-cancel{
  min-height:40px!important;
  padding:0 14px!important;
  border:1px solid #e1e5e8!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#6e7680!important;
  font-size:11px!important;
  font-weight:650!important;
  cursor:pointer!important;
}

.profile-premium-cancel:hover{
  border-color:#e1bec9!important;
  color:#b25472!important;
  background:#fffafb!important;
}

.profile-premium-manage{
  display:inline-flex!important;
  align-items:center!important;
  min-height:40px!important;
  padding:0 14px!important;
  border:1px solid #e1e5e8!important;
  border-radius:10px!important;
  color:#555d66!important;
  text-decoration:none!important;
  font-size:11px!important;
  font-weight:650!important;
}

@media(max-width:820px){
  .profile-subscription-v139{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:15px!important;
    padding:17px!important;
  }

  .profile-subscription-copy h2{
    font-size:20px!important;
  }

  .profile-subscription-status{
    font-size:13px!important;
  }

  .profile-subscription-copy small{
    font-size:11.5px!important;
  }

  .profile-subscription-actions{
    width:100%!important;
    justify-content:flex-start!important;
  }

  .profile-premium-subscribe,
  .profile-premium-cancel,
  .profile-premium-manage,
  .profile-premium-cancel-form{
    width:100%!important;
  }

  .profile-premium-subscribe,
  .profile-premium-cancel,
  .profile-premium-manage{
    min-height:44px!important;
    justify-content:center!important;
    font-size:12px!important;
  }
}

/* =========================================================
   V140 — NanaBot: aviso + pensando organizados
========================================================= */

/* Desktop: mantém natural e discreto */
@media(min-width:821px){
  .nanabot-chat-disclaimer-v140{
    display:block!important;
    margin:6px 0 0!important;
    color:#949ba4!important;
    font-size:9.5px!important;
    line-height:1.35!important;
    text-align:left!important;
  }

  .nanabot-thinking-v140{
    margin:0 0 5px!important;
    color:#727a84!important;
    font-size:10.5px!important;
    line-height:1.2!important;
    text-align:left!important;
  }
}

/* MOBILE */
@media(max-width:820px){

  /* conjunto do rodapé continua logo acima do menu inferior */
  .chat-composer-wrap{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:90px!important;
    z-index:220!important;

    display:flex!important;
    flex-direction:column!important;
    gap:4px!important;

    width:auto!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  /* Pensando fica bem perto da caixa e não cria buraco */
  .chat-composer-wrap .nanabot-thinking-v140,
  .chat-composer-wrap .nanabot-thinking{
    position:static!important;
    inset:auto!important;

    display:block!important;
    width:auto!important;
    margin:0 0 1px 6px!important;
    padding:0!important;

    background:transparent!important;
    color:#6d7580!important;

    font-size:10.5px!important;
    line-height:1.15!important;
    text-align:left!important;

    pointer-events:none!important;
  }

  /* aviso imediatamente acima da caixa de pergunta */
  .chat-composer-wrap .nanabot-chat-disclaimer-v140,
  .chat-composer-wrap .nanabot-mobile-disclaimer{
    position:static!important;
    inset:auto!important;

    display:block!important;
    width:100%!important;
    margin:0 0 2px!important;
    padding:0 6px!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    color:#989fa7!important;
    font-size:9.5px!important;
    line-height:1.25!important;
    text-align:left!important;

    pointer-events:none!important;
  }

  /* caixa propriamente dita */
  .chat-composer-wrap .chat-composer{
    position:static!important;
    inset:auto!important;

    width:100%!important;
    min-height:52px!important;
    margin:0!important;
    padding:6px!important;

    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    border:1px solid #dfe4e8!important;
    border-radius:15px!important;
    background:#fff!important;
    box-shadow:0 8px 24px rgba(28,34,42,.09)!important;
  }

  .chat-composer-wrap .chat-composer input,
  .chat-composer-wrap .chat-composer textarea{
    min-width:0!important;
    width:100%!important;
    min-height:40px!important;
    max-height:104px!important;
    margin:0!important;
    padding:0 8px!important;

    border:0!important;
    outline:0!important;
    background:transparent!important;

    font-size:14px!important;
  }

  .chat-composer-wrap .chat-composer button{
    min-width:68px!important;
    height:40px!important;
    margin:0!important;
    padding:0 13px!important;
    border-radius:11px!important;
    font-size:11px!important;
    font-weight:650!important;
  }

  /* neutraliza posicionamentos antigos individuais */
  .nanabot-thinking-v140,
  .nanabot-thinking,
  .nanabot-chat-disclaimer-v140,
  .nanabot-mobile-disclaimer,
  .nanabot-input,
  .chat-input,
  .nanabot-composer,
  .nanabot-input-wrap{
    position:static!important;
    inset:auto!important;
  }

  /* reserva só o espaço necessário, sem scroll enorme */
  .nanabot-messages,
  .chat-messages{
    margin-bottom:132px!important;
    padding-bottom:0!important;
  }

  body:has(.chat-composer-wrap) .main{
    padding-bottom:94px!important;
  }
}

@media(max-width:430px){
  .chat-composer-wrap{
    left:8px!important;
    right:8px!important;
    bottom:88px!important;
  }

  .chat-composer-wrap .nanabot-thinking-v140,
  .chat-composer-wrap .nanabot-thinking{
    margin-left:5px!important;
    font-size:10px!important;
  }

  .chat-composer-wrap .nanabot-chat-disclaimer-v140,
  .chat-composer-wrap .nanabot-mobile-disclaimer{
    padding-left:5px!important;
    font-size:9px!important;
  }
}

/* =========================================================
   V141 — NanaBot: aviso em cima do chat + Pensando no fluxo
========================================================= */
.nanabot-thinking-row{
  width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}

.nanabot-thinking-v141{
  display:none!important;
  align-items:center!important;
  gap:7px!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 0 7px 4px!important;
  padding:7px 10px!important;
  border-radius:10px!important;
  background:#f5f7f8!important;
  color:#6f7781!important;
  font-size:10.5px!important;
  line-height:1.15!important;
  font-weight:550!important;
}

.nanabot-thinking-v141.show{
  display:inline-flex!important;
}

.nanabot-thinking-dot{
  width:7px!important;
  height:7px!important;
  min-width:7px!important;
  border-radius:50%!important;
  background:#6DB2C8!important;
  opacity:.85!important;
}

.chat-composer-wrap-v141{
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
}

.nanabot-chat-disclaimer-v141{
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:0 5px!important;
  color:#9299a2!important;
  font-size:9.5px!important;
  line-height:1.25!important;
  text-align:left!important;
}

@media(min-width:821px){
  .nanabot-thinking-row{margin-top:6px!important}
  .chat-composer-wrap-v141{position:static!important;inset:auto!important}
}

@media(max-width:820px){
  .nanabot-thinking-row{
    position:fixed!important;
    left:14px!important;
    right:14px!important;
    bottom:164px!important;
    z-index:219!important;
    width:auto!important;
    pointer-events:none!important;
  }

  .nanabot-thinking-v141{
    margin:0!important;
    padding:6px 9px!important;
    border-radius:9px!important;
    background:rgba(245,247,248,.98)!important;
    box-shadow:0 4px 14px rgba(30,36,44,.05)!important;
    font-size:10px!important;
  }

  .chat-composer-wrap-v141{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:90px!important;
    z-index:220!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    gap:5px!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .nanabot-chat-disclaimer-v141{
    position:static!important;
    inset:auto!important;
    margin:0!important;
    padding:0 5px!important;
    font-size:9px!important;
    text-align:left!important;
  }

  .chat-composer-wrap-v141 .chat-composer{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    margin:0!important;
  }

  .chat-stream{
    margin-bottom:122px!important;
    padding-bottom:0!important;
  }
}

@media(max-width:430px){
  .nanabot-thinking-row{
    left:12px!important;
    right:12px!important;
    bottom:161px!important;
  }

  .chat-composer-wrap-v141{
    left:8px!important;
    right:8px!important;
    bottom:88px!important;
  }
}

/* =========================================================
   V142 — NanaBot mobile
   Pensando à esquerda + aviso à direita na mesma linha
   Margens do campo corrigidas
========================================================= */

@media(max-width:820px){

  .chat-composer-wrap-v142{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:90px!important;
    z-index:220!important;

    display:flex!important;
    flex-direction:column!important;
    gap:6px!important;

    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  /* uma única linha de status */
  .nanabot-composer-meta{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
    gap:10px!important;

    width:100%!important;
    min-height:18px!important;
    padding:0 4px!important;
    margin:0!important;
  }

  .nanabot-thinking-v142{
    position:static!important;
    inset:auto!important;

    display:none!important;
    align-items:center!important;
    gap:6px!important;

    width:auto!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    box-shadow:none!important;
    border:0!important;

    color:#717984!important;
    font-size:10px!important;
    line-height:1.15!important;
    font-weight:550!important;

    white-space:nowrap!important;
    pointer-events:none!important;
  }

  .nanabot-thinking-v142.show{
    display:inline-flex!important;
  }

  .nanabot-thinking-v142 .nanabot-thinking-dot{
    width:7px!important;
    height:7px!important;
    min-width:7px!important;
    border-radius:50%!important;
    background:#6DB2C8!important;
  }

  .nanabot-chat-disclaimer-v142{
    position:static!important;
    inset:auto!important;

    display:block!important;
    min-width:0!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;

    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;

    color:#a0a6ad!important;
    font-size:8.5px!important;
    line-height:1.15!important;
    text-align:right!important;

    pointer-events:none!important;
  }

  /* caixa de pergunta com margens realmente simétricas */
  .chat-composer-wrap-v142 .chat-composer{
    position:static!important;
    inset:auto!important;

    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    width:100%!important;
    max-width:100%!important;
    min-height:52px!important;

    margin:0!important;
    padding:6px!important;

    box-sizing:border-box!important;
    border:1px solid #dfe4e8!important;
    border-radius:15px!important;
    background:#fff!important;
    box-shadow:0 8px 24px rgba(28,34,42,.08)!important;
  }

  .chat-composer-wrap-v142 .chat-composer input{
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    margin:0!important;
    padding:0 8px!important;

    border:0!important;
    outline:0!important;
    background:transparent!important;

    font-size:14px!important;
    box-sizing:border-box!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    min-width:68px!important;
    height:40px!important;
    margin:0!important;
    padding:0 13px!important;

    border:0!important;
    border-radius:11px!important;

    font-size:11px!important;
    font-weight:650!important;
  }

  /* neutraliza estruturas antigas */
  .nanabot-thinking-row{
    display:none!important;
  }

  .chat-composer-wrap-v141{
    position:static!important;
  }

  .chat-stream{
    margin-bottom:118px!important;
    padding-bottom:0!important;
  }
}

@media(max-width:430px){
  .chat-composer-wrap-v142{
    left:10px!important;
    right:10px!important;
    bottom:88px!important;
  }

  .nanabot-composer-meta{
    gap:8px!important;
    padding:0 3px!important;
  }

  .nanabot-thinking-v142{
    font-size:9.5px!important;
  }

  .nanabot-chat-disclaimer-v142{
    font-size:8px!important;
  }

  .chat-composer-wrap-v142 .chat-composer input{
    font-size:13.5px!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    min-width:64px!important;
    padding:0 11px!important;
  }
}

/* =========================================================
   V143 — NanaBot refinamento final desktop + mobile
========================================================= */

/* Nunca mostrar Pensando quando não estiver ativo */
#nanabotThinking[hidden]{
  display:none!important;
}

/* Desktop: volta para fluxo normal e limpo */
@media(min-width:821px){
  .chat-composer-wrap-v142{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:6px!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .nanabot-composer-meta{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:20px!important;
    width:100%!important;
    min-height:16px!important;
    margin:0!important;
    padding:0 8px!important;
  }

  .nanabot-thinking-v142{
    position:static!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    box-shadow:none!important;
    font-size:10px!important;
  }

  .nanabot-thinking-v142.show:not([hidden]){
    display:inline-flex!important;
  }

  .nanabot-chat-disclaimer-v142{
    position:static!important;
    margin:0 0 0 auto!important;
    padding:0!important;
    width:auto!important;
    max-width:70%!important;
    text-align:right!important;
    color:#9aa1a9!important;
    font-size:9px!important;
    white-space:nowrap!important;
  }

  .chat-composer-wrap-v142 .chat-composer{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
}

/* Mobile */
@media(max-width:820px){
  .chat-composer-wrap-v142{
    left:12px!important;
    right:12px!important;
    width:auto!important;
    max-width:none!important;
    box-sizing:border-box!important;
  }

  .nanabot-composer-meta{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:16px!important;
    padding:0 10px!important;
    box-sizing:border-box!important;
  }

  .nanabot-thinking-v142{
    flex:0 0 auto!important;
  }

  .nanabot-thinking-v142.show:not([hidden]){
    display:inline-flex!important;
  }

  /* Aviso mais para a direita */
  .nanabot-chat-disclaimer-v142{
    flex:1 1 auto!important;
    width:auto!important;
    margin-left:18px!important;
    padding:0!important;
    text-align:right!important;
  }

  /* Corrige a margem interna do botão Enviar */
  .chat-composer-wrap-v142 .chat-composer{
    width:100%!important;
    max-width:100%!important;
    min-height:54px!important;
    margin:0!important;
    padding:6px 8px 6px 10px!important;
    box-sizing:border-box!important;

    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    overflow:hidden!important;
    border-radius:15px!important;
  }

  .chat-composer-wrap-v142 .chat-composer input{
    min-width:0!important;
    width:100%!important;
    box-sizing:border-box!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    position:static!important;
    inset:auto!important;
    flex:none!important;

    width:auto!important;
    min-width:68px!important;
    max-width:none!important;
    height:40px!important;

    margin:0!important;
    padding:0 14px!important;
    box-sizing:border-box!important;

    border-radius:11px!important;
    transform:none!important;
  }
}

@media(max-width:430px){
  .chat-composer-wrap-v142{
    left:10px!important;
    right:10px!important;
  }

  .nanabot-composer-meta{
    padding:0 8px!important;
  }

  .nanabot-chat-disclaimer-v142{
    margin-left:14px!important;
  }

  .chat-composer-wrap-v142 .chat-composer{
    padding-right:7px!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    min-width:66px!important;
    padding:0 12px!important;
  }
}

/* =========================================================
   V144 — NanaBot final: desktop + mobile
========================================================= */

/* Estado base: Pensando nunca ocupa espaço quando inativo */
#nanabotThinking{
  display:none!important;
}
#nanabotThinking.show:not([hidden]){
  display:inline-flex!important;
}

/* ---------- DESKTOP ---------- */
@media(min-width:821px){
  .chat-composer-wrap-v142{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:6px!important;
    box-sizing:border-box!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .nanabot-composer-meta{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:100%!important;
    min-height:14px!important;
    margin:0!important;
    padding:0 8px!important;
    box-sizing:border-box!important;
  }

  #nanabotThinking.show:not([hidden]){
    margin-right:auto!important;
    align-items:center!important;
    gap:6px!important;
    padding:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#747c85!important;
    font-size:10px!important;
    white-space:nowrap!important;
  }

  .nanabot-chat-disclaimer-v142{
    position:static!important;
    inset:auto!important;
    width:auto!important;
    max-width:none!important;
    margin:0 0 0 auto!important;
    padding:0!important;
    color:#9da4ac!important;
    font-size:9px!important;
    line-height:1.2!important;
    text-align:right!important;
    white-space:nowrap!important;
  }

  .chat-composer-wrap-v142 .chat-composer{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    min-height:54px!important;
    margin:0!important;
    padding:6px 8px 6px 12px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    border-radius:15px!important;
  }

  .chat-composer-wrap-v142 .chat-composer input{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 8px!important;
    box-sizing:border-box!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    position:static!important;
    inset:auto!important;
    min-width:70px!important;
    height:40px!important;
    margin:0!important;
    padding:0 14px!important;
    transform:none!important;
    border-radius:11px!important;
    box-sizing:border-box!important;
  }
}

/* ---------- MOBILE ---------- */
@media(max-width:820px){
  .chat-composer-wrap-v142{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:90px!important;
    z-index:220!important;

    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;

    display:flex!important;
    flex-direction:column!important;
    gap:6px!important;

    box-sizing:border-box!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  /* linha acima do campo */
  .nanabot-composer-meta{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;

    width:100%!important;
    min-height:14px!important;
    margin:0!important;
    padding:0 8px!important;
    box-sizing:border-box!important;
  }

  /* Pensando só aparece durante resposta e fica à esquerda */
  #nanabotThinking.show:not([hidden]){
    margin:0 auto 0 0!important;
    padding:0!important;
    align-items:center!important;
    gap:5px!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    color:#737b84!important;
    font-size:9.5px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }

  #nanabotThinking .nanabot-thinking-dot{
    width:6px!important;
    height:6px!important;
    min-width:6px!important;
  }

  /* aviso encostado visualmente à direita */
  .nanabot-chat-disclaimer-v142{
    position:static!important;
    inset:auto!important;
    flex:0 1 auto!important;
    width:auto!important;
    max-width:72%!important;

    margin:0 0 0 18px!important;
    padding:0!important;

    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;

    color:#a0a6ad!important;
    font-size:8.2px!important;
    line-height:1.1!important;
    text-align:right!important;
  }

  /* campo perfeitamente dentro das margens */
  .chat-composer-wrap-v142 .chat-composer{
    position:static!important;
    inset:auto!important;

    width:100%!important;
    max-width:100%!important;
    min-height:54px!important;

    margin:0!important;
    padding:6px 8px 6px 10px!important;

    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    box-sizing:border-box!important;
    overflow:hidden!important;

    border:1px solid #dfe4e8!important;
    border-radius:15px!important;
    background:#fff!important;
    box-shadow:0 6px 20px rgba(28,34,42,.07)!important;
  }

  .chat-composer-wrap-v142 .chat-composer input{
    width:100%!important;
    min-width:0!important;
    height:40px!important;

    margin:0!important;
    padding:0 7px!important;

    box-sizing:border-box!important;
    border:0!important;
    outline:0!important;
    background:transparent!important;

    font-size:14px!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    position:static!important;
    inset:auto!important;

    width:auto!important;
    min-width:68px!important;
    max-width:none!important;
    height:40px!important;

    margin:0!important;
    padding:0 13px!important;

    box-sizing:border-box!important;
    transform:none!important;

    border:0!important;
    border-radius:11px!important;
    font-size:11px!important;
  }

  .chat-stream{
    margin-bottom:116px!important;
    padding-bottom:0!important;
  }
}

@media(max-width:430px){
  .chat-composer-wrap-v142{
    left:10px!important;
    right:10px!important;
    bottom:88px!important;
  }

  .nanabot-composer-meta{
    padding-left:7px!important;
    padding-right:7px!important;
  }

  .nanabot-chat-disclaimer-v142{
    max-width:74%!important;
    margin-left:12px!important;
    font-size:7.8px!important;
  }

  .chat-composer-wrap-v142 .chat-composer{
    padding-right:7px!important;
  }

  .chat-composer-wrap-v142 .chat-composer button{
    min-width:66px!important;
    padding:0 12px!important;
  }
}

/* =========================================================
   V146 — Mobile: Pensando esquerda / aviso na lateral direita
========================================================= */
@media(max-width:820px){
  .nanabot-composer-meta{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    padding:0 8px!important;
    box-sizing:border-box!important;
  }

  #nanabotThinking.show:not([hidden]){
    flex:0 0 auto!important;
    margin:0!important;
    text-align:left!important;
  }

  .nanabot-chat-disclaimer-v142{
    flex:1 1 auto!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    text-align:right!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    font-size:8.2px!important;
  }
}

@media(max-width:430px){
  .nanabot-composer-meta{
    padding-left:7px!important;
    padding-right:7px!important;
    gap:8px!important;
  }

  .nanabot-chat-disclaimer-v142{
    font-size:7.8px!important;
  }
}

/* =========================================================
   V147 — NanaBot mobile: margens externas iguais
========================================================= */
@media(max-width:820px){
  .chat-composer-wrap-v142{
    left:14px!important;
    right:14px!important;
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
    box-sizing:border-box!important;
  }

  .chat-composer-wrap-v142 .chat-composer{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:10px!important;
    padding-right:8px!important;
    box-sizing:border-box!important;
  }
}

@media(max-width:430px){
  .chat-composer-wrap-v142{
    left:12px!important;
    right:12px!important;
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }
}

/* =========================================================
   V148 — NanaBot: correção REAL da margem direita no mobile
========================================================= */
@media(max-width:820px){
  .chat-composer-wrap.chat-composer-wrap-v142{
    position:fixed!important;

    left:24px!important;
    right:24px!important;
    bottom:90px!important;

    width:auto!important;
    max-width:none!important;
    min-width:0!important;

    margin:0!important;
    padding:0!important;

    box-sizing:border-box!important;
    transform:none!important;
  }

  .chat-composer-wrap.chat-composer-wrap-v142 .chat-composer{
    position:relative!important;
    left:auto!important;
    right:auto!important;

    width:100%!important;
    max-width:100%!important;
    min-width:0!important;

    margin:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  .chat-composer-wrap.chat-composer-wrap-v142 .chat-composer button{
    position:static!important;
    right:auto!important;
    margin:0!important;
    transform:none!important;
  }

  .chat-composer-wrap.chat-composer-wrap-v142 .nanabot-composer-meta{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
}

@media(max-width:430px){
  .chat-composer-wrap.chat-composer-wrap-v142{
    left:20px!important;
    right:20px!important;
    width:auto!important;
    max-width:none!important;
  }
}

/* V149 — nova identidade visual DormeBaby */
.brand img,
.mobile-head-logo img,
.auth-v72-brand img{
  object-fit:contain!important;
  image-rendering:auto!important;
}

.auth-v72-brand img{
  width:86px!important;
  height:86px!important;
}

@media(max-width:820px){
  .mobile-head-logo img{
    object-fit:contain!important;
  }
}

/* =========================================================
   V151 — SOMENTE TELAS DE AUTENTICAÇÃO NO MOBILE
   Não altera Resumo, NanaBot, Diário, Plano, Choro, Sons ou Perfil.
========================================================= */

@media(max-width:820px){

  /* Logo maior somente nas telas de autenticação */
  body.auth-body .auth-v72-brand,
  .auth-v72-brand{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 0 18px!important;
    min-height:110px!important;
  }

  body.auth-body .auth-v72-brand img,
  .auth-v72-brand img{
    width:110px!important;
    height:110px!important;
    max-width:110px!important;
    max-height:110px!important;
    object-fit:contain!important;
    image-rendering:auto!important;
  }

  /* Margens laterais somente do lado do formulário */
  .auth-v72-right,
  .auth-v72-form-side,
  .auth-form-side,
  .auth-content{
    padding-left:22px!important;
    padding-right:22px!important;
    box-sizing:border-box!important;
  }

  /* Título e textos */
  .auth-v72 h1{
    font-size:29px!important;
    line-height:1.08!important;
    letter-spacing:-.03em!important;
  }

  .auth-v72 h2{
    font-size:21px!important;
  }

  .auth-v72 p{
    font-size:14px!important;
    line-height:1.5!important;
  }

  .auth-v72 .eyebrow,
  .auth-v72-kicker{
    font-size:10px!important;
  }

  /* Labels e campos */
  .auth-v72 label{
    font-size:12px!important;
  }

  .auth-v72 input,
  .auth-v72 select{
    min-height:52px!important;
    padding-left:14px!important;
    padding-right:14px!important;
    border-radius:12px!important;
    font-size:15px!important;
    box-sizing:border-box!important;
  }

  .auth-v72 input::placeholder{
    font-size:14px!important;
  }

  /* Botões */
  .auth-v72 button[type="submit"],
  .auth-v72 .gradient-btn{
    min-height:50px!important;
    border-radius:12px!important;
    font-size:13px!important;
    font-weight:700!important;
  }

  /* Links: criar conta, esqueci senha, reenviar etc. */
  .auth-v72 a{
    font-size:12.5px!important;
  }

  .auth-v72-footer,
  .auth-v72-switch,
  .auth-v72-bottom{
    font-size:12.5px!important;
    line-height:1.45!important;
  }

  /* Código */
  .verify-code,
  .code-input,
  .otp-input,
  .auth-code{
    min-height:56px!important;
    font-size:20px!important;
    letter-spacing:.30em!important;
    text-align:center!important;
  }
}

@media(max-width:430px){
  .auth-v72-right,
  .auth-v72-form-side,
  .auth-form-side,
  .auth-content{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  .auth-v72-brand{
    min-height:100px!important;
    margin-bottom:15px!important;
  }

  .auth-v72-brand img{
    width:98px!important;
    height:98px!important;
    max-width:98px!important;
    max-height:98px!important;
  }

  .auth-v72 h1{
    font-size:27px!important;
  }

  .auth-v72 p{
    font-size:13.5px!important;
  }

  .auth-v72 input,
  .auth-v72 select{
    min-height:50px!important;
    font-size:14.5px!important;
  }
}

/* =========================================================
   V152 — SOMENTE Login + Esqueci a senha: logo maior
========================================================= */
.auth-login-v152 .auth-v72-brand img,
.auth-forgot-v152 .auth-v72-brand img{
  width:142px!important;
  height:142px!important;
  max-width:142px!important;
  max-height:142px!important;
}

.auth-login-v152 .auth-v72-brand,
.auth-forgot-v152 .auth-v72-brand{
  min-height:146px!important;
  margin-bottom:18px!important;
}

@media(max-width:820px){
  .auth-login-v152 .auth-v72-brand img,
  .auth-forgot-v152 .auth-v72-brand img{
    width:138px!important;
    height:138px!important;
    max-width:138px!important;
    max-height:138px!important;
  }

  .auth-login-v152 .auth-v72-brand,
  .auth-forgot-v152 .auth-v72-brand{
    min-height:142px!important;
    margin-bottom:16px!important;
  }
}

@media(max-width:430px){
  .auth-login-v152 .auth-v72-brand img,
  .auth-forgot-v152 .auth-v72-brand img{
    width:128px!important;
    height:128px!important;
    max-width:128px!important;
    max-height:128px!important;
  }

  .auth-login-v152 .auth-v72-brand,
  .auth-forgot-v152 .auth-v72-brand{
    min-height:132px!important;
    margin-bottom:14px!important;
  }
}

/* =========================================================
   V153 — Login minimalista
   Logo equilibrada + cabeçalho centralizado no desktop
========================================================= */

/* reduz a logo exagerada da V152 */
.auth-login-v152 .auth-v72-brand img,
.auth-forgot-v152 .auth-v72-brand img{
  width:108px!important;
  height:108px!important;
  max-width:108px!important;
  max-height:108px!important;
}

.auth-login-v152 .auth-v72-brand,
.auth-forgot-v152 .auth-v72-brand{
  min-height:110px!important;
  margin-bottom:12px!important;
}

/* LOGIN DESKTOP: centraliza somente o cabeçalho */
@media(min-width:821px){
  .auth-login-v152 .auth-v72-brand{
    justify-content:center!important;
  }

  .auth-login-v152 .auth-v72-kicker,
  .auth-login-v152 .auth-v72 .eyebrow,
  .auth-login-v152 h1,
  .auth-login-v152 .auth-v72-subtitle,
  .auth-login-v152 .auth-subtitle{
    text-align:center!important;
  }

  /* cobre o bloco introdutório sem centralizar formulário/labels */
  .auth-login-v152 .auth-v72-head,
  .auth-login-v152 .auth-v72-header,
  .auth-login-v152 .auth-header{
    text-align:center!important;
  }

  .auth-login-v152 .auth-v72-head p,
  .auth-login-v152 .auth-v72-header p,
  .auth-login-v152 .auth-header p{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media(max-width:820px){
  .auth-login-v152 .auth-v72-brand img,
  .auth-forgot-v152 .auth-v72-brand img{
    width:104px!important;
    height:104px!important;
    max-width:104px!important;
    max-height:104px!important;
  }

  .auth-login-v152 .auth-v72-brand,
  .auth-forgot-v152 .auth-v72-brand{
    min-height:106px!important;
    margin-bottom:11px!important;
  }
}

@media(max-width:430px){
  .auth-login-v152 .auth-v72-brand img,
  .auth-forgot-v152 .auth-v72-brand img{
    width:98px!important;
    height:98px!important;
    max-width:98px!important;
    max-height:98px!important;
  }

  .auth-login-v152 .auth-v72-brand,
  .auth-forgot-v152 .auth-v72-brand{
    min-height:100px!important;
    margin-bottom:10px!important;
  }
}

/* V154 - login logo compacta */
.auth-login-v152 .auth-v72-brand{min-height:78px!important;margin-bottom:8px!important}
.auth-login-v152 .auth-v72-brand img{width:76px!important;height:76px!important;max-width:76px!important;max-height:76px!important}
@media(min-width:821px){
.auth-login-v152 .auth-v72-brand{min-height:82px!important;margin-bottom:9px!important}
.auth-login-v152 .auth-v72-brand img{width:80px!important;height:80px!important;max-width:80px!important;max-height:80px!important}
}
@media(max-width:430px){
.auth-login-v152 .auth-v72-brand{min-height:74px!important;margin-bottom:7px!important}
.auth-login-v152 .auth-v72-brand img{width:72px!important;height:72px!important;max-width:72px!important;max-height:72px!important}
}

/* V155 - tamanho exato solicitado para logo do Login */
.auth-login-v152 .auth-v72-brand{
  min-height:47px!important;
  margin-bottom:7px!important;
}
.auth-login-v152 .auth-v72-brand img{
  width:45px!important;
  height:45px!important;
  max-width:45px!important;
  max-height:45px!important;
}

@media(max-width:820px){
  .auth-login-v152 .auth-v72-brand{
    min-height:42px!important;
    margin-bottom:7px!important;
  }
  .auth-login-v152 .auth-v72-brand img{
    width:40px!important;
    height:40px!important;
    max-width:40px!important;
    max-height:40px!important;
  }
}

@media(max-width:430px){
  .auth-login-v152 .auth-v72-brand{
    min-height:42px!important;
    margin-bottom:7px!important;
  }
  .auth-login-v152 .auth-v72-brand img{
    width:40px!important;
    height:40px!important;
    max-width:40px!important;
    max-height:40px!important;
  }
}

/* =========================================================
   V158 — PADRÃO VISUAL DE AUTENTICAÇÃO
   Somente Login / Registro / Recuperação / Código / Onboarding
========================================================= */

/* ---------- LOGO PADRONIZADA ---------- */
.auth-login-v158 .auth-v72-brand,
.auth-register-v158 .auth-v72-brand,
.auth-forgot-v158 .auth-v72-brand,
.auth-reset-v158 .auth-v72-brand,
.auth-verify-v158 .auth-v72-brand,
.auth-onboarding-v158 .auth-v72-brand{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:57px!important;
  margin:0 0 14px!important;
  padding:0!important;
}

.auth-login-v158 .auth-v72-brand img,
.auth-register-v158 .auth-v72-brand img,
.auth-forgot-v158 .auth-v72-brand img,
.auth-reset-v158 .auth-v72-brand img,
.auth-verify-v158 .auth-v72-brand img,
.auth-onboarding-v158 .auth-v72-brand img{
  display:block!important;
  width:55px!important;
  height:55px!important;
  min-width:55px!important;
  min-height:55px!important;
  max-width:55px!important;
  max-height:55px!important;
  margin:0 auto!important;
  padding:0!important;
  object-fit:contain!important;
  image-rendering:auto!important;
}

/* ---------- HIERARQUIA TIPOGRÁFICA DESKTOP ---------- */

/* kicker / eyebrow */
.auth-login-v158 .auth-kicker,
.auth-register-v158 .auth-kicker,
.auth-forgot-v158 .auth-kicker,
.auth-reset-v158 .auth-kicker,
.auth-verify-v158 .auth-kicker,
.auth-onboarding-v158 .auth-kicker,
.auth-login-v158 .eyebrow,
.auth-register-v158 .eyebrow,
.auth-forgot-v158 .eyebrow,
.auth-reset-v158 .eyebrow,
.auth-verify-v158 .eyebrow,
.auth-onboarding-v158 .eyebrow{
  font-size:10px!important;
  line-height:1.2!important;
  font-weight:650!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
  color:#8d96a0!important;
}

/* títulos principais */
.auth-login-v158 h1,
.auth-register-v158 h1,
.auth-forgot-v158 h1,
.auth-reset-v158 h1,
.auth-verify-v158 h1,
.auth-onboarding-v158 h1{
  margin-top:6px!important;
  margin-bottom:10px!important;
  font-size:29px!important;
  line-height:1.08!important;
  font-weight:720!important;
  letter-spacing:-.035em!important;
  color:#1d2228!important;
}

/* descrições */
.auth-login-v158 .auth-sub,
.auth-register-v158 .auth-sub,
.auth-forgot-v158 .auth-sub,
.auth-reset-v158 .auth-sub,
.auth-verify-v158 .auth-sub,
.auth-onboarding-v158 .auth-sub,
.auth-login-v158 p,
.auth-register-v158 p,
.auth-forgot-v158 p,
.auth-reset-v158 p,
.auth-verify-v158 p,
.auth-onboarding-v158 p{
  font-size:13px!important;
  line-height:1.55!important;
  font-weight:400!important;
  color:#7f8791!important;
}

/* labels */
.auth-login-v158 label,
.auth-register-v158 label,
.auth-forgot-v158 label,
.auth-reset-v158 label,
.auth-verify-v158 label,
.auth-onboarding-v158 label{
  font-size:11px!important;
  line-height:1.25!important;
  font-weight:650!important;
  color:#56606b!important;
}

/* inputs */
.auth-login-v158 input,
.auth-register-v158 input,
.auth-forgot-v158 input,
.auth-reset-v158 input,
.auth-verify-v158 input,
.auth-onboarding-v158 input,
.auth-register-v158 select,
.auth-onboarding-v158 select{
  min-height:50px!important;
  padding-left:14px!important;
  padding-right:14px!important;
  border-radius:11px!important;
  font-size:14px!important;
  line-height:1.2!important;
  box-sizing:border-box!important;
}

/* placeholders */
.auth-login-v158 input::placeholder,
.auth-register-v158 input::placeholder,
.auth-forgot-v158 input::placeholder,
.auth-reset-v158 input::placeholder,
.auth-verify-v158 input::placeholder,
.auth-onboarding-v158 input::placeholder{
  font-size:13.5px!important;
  color:#969da5!important;
}

/* botões principais */
.auth-login-v158 button[type="submit"],
.auth-register-v158 button[type="submit"],
.auth-forgot-v158 button[type="submit"],
.auth-reset-v158 button[type="submit"],
.auth-verify-v158 button[type="submit"],
.auth-onboarding-v158 button[type="submit"],
.auth-login-v158 .gradient-btn,
.auth-register-v158 .gradient-btn,
.auth-forgot-v158 .gradient-btn,
.auth-reset-v158 .gradient-btn,
.auth-verify-v158 .gradient-btn,
.auth-onboarding-v158 .gradient-btn{
  min-height:48px!important;
  border-radius:11px!important;
  font-size:12.5px!important;
  line-height:1!important;
  font-weight:700!important;
}

/* links */
.auth-login-v158 a,
.auth-register-v158 a,
.auth-forgot-v158 a,
.auth-reset-v158 a,
.auth-verify-v158 a,
.auth-onboarding-v158 a{
  font-size:11.5px!important;
  line-height:1.35!important;
}

/* rodapés / textos secundários */
.auth-login-v158 .auth-footer,
.auth-register-v158 .auth-footer,
.auth-forgot-v158 .auth-footer,
.auth-reset-v158 .auth-footer,
.auth-verify-v158 .auth-footer,
.auth-onboarding-v158 .auth-footer,
.auth-login-v158 .auth-bottom,
.auth-register-v158 .auth-bottom,
.auth-forgot-v158 .auth-bottom,
.auth-reset-v158 .auth-bottom,
.auth-verify-v158 .auth-bottom,
.auth-onboarding-v158 .auth-bottom{
  font-size:11.5px!important;
  line-height:1.45!important;
  color:#8c949d!important;
}

/* ---------- MOBILE ---------- */
@media(max-width:820px){

  .auth-login-v158 .auth-v72-brand,
  .auth-register-v158 .auth-v72-brand,
  .auth-forgot-v158 .auth-v72-brand,
  .auth-reset-v158 .auth-v72-brand,
  .auth-verify-v158 .auth-v72-brand,
  .auth-onboarding-v158 .auth-v72-brand{
    min-height:52px!important;
    margin-bottom:12px!important;
  }

  .auth-login-v158 .auth-v72-brand img,
  .auth-register-v158 .auth-v72-brand img,
  .auth-forgot-v158 .auth-v72-brand img,
  .auth-reset-v158 .auth-v72-brand img,
  .auth-verify-v158 .auth-v72-brand img,
  .auth-onboarding-v158 .auth-v72-brand img{
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    min-height:50px!important;
    max-width:50px!important;
    max-height:50px!important;
  }

  /* títulos */
  .auth-login-v158 h1,
  .auth-register-v158 h1,
  .auth-forgot-v158 h1,
  .auth-reset-v158 h1,
  .auth-verify-v158 h1,
  .auth-onboarding-v158 h1{
    font-size:27px!important;
    line-height:1.08!important;
    margin-bottom:9px!important;
  }

  /* descrições */
  .auth-login-v158 .auth-sub,
  .auth-register-v158 .auth-sub,
  .auth-forgot-v158 .auth-sub,
  .auth-reset-v158 .auth-sub,
  .auth-verify-v158 .auth-sub,
  .auth-onboarding-v158 .auth-sub,
  .auth-login-v158 p,
  .auth-register-v158 p,
  .auth-forgot-v158 p,
  .auth-reset-v158 p,
  .auth-verify-v158 p,
  .auth-onboarding-v158 p{
    font-size:13px!important;
    line-height:1.5!important;
  }

  /* kicker */
  .auth-login-v158 .auth-kicker,
  .auth-register-v158 .auth-kicker,
  .auth-forgot-v158 .auth-kicker,
  .auth-reset-v158 .auth-kicker,
  .auth-verify-v158 .auth-kicker,
  .auth-onboarding-v158 .auth-kicker,
  .auth-login-v158 .eyebrow,
  .auth-register-v158 .eyebrow,
  .auth-forgot-v158 .eyebrow,
  .auth-reset-v158 .eyebrow,
  .auth-verify-v158 .eyebrow,
  .auth-onboarding-v158 .eyebrow{
    font-size:9.5px!important;
  }

  /* labels */
  .auth-login-v158 label,
  .auth-register-v158 label,
  .auth-forgot-v158 label,
  .auth-reset-v158 label,
  .auth-verify-v158 label,
  .auth-onboarding-v158 label{
    font-size:11.5px!important;
  }

  /* campos */
  .auth-login-v158 input,
  .auth-register-v158 input,
  .auth-forgot-v158 input,
  .auth-reset-v158 input,
  .auth-verify-v158 input,
  .auth-onboarding-v158 input,
  .auth-register-v158 select,
  .auth-onboarding-v158 select{
    min-height:50px!important;
    font-size:14.5px!important;
  }

  /* botões */
  .auth-login-v158 button[type="submit"],
  .auth-register-v158 button[type="submit"],
  .auth-forgot-v158 button[type="submit"],
  .auth-reset-v158 button[type="submit"],
  .auth-verify-v158 button[type="submit"],
  .auth-onboarding-v158 button[type="submit"],
  .auth-login-v158 .gradient-btn,
  .auth-register-v158 .gradient-btn,
  .auth-forgot-v158 .gradient-btn,
  .auth-reset-v158 .gradient-btn,
  .auth-verify-v158 .gradient-btn,
  .auth-onboarding-v158 .gradient-btn{
    min-height:49px!important;
    font-size:12.5px!important;
  }

  /* links */
  .auth-login-v158 a,
  .auth-register-v158 a,
  .auth-forgot-v158 a,
  .auth-reset-v158 a,
  .auth-verify-v158 a,
  .auth-onboarding-v158 a{
    font-size:12px!important;
  }
}

/* celulares menores = mesmo tamanho de logo solicitado */
@media(max-width:430px){
  .auth-login-v158 .auth-v72-brand img,
  .auth-register-v158 .auth-v72-brand img,
  .auth-forgot-v158 .auth-v72-brand img,
  .auth-reset-v158 .auth-v72-brand img,
  .auth-verify-v158 .auth-v72-brand img,
  .auth-onboarding-v158 .auth-v72-brand img{
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    min-height:50px!important;
    max-width:50px!important;
    max-height:50px!important;
  }
}

/* =========================================================
   V160 — Menu lateral mobile em tela inteira
========================================================= */
.mobile-sidebar-close{
  display:none;
}

@media(max-width:820px){

  /* menu acima de tudo */
  #sidebar{
    position:fixed!important;
    inset:0!important;

    width:100vw!important;
    max-width:none!important;
    height:100dvh!important;
    min-height:100vh!important;

    margin:0!important;
    padding:22px 20px 24px!important;

    display:flex!important;
    flex-direction:column!important;

    background:#fff!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;

    z-index:9999!important;

    transform:translateX(-100%)!important;
    transition:transform .24s ease!important;

    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    box-sizing:border-box!important;
  }

  #sidebar.mobile-open,
  #sidebar.open,
  #sidebar.active,
  #sidebar.show{
    transform:translateX(0)!important;
  }

  body.mobile-sidebar-open{
    overflow:hidden!important;
    touch-action:none!important;
  }

  /* esconde menu inferior enquanto sidebar está aberta */
  body.mobile-sidebar-open .bottom-nav{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* X no topo direito */
  .mobile-sidebar-close{
    display:grid!important;
    place-items:center!important;

    position:absolute!important;
    top:16px!important;
    right:16px!important;

    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;

    padding:0!important;
    margin:0!important;

    border:0!important;
    border-radius:50%!important;

    background:#f4f5f6!important;
    color:#4d555e!important;

    font-size:22px!important;
    font-weight:400!important;
    line-height:1!important;

    z-index:10001!important;
    cursor:pointer!important;
  }

  /* no menu lateral mobile, sem logo grande */
  #sidebar .brand{
    display:none!important;
  }

  #sidebar nav{
    display:flex!important;
    flex-direction:column!important;
    gap:4px!important;

    width:100%!important;
    margin:48px 0 0!important;
    padding:0!important;
  }

  #sidebar nav a{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;

    width:100%!important;
    min-height:48px!important;

    padding:0 10px!important;
    margin:0!important;

    border-radius:9px!important;
    background:transparent!important;
    color:#4e5660!important;

    font-size:14px!important;
    font-weight:600!important;
    text-decoration:none!important;
  }

  #sidebar nav a.active{
    background:#f6f7f8!important;
    color:#1f2429!important;
  }

  /* Sair sempre no fim da tela */
  #sidebar .sidebar-bottom,
  #sidebar .sidebar-footer,
  #sidebar > .mobile-logout-link{
    margin-top:auto!important;
  }

  #sidebar a[href="logout.php"],
  #sidebar .mobile-logout-link{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:100%!important;
    min-height:46px!important;

    margin-top:auto!important;
    padding:0 14px!important;

    border:1px solid #e1e5e8!important;
    border-radius:10px!important;

    background:#fff!important;
    color:#6f7780!important;

    font-size:12px!important;
    font-weight:650!important;
    text-decoration:none!important;
  }

  /* qualquer conteúdo do menu não fica atrás do bottom nav */
  #sidebar{
    padding-bottom:24px!important;
  }
}

@media(max-width:430px){
  #sidebar{
    padding:20px 18px 22px!important;
  }

  .mobile-sidebar-close{
    top:14px!important;
    right:14px!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    font-size:21px!important;
  }

  #sidebar nav{
    margin-top:44px!important;
  }

  #sidebar nav a{
    min-height:46px!important;
    font-size:13.5px!important;
  }
}

/* =========================================================
   V161 — garantia final do menu mobile fullscreen
========================================================= */
@media(max-width:820px){

  #mobileMenu{
    position:relative!important;
    z-index:100!important;
    pointer-events:auto!important;
    cursor:pointer!important;
  }

  #sidebar{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;

    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:none!important;

    transform:translate3d(-100%,0,0)!important;
    transition:transform .22s ease!important;

    z-index:10000!important;
    pointer-events:none!important;
  }

  #sidebar.mobile-open,
  #sidebar.open{
    transform:translate3d(0,0,0)!important;
    pointer-events:auto!important;
  }

  #mobileSidebarClose{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    z-index:10002!important;
  }

  body.mobile-sidebar-open .bottom-nav{
    display:none!important;
  }

  body.mobile-sidebar-open .mobile-head{
    visibility:hidden!important;
  }

  /* X continua visível porque pertence à sidebar */
  body.mobile-sidebar-open #sidebar{
    visibility:visible!important;
  }

  #sidebar .mobile-logout-link{
    display:flex!important;
    margin-top:auto!important;
    flex:0 0 auto!important;
  }
}

/* =========================================================
   V162 — MENU MOBILE: clique direto, sem depender do app.js
========================================================= */
@media(max-width:820px){

  #mobileMenu{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    cursor:pointer!important;
    position:relative!important;
    z-index:500!important;
  }

  #sidebar{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;

    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;

    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;

    transform:translateX(-100%)!important;
    -webkit-transform:translateX(-100%)!important;

    transition:transform .20s ease!important;
    -webkit-transition:-webkit-transform .20s ease!important;

    z-index:2147483000!important;
    pointer-events:none!important;
  }

  #sidebar.mobile-open,
  #sidebar.open{
    transform:translateX(0)!important;
    -webkit-transform:translateX(0)!important;
    pointer-events:auto!important;
  }

  #mobileSidebarClose{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;

    position:absolute!important;
    top:16px!important;
    right:16px!important;

    z-index:2147483640!important;
  }

  body.mobile-sidebar-open{
    overflow:hidden!important;
  }

  body.mobile-sidebar-open .bottom-nav{
    display:none!important;
  }
}

/* =========================================================
   V163 — Menu mobile refinado
   X limpo + risco embaixo + sair vermelho compacto
========================================================= */
@media(max-width:820px){

  /* X limpo e centralizado */
  #mobileSidebarClose{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;

    display:grid!important;
    place-items:center!important;

    padding:0!important;
    margin:0!important;

    border:0!important;
    border-radius:50%!important;

    background:#f4f5f6!important;
    color:#3f464e!important;

    box-shadow:none!important;
    font-size:0!important;
    line-height:0!important;
  }

  #mobileSidebarClose svg{
    width:16px!important;
    height:16px!important;
    display:block!important;

    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
  }

  /* menu: sem bloco cinza no ativo */
  #sidebar nav a{
    position:relative!important;
    background:transparent!important;
    border-radius:0!important;
    box-shadow:none!important;

    color:#6f7780!important;
    font-weight:600!important;
  }

  #sidebar nav a.active{
    background:transparent!important;
    color:#1d2228!important;
    font-weight:700!important;
  }

  /* risco preto embaixo do item selecionado */
  #sidebar nav a.active::after{
    content:""!important;

    position:absolute!important;
    left:10px!important;
    bottom:3px!important;

    width:28px!important;
    height:2px!important;

    border-radius:999px!important;
    background:#171b20!important;
  }

  /* sair compacto, vermelho e minimalista */
  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    width:auto!important;
    min-width:92px!important;
    max-width:140px!important;
    min-height:38px!important;

    align-self:flex-start!important;
    justify-content:center!important;

    margin-top:auto!important;
    margin-left:0!important;
    margin-right:0!important;
    margin-bottom:2px!important;

    padding:0 14px!important;

    border:1px solid #f1c9c9!important;
    border-radius:9px!important;

    background:#fff!important;
    color:#c34e4e!important;

    font-size:11.5px!important;
    font-weight:700!important;
    text-decoration:none!important;
    box-shadow:none!important;
  }

  #sidebar .mobile-logout-link:hover,
  #sidebar a[href="logout.php"]:hover{
    background:#fff8f8!important;
    border-color:#eebcbc!important;
    color:#b74141!important;
  }
}

@media(max-width:430px){
  #mobileSidebarClose{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
  }

  #mobileSidebarClose svg{
    width:15px!important;
    height:15px!important;
  }

  #sidebar nav a.active::after{
    width:26px!important;
  }

  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    min-width:88px!important;
    min-height:36px!important;
    font-size:11px!important;
  }
}

/* =========================================================
   V164 — Menu mobile: Sair fixo e sempre visível
========================================================= */
@media(max-width:820px){

  #sidebar{
    padding-bottom:84px!important;
  }

  /* nav pode rolar sem empurrar o sair */
  #sidebar nav{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:12px!important;
    scrollbar-width:none!important;
  }

  #sidebar nav::-webkit-scrollbar{
    display:none!important;
  }

  /* botão sair fixo no rodapé */
  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    position:fixed!important;
    left:20px!important;
    bottom:18px!important;

    width:auto!important;
    min-width:92px!important;
    max-width:140px!important;
    min-height:38px!important;

    margin:0!important;
    padding:0 14px!important;

    z-index:10003!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    border:1px solid #f1c9c9!important;
    border-radius:9px!important;
    background:#fff!important;
    color:#c34e4e!important;

    font-size:11.5px!important;
    font-weight:700!important;
    text-decoration:none!important;
    box-shadow:0 4px 14px rgba(30,36,44,.05)!important;
  }

  /* faixa branca discreta atrás para não misturar com os links */
  #sidebar::after{
    content:""!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:72px!important;
    background:linear-gradient(to top,#fff 78%,rgba(255,255,255,0))!important;
    pointer-events:none!important;
    z-index:10002!important;
  }

  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    pointer-events:auto!important;
  }
}

@media(max-width:430px){
  #sidebar{
    padding-bottom:78px!important;
  }

  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    left:18px!important;
    bottom:16px!important;
    min-width:88px!important;
    min-height:36px!important;
    font-size:11px!important;
  }

  #sidebar::after{
    height:68px!important;
  }
}

/* =========================================================
   V165 — Menu mobile / iPhone
   Sair sempre dentro da área VISÍVEL do navegador
========================================================= */
@media(max-width:820px){

  /*
   * Chrome/Safari no iPhone alteram a altura visível conforme
   * a barra do navegador aparece. O sidebar usa svh/dvh e não
   * permite rolagem própria. Só o NAV pode rolar.
   */
  #sidebar{
    position:fixed!important;
    inset:0!important;

    width:100%!important;
    max-width:100%!important;

    height:100vh!important;
    height:100svh!important;
    max-height:100svh!important;

    display:flex!important;
    flex-direction:column!important;

    margin:0!important;
    padding:
      max(18px, env(safe-area-inset-top))
      20px
      max(14px, env(safe-area-inset-bottom))
      !important;

    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /*
   * Links ocupam apenas o espaço entre X e Sair.
   * Se houver muitos links, somente esta área rola.
   */
  #sidebar nav{
    flex:1 1 auto!important;
    min-height:0!important;

    display:flex!important;
    flex-direction:column!important;

    margin-top:46px!important;
    margin-bottom:12px!important;
    padding:0!important;

    overflow-y:auto!important;
    overflow-x:hidden!important;

    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;

    scrollbar-width:none!important;
  }

  #sidebar nav::-webkit-scrollbar{
    display:none!important;
  }

  /*
   * IMPORTANTE:
   * deixa de ser position:fixed.
   * Agora o botão pertence à última linha do próprio sidebar,
   * portanto nunca fica escondido atrás da barra do Chrome.
   */
  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    position:static!important;
    inset:auto!important;

    flex:0 0 auto!important;
    align-self:flex-start!important;

    width:auto!important;
    min-width:92px!important;
    max-width:140px!important;
    min-height:38px!important;

    margin:0!important;
    padding:0 14px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    border:1px solid #f1c9c9!important;
    border-radius:9px!important;

    background:#fff!important;
    color:#c34e4e!important;

    font-size:11.5px!important;
    font-weight:700!important;
    text-decoration:none!important;

    box-shadow:none!important;
    z-index:auto!important;
  }

  /*
   * Remove a faixa fixa criada na versão anterior,
   * que também podia calcular a altura errada no iPhone.
   */
  #sidebar::after{
    display:none!important;
    content:none!important;
  }

  #mobileSidebarClose{
    top:max(14px, env(safe-area-inset-top))!important;
    right:16px!important;
  }
}

/* iPhones / celulares mais estreitos */
@media(max-width:430px){
  #sidebar{
    padding:
      max(16px, env(safe-area-inset-top))
      18px
      max(12px, env(safe-area-inset-bottom))
      !important;
  }

  #sidebar nav{
    margin-top:42px!important;
    margin-bottom:10px!important;
  }

  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    min-width:88px!important;
    min-height:36px!important;
    padding:0 13px!important;
    font-size:11px!important;
  }

  #mobileSidebarClose{
    right:14px!important;
  }
}

/* =========================================================
   V166 — Foto do perfil no mobile: Resumo + NanaBot
========================================================= */

/* Foto real sempre vence emojis/placeholders */
.welcome-avatar,
.chat-user-avatar{
  overflow:hidden!important;
  position:relative!important;
}

.welcome-avatar img.profile-avatar-img,
.chat-user-avatar img.profile-avatar-img,
.welcome-avatar > img,
.chat-user-avatar > img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:50%!important;
  opacity:1!important;
  visibility:visible!important;
}

/* fallback só aparece quando não existe imagem */
.welcome-avatar:has(img) > .profile-avatar-fallback,
.chat-user-avatar:has(img) > .profile-avatar-fallback{
  display:none!important;
}

@media(max-width:820px){

  /* Resumo — foto ao lado do Olá */
  .welcome-person{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
  }

  .welcome-avatar{
    display:block!important;
    flex:0 0 46px!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    min-height:46px!important;
    border-radius:50%!important;
    background:#f2f4f5!important;
  }

  .welcome-avatar img,
  .welcome-avatar img.profile-avatar-img{
    display:block!important;
    width:46px!important;
    height:46px!important;
    object-fit:cover!important;
    border-radius:50%!important;
  }

  /* remove qualquer emoji/pseudo-elemento sobre a foto */
  .welcome-avatar:has(img)::before,
  .welcome-avatar:has(img)::after{
    display:none!important;
    content:none!important;
  }

  /* NanaBot — foto da usuária nas mensagens */
  .chat-user-avatar{
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    border-radius:50%!important;
    background:#f2f4f5!important;
    overflow:hidden!important;
  }

  .chat-user-avatar.has-photo{
    display:block!important;
    font-size:0!important;
  }

  .chat-user-avatar img,
  .chat-user-avatar img.profile-avatar-img{
    display:block!important;
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:50%!important;
  }

  .chat-user-avatar.has-photo::before,
  .chat-user-avatar.has-photo::after{
    display:none!important;
    content:none!important;
  }
}

@media(max-width:430px){
  .welcome-avatar,
  .welcome-avatar img,
  .welcome-avatar img.profile-avatar-img{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
  }

  .chat-user-avatar,
  .chat-user-avatar img,
  .chat-user-avatar img.profile-avatar-img{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
  }
}

/* =========================================================
   V167 — Avatar robusto no Chrome/iPhone
========================================================= */
.welcome-avatar.avatar-load-error,
.chat-user-avatar.avatar-load-error{
  background:#f2f4f5!important;
  overflow:hidden!important;
}

.welcome-avatar.avatar-load-error img,
.chat-user-avatar.avatar-load-error img{
  display:none!important;
}

/* nunca mostrar ícone de imagem quebrada */
.profile-avatar-img{
  color:transparent!important;
  text-indent:-9999px!important;
}

/* V169 — upload automático da foto */
.avatar-auto-status{
  display:inline-block!important;
  margin-left:8px!important;
  color:#8b939c!important;
  font-size:10px!important;
  line-height:1.3!important;
  vertical-align:middle!important;
}

@media(max-width:820px){
  .avatar-auto-status{
    display:block!important;
    margin:7px 0 0!important;
    font-size:10.5px!important;
  }
}

/* =========================================================
   V170 — Perfil: sexo do bebê
========================================================= */
.profile-gender-field{
  margin-top:16px!important;
}

.profile-gender-label{
  display:block!important;
  margin-bottom:8px!important;
  color:#59626c!important;
  font-size:11px!important;
  font-weight:650!important;
}

.profile-gender-options{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}

.profile-gender-option{
  position:relative!important;
  margin:0!important;
  cursor:pointer!important;
}

.profile-gender-option input{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
}

.profile-gender-option span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;

  min-width:92px!important;
  min-height:40px!important;

  padding:0 14px!important;

  border:1px solid #e1e5e8!important;
  border-radius:10px!important;

  background:#fff!important;
  color:#6d7580!important;

  font-size:11.5px!important;
  font-weight:650!important;

  transition:.16s ease!important;
}

.profile-gender-option input:checked + span{
  border-color:#cfd5da!important;
  color:#24292f!important;
  box-shadow:0 4px 14px rgba(30,36,44,.05)!important;
}

.profile-gender-option:first-child input:checked + span{
  background:linear-gradient(100deg,rgba(109,178,200,.15),rgba(255,255,255,.96))!important;
}

.profile-gender-option:last-child input:checked + span{
  background:linear-gradient(100deg,rgba(237,157,156,.16),rgba(255,255,255,.96))!important;
}

@media(max-width:820px){
  .profile-gender-field{
    margin-top:14px!important;
  }

  .profile-gender-label{
    font-size:11.5px!important;
  }

  .profile-gender-options{
    gap:8px!important;
  }

  .profile-gender-option{
    flex:1 1 0!important;
  }

  .profile-gender-option span{
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    font-size:12px!important;
    box-sizing:border-box!important;
  }
}

/* =========================================================
   V171 — Perfil: estados discretos e consistentes
========================================================= */
.profile-feedback{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;

  width:max-content!important;
  max-width:100%!important;
  min-height:26px!important;

  margin:0!important;
  padding:0 9px!important;

  border:1px solid transparent!important;
  border-radius:999px!important;

  background:transparent!important;
  color:#8b939c!important;

  font-size:10px!important;
  font-weight:600!important;
  line-height:1!important;

  opacity:1!important;
  transition:.18s ease!important;
}

.profile-feedback:empty{
  display:none!important;
}

.profile-feedback.is-loading{
  background:#f6f7f8!important;
  border-color:#eceff1!important;
  color:#7c858f!important;
}

.profile-feedback.is-loading::before{
  content:""!important;
  width:6px!important;
  height:6px!important;
  min-width:6px!important;
  border-radius:50%!important;
  background:#8db9c7!important;
}

.profile-feedback.is-success{
  background:#f4faf6!important;
  border-color:#dcefe2!important;
  color:#4f765b!important;
}

.profile-feedback.is-success::before{
  content:"✓"!important;
  font-size:9px!important;
  font-weight:800!important;
}

.profile-feedback.is-error{
  background:#fff7f7!important;
  border-color:#f2dada!important;
  color:#a95b5b!important;
}

.profile-actions{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}

.avatar-auto-status{
  margin-left:8px!important;
  vertical-align:middle!important;
}

/* selector keeps current signup choice visually clear */
.profile-gender-option input:checked + span{
  border-color:#c9d0d5!important;
  box-shadow:0 3px 12px rgba(30,36,44,.05)!important;
}

@media(max-width:820px){
  .profile-feedback{
    min-height:28px!important;
    padding:0 10px!important;
    font-size:10.5px!important;
  }

  .avatar-auto-status{
    margin:7px 0 0!important;
  }

  .profile-actions{
    gap:8px!important;
  }
}


/* =========================================================
   V173 — NanaBot: remover fundo colorido das mensagens
========================================================= */
.nanabot-message.assistant,
.nanabot-message.bot,
.chat-message.assistant,
.chat-message.bot,
.message.assistant,
.message.bot,
.nanabot-chat .assistant,
.nanabot-chat .bot,
.nanabot-messages .assistant,
.nanabot-messages .bot{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border-color:transparent!important;
}

/* O conteúdo textual da NanaBot também não recebe faixa/degradê */
.nanabot-message.assistant .message-content,
.nanabot-message.bot .message-content,
.chat-message.assistant .message-content,
.chat-message.bot .message-content,
.message.assistant .message-content,
.message.bot .message-content,
.nanabot-message.assistant .bubble,
.nanabot-message.bot .bubble,
.chat-message.assistant .bubble,
.chat-message.bot .bubble{
  background:#fff!important;
  background-image:none!important;
  box-shadow:none!important;
}

/* Evita pseudo-elementos coloridos herdados */
.nanabot-message.assistant::before,
.nanabot-message.assistant::after,
.nanabot-message.bot::before,
.nanabot-message.bot::after,
.chat-message.assistant::before,
.chat-message.assistant::after,
.chat-message.bot::before,
.chat-message.bot::after{
  background:none!important;
  background-image:none!important;
}


/* =========================================================
   V174 — NanaBot: correção no elemento REAL (.chat-row)
========================================================= */
.chat-stream .chat-row.assistant,
.chat-stream .chat-row.assistant.msg,
.chat-stream .chat-row.assistant.msg.bot,
.chat-stream .chat-row.assistant.chat-welcome,
.chat-stream .chat-row.assistant.chat-welcome.msg.bot{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
}

/* A mensagem não pode virar uma faixa de largura total */
.chat-stream .chat-row.assistant .chat-text,
.chat-stream .chat-row.assistant.msg.bot .chat-text,
.chat-stream .chat-row.assistant.chat-welcome .chat-text{
  width:auto!important;
  max-width:min(720px,calc(100% - 52px))!important;
  flex:0 1 auto!important;

  margin:0!important;
  padding:0!important;

  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;

  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;

  color:#2d333a!important;
}

/* O parágrafo também fica totalmente limpo */
.chat-stream .chat-row.assistant .chat-text p,
.chat-stream .chat-row.assistant.msg.bot .chat-text p,
.chat-stream .chat-row.assistant.chat-welcome .chat-text p{
  margin:0!important;
  padding:0!important;

  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;

  border:0!important;
  box-shadow:none!important;
}

/* mata qualquer degradê colocado por pseudo-elemento */
.chat-stream .chat-row.assistant .chat-text::before,
.chat-stream .chat-row.assistant .chat-text::after,
.chat-stream .chat-row.assistant::before,
.chat-stream .chat-row.assistant::after{
  content:none!important;
  display:none!important;
  background:none!important;
}

@media(max-width:820px){
  .chat-stream .chat-row.assistant .chat-text{
    max-width:calc(100% - 46px)!important;
  }
}

/* =========================================================
   V175 — Plano de Sono: dias minimalistas
========================================================= */
.plan-days,
.weekdays,
.weekday-tabs,
.plan-weekdays,
.routine-days{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

.plan-days button,
.weekdays button,
.weekday-tabs button,
.plan-weekdays button,
.routine-days button,
.plan-days a,
.weekdays a,
.weekday-tabs a,
.plan-weekdays a,
.routine-days a{
  position:relative!important;

  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;

  color:#7d858e!important;
  font-weight:600!important;

  padding:10px 8px 12px!important;
  min-height:0!important;
}

.plan-days button.active,
.weekdays button.active,
.weekday-tabs button.active,
.plan-weekdays button.active,
.routine-days button.active,
.plan-days a.active,
.weekdays a.active,
.weekday-tabs a.active,
.plan-weekdays a.active,
.routine-days a.active{
  background:transparent!important;
  color:#1f2429!important;
  font-weight:700!important;
}

.plan-days button.active::after,
.weekdays button.active::after,
.weekday-tabs button.active::after,
.plan-weekdays button.active::after,
.routine-days button.active::after,
.plan-days a.active::after,
.weekdays a.active::after,
.weekday-tabs a.active::after,
.plan-weekdays a.active::after,
.routine-days a.active::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  bottom:0!important;
  transform:translateX(-50%)!important;

  width:30px!important;
  height:2px!important;

  border-radius:999px!important;
  background:linear-gradient(90deg,#6DB2C8,#ED9D9C)!important;
}

@media(max-width:820px){
  .plan-days,
  .weekdays,
  .weekday-tabs,
  .plan-weekdays,
  .routine-days{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
  }

  .plan-days::-webkit-scrollbar,
  .weekdays::-webkit-scrollbar,
  .weekday-tabs::-webkit-scrollbar,
  .plan-weekdays::-webkit-scrollbar,
  .routine-days::-webkit-scrollbar{
    display:none!important;
  }

  .plan-days button,
  .weekdays button,
  .weekday-tabs button,
  .plan-weekdays button,
  .routine-days button,
  .plan-days a,
  .weekdays a,
  .weekday-tabs a,
  .plan-weekdays a,
  .routine-days a{
    flex:0 0 auto!important;
    padding:9px 12px 11px!important;
    font-size:12px!important;
  }
}

/* =========================================================
   V176 — componente REAL dos dias do Plano
   .day-tabs.plan-weekdays-scroll
========================================================= */

.day-tabs.plan-weekdays-scroll,
.day-tabs{
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  gap:0!important;

  width:100%!important;
  margin:0 0 18px!important;
  padding:0!important;

  overflow:visible!important;

  background:transparent!important;
  border:0!important;
  border-bottom:1px solid #eceff1!important;
  box-shadow:none!important;
}

.day-tabs.plan-weekdays-scroll a,
.day-tabs a{
  position:relative!important;

  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  margin:0!important;
  padding:10px 4px 12px!important;

  background:transparent!important;
  background-image:none!important;

  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;

  color:#7d858e!important;

  font-size:11.5px!important;
  font-weight:600!important;
  line-height:1!important;
  text-decoration:none!important;
}

.day-tabs.plan-weekdays-scroll a:hover,
.day-tabs a:hover{
  background:transparent!important;
  border:0!important;
  color:#444b53!important;
}

.day-tabs.plan-weekdays-scroll a.active,
.day-tabs a.active{
  background:transparent!important;
  background-image:none!important;

  border:0!important;
  box-shadow:none!important;

  color:#1f2429!important;
  font-weight:700!important;
}

.day-tabs.plan-weekdays-scroll a.active::after,
.day-tabs a.active::after{
  content:""!important;

  position:absolute!important;
  left:50%!important;
  right:auto!important;
  bottom:-1px!important;

  width:30px!important;
  height:2px!important;

  transform:translateX(-50%)!important;

  border-radius:999px 999px 0 0!important;
  background:linear-gradient(90deg,#6DB2C8,#ED9D9C)!important;
}

/* Mobile continua leve e cabe sem cards */
@media(max-width:820px){
  .day-tabs.plan-weekdays-scroll,
  .day-tabs{
    display:grid!important;
    grid-template-columns:repeat(7,minmax(42px,1fr))!important;
    gap:0!important;

    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .day-tabs.plan-weekdays-scroll::-webkit-scrollbar,
  .day-tabs::-webkit-scrollbar{
    display:none!important;
  }

  .day-tabs.plan-weekdays-scroll a,
  .day-tabs a{
    min-width:42px!important;
    padding:10px 5px 12px!important;

    font-size:11.5px!important;
    white-space:nowrap!important;
  }
}

@media(max-width:430px){
  .day-tabs.plan-weekdays-scroll a,
  .day-tabs a{
    font-size:11px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }

  .day-tabs.plan-weekdays-scroll a.active::after,
  .day-tabs a.active::after{
    width:26px!important;
  }
}

/* =========================================================
   V177 — Sair desktop + Ajuda no Perfil
========================================================= */

/* ---------- DESKTOP: Sair vermelho, compacto ---------- */
@media(min-width:821px){
  #sidebar .logout,
  #sidebar .mobile-logout-link,
  #sidebar a[href="logout.php"]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    align-self:flex-start!important;

    width:auto!important;
    min-width:88px!important;
    max-width:130px!important;
    min-height:36px!important;

    margin-top:auto!important;
    padding:0 13px!important;

    border:1px solid #f1c9c9!important;
    border-radius:9px!important;

    background:#fff!important;
    color:#c34e4e!important;

    font-size:11px!important;
    font-weight:700!important;
    line-height:1!important;
    text-decoration:none!important;

    box-shadow:none!important;
  }

  #sidebar .logout:hover,
  #sidebar .mobile-logout-link:hover,
  #sidebar a[href="logout.php"]:hover{
    background:#fff8f8!important;
    border-color:#eebcbc!important;
    color:#b74141!important;
  }
}

/* ---------- PERFIL: Ajuda ---------- */
.profile-help-v177{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;

  padding:20px 22px!important;
}

.profile-help-copy{
  min-width:0!important;
}

.profile-help-copy h2{
  margin:3px 0 5px!important;
  font-size:17px!important;
  line-height:1.2!important;
}

.profile-help-copy p{
  margin:0!important;
  color:#8a929b!important;
  font-size:11px!important;
  line-height:1.45!important;
}

.profile-help-link{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;

  flex:0 0 auto!important;

  min-height:38px!important;
  padding:0 14px!important;

  border:1px solid #dfe4e7!important;
  border-radius:9px!important;

  background:#fff!important;
  color:#454c54!important;

  font-size:11px!important;
  font-weight:650!important;
  line-height:1!important;
  text-decoration:none!important;

  box-shadow:none!important;
}

.profile-help-link:hover{
  background:#f8f9fa!important;
  border-color:#d3d9dd!important;
  color:#20252a!important;
}

@media(max-width:820px){
  .profile-help-v177{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:13px!important;

    padding:17px!important;
  }

  .profile-help-copy h2{
    font-size:18px!important;
  }

  .profile-help-copy p{
    font-size:11.5px!important;
  }

  .profile-help-link{
    width:100%!important;
    min-height:42px!important;

    font-size:12px!important;
    box-sizing:border-box!important;
  }
}

/* =========================================================
   V178 — Pré-lançamento: E-books + Segurança do Perfil
========================================================= */
.ebook-library-v178{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.ebook-card-v178{
  min-width:0;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 20px;
  align-items:center;
  gap:12px;
  padding:15px;
  border:1px solid #e4e7ea;
  border-radius:13px;
  background:#fff;
  color:#252a30;
  text-decoration:none;
}
.ebook-card-v178>span{
  width:40px;height:40px;border-radius:10px;
  display:grid;place-items:center;
  background:#f4f6f7;
  color:#6c747d;
  font-size:9px;font-weight:750;
}
.ebook-card-v178 div{display:grid;gap:3px;min-width:0}
.ebook-card-v178 b{font-size:12.5px}
.ebook-card-v178 small{font-size:10.5px;color:#8a929b;line-height:1.4}
.ebook-card-v178 i{font-style:normal;color:#9ba2aa;font-size:18px}

.profile-password-v178{
  display:grid!important;
  grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr)!important;
  gap:24px!important;
  align-items:start!important;
  padding:20px 22px!important;
}
.profile-password-copy h2{
  margin:3px 0 5px!important;
  font-size:17px!important;
}
.profile-password-copy p{
  margin:0!important;
  color:#8a929b!important;
  font-size:11px!important;
  line-height:1.45!important;
}
.profile-password-form{display:grid!important;gap:12px!important}
.profile-password-fields{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}
.profile-password-fields label{
  display:grid!important;
  gap:6px!important;
  color:#59626c!important;
  font-size:10.5px!important;
  font-weight:650!important;
}
.profile-password-fields input{
  width:100%!important;
  min-height:42px!important;
  padding:0 11px!important;
  border:1px solid #dfe3e6!important;
  border-radius:10px!important;
  background:#fff!important;
  font-size:12px!important;
  box-sizing:border-box!important;
}
.profile-password-actions{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  flex-wrap:wrap!important;
}
.profile-password-actions .secondary{
  width:auto!important;
  min-height:38px!important;
  padding:0 13px!important;
  border-radius:9px!important;
  font-size:11px!important;
}

@media(max-width:820px){
  .ebook-library-v178{grid-template-columns:1fr}
  .profile-password-v178{
    grid-template-columns:1fr!important;
    gap:14px!important;
    padding:17px!important;
  }
  .profile-password-fields{grid-template-columns:1fr!important;gap:10px!important}
  .profile-password-fields label{font-size:11.5px!important}
  .profile-password-fields input{min-height:48px!important;font-size:14px!important}
  .profile-password-actions .secondary{
    min-height:42px!important;
    font-size:12px!important;
  }
}

/* =========================================================
   V179 — Perfil: alteração de senha em modal minimalista
========================================================= */
.profile-password-v179{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:20px 22px!important;
}
.profile-password-copy-v179{min-width:0!important}
.profile-password-copy-v179 h2{
  margin:3px 0 5px!important;
  font-size:17px!important;
  line-height:1.2!important;
}
.profile-password-copy-v179 p{
  margin:0!important;
  color:#8a929b!important;
  font-size:11px!important;
  line-height:1.45!important;
}
.profile-password-open-v179{
  flex:0 0 auto!important;
  width:auto!important;
  min-height:38px!important;
  padding:0 14px!important;
  border:1px solid #dfe4e7!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#454c54!important;
  font-size:11px!important;
  font-weight:650!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.profile-password-open-v179:hover{background:#f8f9fa!important;border-color:#d3d9dd!important;color:#20252a!important}

.profile-password-modal-v179{
  position:fixed!important;
  inset:0!important;
  z-index:99999!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  padding:20px!important;
  box-sizing:border-box!important;
}
.profile-password-modal-v179.is-open{display:flex!important}
.profile-password-backdrop-v179{
  position:absolute!important;
  inset:0!important;
  background:rgba(27,32,38,.32)!important;
  backdrop-filter:blur(4px)!important;
  -webkit-backdrop-filter:blur(4px)!important;
}
.profile-password-dialog-v179{
  position:relative!important;
  z-index:1!important;
  width:min(100%,440px)!important;
  max-height:calc(100vh - 40px)!important;
  overflow:auto!important;
  padding:24px!important;
  border:1px solid #e7eaed!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 22px 60px rgba(26,32,39,.14)!important;
  box-sizing:border-box!important;
}
.profile-password-close-v179{
  position:absolute!important;
  top:14px!important;
  right:14px!important;
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f5f6f7!important;
  color:#69717a!important;
  font-size:22px!important;
  font-weight:300!important;
  line-height:1!important;
  cursor:pointer!important;
}
.profile-password-modal-head-v179{
  display:flex!important;
  align-items:flex-start!important;
  gap:12px!important;
  padding-right:38px!important;
  margin-bottom:20px!important;
}
.profile-password-lock-v179{
  flex:0 0 auto!important;
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:11px!important;
  background:#f3f6f7!important;
}
.profile-password-lock-v179 svg{
  width:19px!important;
  height:19px!important;
  fill:none!important;
  stroke:#66717a!important;
  stroke-width:1.6!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.profile-password-modal-head-v179 h2{
  margin:3px 0 5px!important;
  font-size:20px!important;
  line-height:1.2!important;
}
.profile-password-modal-head-v179 p{
  margin:0!important;
  color:#8a929b!important;
  font-size:12px!important;
  line-height:1.45!important;
}
.profile-password-form-v179{display:grid!important;gap:13px!important}
.profile-password-form-v179 label{
  display:grid!important;
  gap:7px!important;
  color:#59626c!important;
  font-size:11.5px!important;
  font-weight:650!important;
}
.profile-password-form-v179 input{
  width:100%!important;
  min-height:47px!important;
  padding:0 13px!important;
  border:1px solid #dfe3e6!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#252a30!important;
  font-size:13px!important;
  outline:none!important;
  box-sizing:border-box!important;
  transition:border-color .15s ease,box-shadow .15s ease!important;
}
.profile-password-form-v179 input:focus{
  border-color:#b9cbd1!important;
  box-shadow:0 0 0 3px rgba(109,178,200,.10)!important;
}
.profile-password-status-v179{min-height:0!important;margin:0!important}
.profile-password-modal-actions-v179{
  display:grid!important;
  grid-template-columns:1fr 1.35fr!important;
  gap:9px!important;
  margin-top:2px!important;
}
.profile-password-cancel-v179,
.profile-password-save-v179{
  min-height:44px!important;
  border-radius:11px!important;
  font-size:12px!important;
  font-weight:700!important;
  cursor:pointer!important;
}
.profile-password-cancel-v179{
  border:1px solid #dfe3e6!important;
  background:#fff!important;
  color:#59616a!important;
}
.profile-password-save-v179{
  border:0!important;
  background:linear-gradient(135deg,#6DB2C8,#ED9D9C)!important;
  color:#fff!important;
  box-shadow:none!important;
}
body.profile-password-modal-open-v179{overflow:hidden!important}

@media(max-width:820px){
  .profile-password-v179{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:13px!important;
    padding:17px!important;
  }
  .profile-password-copy-v179 h2{font-size:18px!important}
  .profile-password-copy-v179 p{font-size:11.5px!important}
  .profile-password-open-v179{width:100%!important;min-height:42px!important;font-size:12px!important;box-sizing:border-box!important}
  .profile-password-modal-v179{align-items:flex-end!important;padding:10px!important}
  .profile-password-dialog-v179{
    width:100%!important;
    max-height:calc(100vh - 20px)!important;
    padding:21px 17px 17px!important;
    border-radius:19px!important;
  }
  .profile-password-modal-head-v179 h2{font-size:19px!important}
  .profile-password-form-v179 input{min-height:49px!important;font-size:14px!important}
  .profile-password-modal-actions-v179{grid-template-columns:1fr!important}
  .profile-password-save-v179{order:1!important}
  .profile-password-cancel-v179{order:2!important}
}


/* V188 — alinhamento da marca no desktop */
@media(min-width:821px){
  .sidebar .brand{padding-left:4px!important;}
}

/* V190 — Perfil: correção real de espaçamento e foto */
.profile-page-wide .profile-photos.one-photo{
  max-width:none !important;
  margin:0 0 22px !important;
  padding:0 !important;
  border:0 !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}
.profile-page-wide .profile-photos.one-photo > section,
.profile-page-wide .profile-photos.one-photo .photo-line{
  border:0 !important;
  border-top:0 !important;
  border-right:0 !important;
  border-bottom:0 !important;
  border-left:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
.profile-page-wide .profile-photos.one-photo .photo-line{
  padding:0 !important;
  margin:0 !important;
}
.profile-page-wide .profile-photos.one-photo .photo-line::before,
.profile-page-wide .profile-photos.one-photo .photo-line::after{
  content:none !important;
  display:none !important;
  border:0 !important;
}
.profile-page-wide .profile-photos.one-photo .upload{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-height:34px !important;
  padding:0 12px !important;
  margin:0 !important;
  background:#fff !important;
  border:1px solid #e1e5e8 !important;
  border-radius:10px !important;
  color:#59616a !important;
  font-size:11px !important;
  font-weight:600 !important;
  line-height:1 !important;
  box-shadow:none !important;
  cursor:pointer !important;
}
.profile-page-wide .profile-photos.one-photo .upload:hover{
  background:#f8f9fa !important;
  border-color:#d5dade !important;
}
/* Segurança e Ajuda realmente separados */
.profile-page-wide .profile-password-v179{
  margin-top:0 !important;
  margin-bottom:34px !important;
}
.profile-page-wide .profile-help-v177{
  margin-top:0 !important;
  margin-bottom:14px !important;
}
@media(max-width:820px){
  .profile-page-wide .profile-photos.one-photo{margin-bottom:20px !important;}
  .profile-page-wide .profile-password-v179{margin-bottom:28px !important;}
  .profile-page-wide .profile-photos.one-photo .upload{min-height:32px !important;padding:0 11px !important;}
}


/* V192 — Sons minimalistas + estado tocando em degradê */
.sound-page-v130 .sound-category{background:#fff !important;}
.sound-page-v130 .sound-tile{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
  transition:background .2s ease,border-color .2s ease,transform .2s ease !important;
}
.sound-page-v130 .sound-tile .play-sound{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#5f6973 !important;
}
.sound-page-v130 .sound-tile.is-playing{
  background:linear-gradient(120deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  border-color:transparent !important;
}
.sound-page-v130 .sound-tile.is-playing b,
.sound-page-v130 .sound-tile.is-playing small,
.sound-page-v130 .sound-tile.is-playing .play-sound,
.sound-page-v130 .sound-tile.is-playing .fav{color:#fff !important;}
.sound-page-v130 .sound-tile.is-playing .sound-emoji{filter:none !important;}
.sound-page-v130 .sound-tile.is-playing .play-sound{background:transparent !important;}
#soundPlayer.sound-player-v131 .sound-timers-v131 button.active{
  border-color:transparent !important;
  background:linear-gradient(100deg,#6DB2C8,#ED9D9C) !important;
  color:#fff !important;
}
#soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"]{
  min-width:38px !important;
  font-size:16px !important;
  line-height:1 !important;
}


/* =========================================================
   V193 — Sons: card sempre branco; degradê SOMENTE no Play tocando
========================================================= */
.sound-page-v130 .sound-tile,
.sound-page-v130 .sound-tile.is-playing{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
}

.sound-page-v130 .sound-tile.is-playing b{
  color:inherit !important;
}
.sound-page-v130 .sound-tile.is-playing small{
  color:inherit !important;
}
.sound-page-v130 .sound-tile.is-playing .fav{
  color:inherit !important;
}

.sound-page-v130 .sound-tile .play-sound{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#5f6973 !important;
}

.sound-page-v130 .sound-tile.is-playing .play-sound{
  background:linear-gradient(120deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
}

/* =========================================================
   V195 — Sons: degradê somente no player "Tocando"
========================================================= */
.sound-page-v130 .sound-tile,
.sound-page-v130 .sound-tile.is-playing{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
}

.sound-page-v130 .sound-tile .play-sound,
.sound-page-v130 .sound-tile.is-playing .play-sound{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#5f6973 !important;
}

.sound-page-v130 .sound-tile.is-playing b{color:inherit !important;}
.sound-page-v130 .sound-tile.is-playing small{color:var(--muted) !important;}
.sound-page-v130 .sound-tile.is-playing .fav{color:inherit !important;}
.sound-page-v130 .sound-tile.is-playing .fav.active{color:var(--pink) !important;}

#soundPlayer.sound-player-v131 .sound-player-play{
  background:transparent !important;
  color:#5f6973 !important;
  border:0 !important;
  box-shadow:none !important;
  transition:background .18s ease,color .18s ease,transform .18s ease !important;
}

#soundPlayer.sound-player-v131.is-playing .sound-player-play{
  background:linear-gradient(100deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  color:#fff !important;
}


/* =========================================================
   V196 — Sons: estado final sem conflito com regras antigas
   Card branco. Degradê somente no Play da faixa em reprodução.
========================================================= */
html body .sound-page-v130 .sound-tile,
html body .sound-page-v130 .sound-tile.is-playing{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
  color:inherit !important;
}
html body .sound-page-v130 .sound-tile.is-playing b{color:inherit !important;}
html body .sound-page-v130 .sound-tile.is-playing small{color:var(--muted,#7d858e) !important;}
html body .sound-page-v130 .sound-tile.is-playing .fav{color:inherit !important;}
html body .sound-page-v130 .sound-tile.is-playing .fav.active{color:var(--pink,#ED9D9C) !important;}

html body .sound-page-v130 .sound-tile .play-sound{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  color:#5f6973 !important;
  box-shadow:none !important;
  line-height:1 !important;
  transition:background .18s ease,color .18s ease,transform .18s ease !important;
}
html body .sound-page-v130 .sound-tile.is-playing .play-sound{
  background:linear-gradient(100deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Player superior: neutro; não fica permanentemente com degradê por regra antiga */
html body #soundPlayer.sound-player-v131 #playPause,
html body #soundPlayer.sound-player-v131 .sound-player-play{
  background:#fff !important;
  color:#5f6973 !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
}
html body #soundPlayer.sound-player-v131.is-playing #playPause,
html body #soundPlayer.sound-player-v131.is-playing .sound-player-play{
  background:#fff !important;
  color:#5f6973 !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
}


/* =========================================================
   V197 — Sons: mantém players das músicas em degradê;
   somente o player superior "Tocando" também ganha degradê ao tocar
========================================================= */

/* Cards continuam brancos */
.sound-page-v130 .sound-tile,
.sound-page-v130 .sound-tile.is-playing{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
}

/* Player/botão de cada música mantém o degradê quando ativo */
.sound-page-v130 .sound-tile.is-playing .play-sound{
  background:linear-gradient(120deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

/* Player superior "Tocando": estado normal */
#soundPlayer.sound-player-v131{
  background:#fff !important;
  transition:background .2s ease,color .2s ease,border-color .2s ease !important;
}

/* Estado tocando no player superior */
#soundPlayer.sound-player-v131.is-playing,
#soundPlayer.sound-player-v131.playing,
#soundPlayer.sound-player-v131[data-playing="true"]{
  background:linear-gradient(120deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  border-color:transparent !important;
  color:#fff !important;
}

/* Textos/ícones do player superior ficam brancos enquanto toca */
#soundPlayer.sound-player-v131.is-playing *,
#soundPlayer.sound-player-v131.playing *,
#soundPlayer.sound-player-v131[data-playing="true"] *{
  color:#fff !important;
}

/* Botões do player superior ficam limpos sobre o degradê */
#soundPlayer.sound-player-v131.is-playing button,
#soundPlayer.sound-player-v131.playing button,
#soundPlayer.sound-player-v131[data-playing="true"] button{
  color:#fff !important;
}

/* Mantém os timers legíveis sem alterar a função */
#soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button,
#soundPlayer.sound-player-v131.playing .sound-timers-v131 button,
#soundPlayer.sound-player-v131[data-playing="true"] .sound-timers-v131 button{
  border-color:rgba(255,255,255,.45) !important;
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
}


/* =========================================================
   V198 — Sons para Dormir: ajuste visual final
========================================================= */

/* 28 músicas: círculo do player SEMPRE em degradê + ícone branco */
html body .sound-page-v130 .sound-tile .play-sound,
html body .sound-page-v130 .sound-tile.is-playing .play-sound{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  border-radius:50% !important;
  border:0 !important;
  background:linear-gradient(120deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  color:#fff !important;
  box-shadow:none !important;
  display:grid !important;
  place-items:center !important;
}

/* Card da música continua branco mesmo selecionado/tocando */
html body .sound-page-v130 .sound-tile,
html body .sound-page-v130 .sound-tile.is-playing{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  color:inherit !important;
  box-shadow:none !important;
}

/* BLOCO SUPERIOR "TOCANDO": degradê enquanto toca */
html body #soundPlayer.sound-player-v131.is-playing,
html body #soundPlayer.sound-player-v131[data-playing="true"]{
  background:linear-gradient(120deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  border-color:transparent !important;
}

/* Todos os escritos do Tocando realmente brancos */
html body #soundPlayer.sound-player-v131.is-playing .player-copy small,
html body #soundPlayer.sound-player-v131.is-playing .player-copy b,
html body #soundPlayer.sound-player-v131.is-playing .player-copy span,
html body #soundPlayer.sound-player-v131.is-playing .sound-volume-label,
html body #soundPlayer.sound-player-v131[data-playing="true"] .player-copy small,
html body #soundPlayer.sound-player-v131[data-playing="true"] .player-copy b,
html body #soundPlayer.sound-player-v131[data-playing="true"] .player-copy span,
html body #soundPlayer.sound-player-v131[data-playing="true"] .sound-volume-label{
  color:#fff !important;
}

/* Ícone/capa do Tocando: borda branca, sem fundo cinza */
html body #soundPlayer.sound-player-v131.is-playing .player-cover,
html body #soundPlayer.sound-player-v131[data-playing="true"] .player-cover{
  background:transparent !important;
  border:1px solid rgba(255,255,255,.9) !important;
  color:#fff !important;
}

/* Player principal sobre o degradê: SEM fundo próprio, só ícone branco */
html body #soundPlayer.sound-player-v131.is-playing #playPause,
html body #soundPlayer.sound-player-v131.is-playing .sound-player-play,
html body #soundPlayer.sound-player-v131[data-playing="true"] #playPause,
html body #soundPlayer.sound-player-v131[data-playing="true"] .sound-player-play{
  background:transparent !important;
  border:1px solid rgba(255,255,255,.9) !important;
  color:#fff !important;
  box-shadow:none !important;
}

/* Volume branco no bloco Tocando */
html body #soundPlayer.sound-player-v131.is-playing #volume,
html body #soundPlayer.sound-player-v131[data-playing="true"] #volume{
  accent-color:#fff !important;
}
html body #soundPlayer.sound-player-v131.is-playing #volume::-webkit-slider-runnable-track,
html body #soundPlayer.sound-player-v131[data-playing="true"] #volume::-webkit-slider-runnable-track{
  background:rgba(255,255,255,.48) !important;
  height:3px !important;
  border-radius:99px !important;
}
html body #soundPlayer.sound-player-v131.is-playing #volume::-webkit-slider-thumb,
html body #soundPlayer.sound-player-v131[data-playing="true"] #volume::-webkit-slider-thumb{
  background:#fff !important;
}
html body #soundPlayer.sound-player-v131.is-playing #volume::-moz-range-track,
html body #soundPlayer.sound-player-v131[data-playing="true"] #volume::-moz-range-track{
  background:rgba(255,255,255,.48) !important;
}
html body #soundPlayer.sound-player-v131.is-playing #volume::-moz-range-thumb,
html body #soundPlayer.sound-player-v131[data-playing="true"] #volume::-moz-range-thumb{
  background:#fff !important;
  border-color:#fff !important;
}

/* Timers sobre degradê */
html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button,
html body #soundPlayer.sound-player-v131[data-playing="true"] .sound-timers-v131 button{
  background:rgba(255,255,255,.10) !important;
  border-color:rgba(255,255,255,.65) !important;
  color:#fff !important;
}
html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button.active,
html body #soundPlayer.sound-player-v131[data-playing="true"] .sound-timers-v131 button.active{
  background:#fff !important;
  border-color:#fff !important;
  color:#6b9eab !important;
}

/* MOBILE: volume mais curto para 15 / 30 / 60 / infinito caberem juntos */
@media(max-width:820px){
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:grid !important;
    grid-template-columns:minmax(72px,92px) minmax(0,1fr) !important;
    align-items:center !important;
    gap:7px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    width:92px !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:2px !important;
    font-size:8px !important;
  }

  html body #soundPlayer.sound-player-v131 #volume{
    width:88px !important;
    min-width:0 !important;
    max-width:88px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:3px !important;
    overflow:visible !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    min-width:0 !important;
    width:100% !important;
    height:27px !important;
    padding:0 3px !important;
    font-size:7.5px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"]{
    font-size:14px !important;
  }
}

@media(max-width:430px){
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    grid-template-columns:76px minmax(0,1fr) !important;
    gap:5px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    width:76px !important;
  }

  html body #soundPlayer.sound-player-v131 #volume{
    width:72px !important;
    max-width:72px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    font-size:7px !important;
    padding:0 2px !important;
  }
}


/* =========================================================
   V199 — Player de Sons estável
   - 28 plays em círculo degradê
   - "Tocando" permanece degradê mesmo pausado
   - ícone superior branco
   - volume branco sem bolinha duplicada
========================================================= */

/* Cards das músicas sempre brancos; play sempre em círculo degradê */
html body .sound-page-v130 .sound-tile,
html body .sound-page-v130 .sound-tile.is-playing{
  background:#fff !important;
  border:1px solid #edf0f2 !important;
  box-shadow:none !important;
}

html body .sound-page-v130 .sound-tile .play-sound,
html body .sound-page-v130 .sound-tile.is-playing .play-sound{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  border:0 !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  color:#fff !important;
  display:grid !important;
  place-items:center !important;
  box-shadow:none !important;
}

/* Depois que uma música é escolhida, o bloco "Tocando" fica degradê
   tanto em Play quanto em Pause. */
html body #soundPlayer.sound-player-v131.has-track{
  background:linear-gradient(135deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  color:#fff !important;
}

/* Textos realmente brancos */
html body #soundPlayer.sound-player-v131.has-track .player-copy small,
html body #soundPlayer.sound-player-v131.has-track .player-copy b,
html body #soundPlayer.sound-player-v131.has-track .player-copy span,
html body #soundPlayer.sound-player-v131.has-track .sound-volume-label,
html body #soundPlayer.sound-player-v131.has-track .sound-volume-label span{
  color:#fff !important;
}

/* Área do emoji: vira um ícone monocromático branco.
   Esconde o emoji colorido para não ficar "meio colorido". */
html body #soundPlayer.sound-player-v131.has-track .player-cover{
  position:relative !important;
  background:transparent !important;
  border:1px solid rgba(255,255,255,.92) !important;
  color:transparent !important;
  font-size:0 !important;
  overflow:hidden !important;
}
html body #soundPlayer.sound-player-v131.has-track .player-cover::before{
  content:"♪";
  color:#fff !important;
  font-size:21px !important;
  line-height:1 !important;
  font-weight:700 !important;
}

/* Play/Pause superior: sem fundo branco. Fica transparente no degradê. */
html body #soundPlayer.sound-player-v131.has-track #playPause,
html body #soundPlayer.sound-player-v131.has-track .sound-player-play,
html body #soundPlayer.sound-player-v131.has-track.is-playing #playPause,
html body #soundPlayer.sound-player-v131.has-track.is-playing .sound-player-play{
  background:transparent !important;
  border:1px solid rgba(255,255,255,.92) !important;
  color:#fff !important;
  box-shadow:none !important;
}

/* Timers transparentes e claros sobre o degradê */
html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button{
  background:rgba(255,255,255,.10) !important;
  border:1px solid rgba(255,255,255,.56) !important;
  color:#fff !important;
}
html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button.active{
  background:rgba(255,255,255,.22) !important;
  border-color:#fff !important;
  color:#fff !important;
}

/* RANGE: uma única trilha + uma única bolinha branca */
html body #soundPlayer.sound-player-v131.has-track #volume{
  -webkit-appearance:none !important;
  appearance:none !important;
  height:16px !important;
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  padding:0 !important;
  accent-color:#fff !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-runnable-track{
  height:3px !important;
  border:0 !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.62) !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:12px !important;
  height:12px !important;
  margin-top:-4.5px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-moz-range-track{
  height:3px !important;
  border:0 !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.62) !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-moz-range-progress{
  height:3px !important;
  border-radius:999px !important;
  background:#fff !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-moz-range-thumb{
  width:12px !important;
  height:12px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:none !important;
}

/* Mobile: volume curto, timers 15/30/60/∞ na mesma linha */
@media(max-width:820px){
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:grid !important;
    grid-template-columns:74px minmax(0,1fr) !important;
    gap:6px !important;
    align-items:center !important;
  }
  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    width:74px !important;
    min-width:74px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:1px !important;
    font-size:7.5px !important;
  }
  html body #soundPlayer.sound-player-v131 #volume{
    width:70px !important;
    min-width:70px !important;
    max-width:70px !important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:3px !important;
    overflow:visible !important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    width:100% !important;
    min-width:0 !important;
    height:27px !important;
    padding:0 2px !important;
    font-size:7px !important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"]{
    font-size:14px !important;
  }
}


/* =========================================================
   V200 — Sons: player superior branco + emoji original
   Mobile: volume maior, timers alinhados à direita
========================================================= */

/* Player superior fica branco no desktop e mobile, tocando ou pausado */
html body #soundPlayer.sound-player-v131,
html body #soundPlayer.sound-player-v131.has-track,
html body #soundPlayer.sound-player-v131.is-playing,
html body #soundPlayer.sound-player-v131.has-track.is-playing{
  background:#fff !important;
  border:1px solid #e7ebee !important;
  outline:0 !important;
  box-shadow:none !important;
  color:#1f2429 !important;
}

/* Volta com o emoji real do som */
html body #soundPlayer.sound-player-v131 .player-cover,
html body #soundPlayer.sound-player-v131.has-track .player-cover,
html body #soundPlayer.sound-player-v131.is-playing .player-cover{
  background:#f5f7f8 !important;
  border:0 !important;
  color:inherit !important;
  font-size:20px !important;
  overflow:visible !important;
}
html body #soundPlayer.sound-player-v131 .player-cover::before,
html body #soundPlayer.sound-player-v131.has-track .player-cover::before{
  content:none !important;
  display:none !important;
}

/* Textos do player superior voltam ao padrão escuro */
html body #soundPlayer.sound-player-v131 .player-copy small,
html body #soundPlayer.sound-player-v131.has-track .player-copy small{
  color:#9aa1a9 !important;
}
html body #soundPlayer.sound-player-v131 .player-copy b,
html body #soundPlayer.sound-player-v131.has-track .player-copy b{
  color:#1f2429 !important;
}
html body #soundPlayer.sound-player-v131 .player-copy span,
html body #soundPlayer.sound-player-v131.has-track .player-copy span{
  color:#89919a !important;
}
html body #soundPlayer.sound-player-v131 .sound-volume-label,
html body #soundPlayer.sound-player-v131.has-track .sound-volume-label,
html body #soundPlayer.sound-player-v131 .sound-volume-label span,
html body #soundPlayer.sound-player-v131.has-track .sound-volume-label span{
  color:#7d858e !important;
}

/* Botão principal continua elegante em degradê */
html body #soundPlayer.sound-player-v131 #playPause,
html body #soundPlayer.sound-player-v131 .sound-player-play,
html body #soundPlayer.sound-player-v131.has-track #playPause,
html body #soundPlayer.sound-player-v131.has-track .sound-player-play{
  background:linear-gradient(135deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  border:0 !important;
  color:#fff !important;
  box-shadow:none !important;
}

/* Timers em fundo branco */
html body #soundPlayer.sound-player-v131 .sound-timers-v131 button,
html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button{
  background:#fff !important;
  border:1px solid #e1e5e8 !important;
  color:#68717a !important;
}
html body #soundPlayer.sound-player-v131 .sound-timers-v131 button.active,
html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button.active{
  background:#eef7f9 !important;
  border-color:#b9dce5 !important;
  color:#39798a !important;
}

/* Volume volta ao padrão do site, sem conflito branco */
html body #soundPlayer.sound-player-v131 #volume,
html body #soundPlayer.sound-player-v131.has-track #volume{
  accent-color:#6DB2C8 !important;
}
html body #soundPlayer.sound-player-v131 #volume::-webkit-slider-runnable-track,
html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-runnable-track{
  height:3px !important;
  background:#dde4e8 !important;
  border-radius:999px !important;
}
html body #soundPlayer.sound-player-v131 #volume::-webkit-slider-thumb,
html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:13px !important;
  height:13px !important;
  margin-top:-5px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#6DB2C8 !important;
  box-shadow:none !important;
}

/* MOBILE */
@media(max-width:820px){

  html body #soundPlayer.sound-player-v131{
    padding:12px !important;
    gap:12px !important;
  }

  /* controles em uma linha: volume mais largo à esquerda, timers à direita */
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    margin-top:2px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:118px !important;
    max-width:155px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
    font-size:8px !important;
    margin:0 !important;
    padding-top:2px !important;
  }

  /* volume maior e um pouco mais baixo */
  html body #soundPlayer.sound-player-v131 #volume{
    width:100% !important;
    min-width:118px !important;
    max-width:155px !important;
    height:18px !important;
    margin:2px 0 0 !important;
  }

  /* timers encostados à direita */
  html body #soundPlayer.sound-player-v131 .sound-timers-v131{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:3px !important;
    margin-left:auto !important;
    overflow:visible !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:34px !important;
    height:27px !important;
    padding:0 5px !important;
    font-size:7px !important;
    white-space:nowrap !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"]{
    min-width:29px !important;
    padding:0 5px !important;
    font-size:14px !important;
  }
}

@media(max-width:430px){
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    gap:7px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    min-width:108px !important;
    max-width:130px !important;
  }

  html body #soundPlayer.sound-player-v131 #volume{
    min-width:108px !important;
    max-width:130px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    min-width:31px !important;
    padding:0 4px !important;
    font-size:6.8px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"]{
    min-width:27px !important;
  }
}


/* =========================================================
   V201 — Tocando em degradê; branco SOMENTE na área do emoji
========================================================= */

/* O bloco superior inteiro volta ao degradê depois de escolher um som */
html body #soundPlayer.sound-player-v131.has-track,
html body #soundPlayer.sound-player-v131.has-track.is-playing{
  background:linear-gradient(135deg,#6DB2C8 0%,#ED9D9C 100%) !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  color:#fff !important;
}

/* Branco SOMENTE onde fica o emoji */
html body #soundPlayer.sound-player-v131.has-track .player-cover{
  background:#fff !important;
  border:0 !important;
  color:inherit !important;
  font-size:20px !important;
  box-shadow:none !important;
}
html body #soundPlayer.sound-player-v131.has-track .player-cover::before{
  content:none !important;
  display:none !important;
}

/* Textos brancos sobre o degradê */
html body #soundPlayer.sound-player-v131.has-track .player-copy small,
html body #soundPlayer.sound-player-v131.has-track .player-copy b,
html body #soundPlayer.sound-player-v131.has-track .player-copy span,
html body #soundPlayer.sound-player-v131.has-track .sound-volume-label,
html body #soundPlayer.sound-player-v131.has-track .sound-volume-label span{
  color:#fff !important;
}

/* Play/Pause sem fundo próprio: usa o degradê do bloco */
html body #soundPlayer.sound-player-v131.has-track #playPause,
html body #soundPlayer.sound-player-v131.has-track .sound-player-play,
html body #soundPlayer.sound-player-v131.has-track.is-playing #playPause,
html body #soundPlayer.sound-player-v131.has-track.is-playing .sound-player-play{
  background:transparent !important;
  border:1px solid rgba(255,255,255,.9) !important;
  color:#fff !important;
  box-shadow:none !important;
}

/* Volume branco */
html body #soundPlayer.sound-player-v131.has-track #volume{
  -webkit-appearance:none !important;
  appearance:none !important;
  background:transparent !important;
  accent-color:#fff !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-runnable-track{
  height:3px !important;
  background:rgba(255,255,255,.58) !important;
  border-radius:999px !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:13px !important;
  height:13px !important;
  margin-top:-5px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-moz-range-track{
  height:3px !important;
  background:rgba(255,255,255,.58) !important;
  border-radius:999px !important;
}
html body #soundPlayer.sound-player-v131.has-track #volume::-moz-range-thumb{
  width:13px !important;
  height:13px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#fff !important;
}

/* Timers legíveis sobre o degradê */
html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button{
  background:rgba(255,255,255,.10) !important;
  border:1px solid rgba(255,255,255,.58) !important;
  color:#fff !important;
}
html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button.active{
  background:rgba(255,255,255,.24) !important;
  border-color:#fff !important;
  color:#fff !important;
}

/* Mantém o ajuste da V200 no mobile:
   volume maior à esquerda e timers agrupados à direita */
@media(max-width:820px){
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    margin-top:4px !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:118px !important;
    max-width:155px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
    margin:0 !important;
  }

  html body #soundPlayer.sound-player-v131 #volume{
    width:100% !important;
    min-width:118px !important;
    max-width:155px !important;
    height:18px !important;
    margin:2px 0 0 !important;
  }

  html body #soundPlayer.sound-player-v131 .sound-timers-v131{
    flex:0 0 auto !important;
    width:auto !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:3px !important;
    margin-left:auto !important;
    overflow:visible !important;
  }
}


/* =========================================================
   V204 — Menu mobile: ícones NanaBot/Choro + Perfil padronizado
========================================================= */

/* Ícones extras aparecem somente no menu mobile */
.mobile-nav-icon-v207{
  display:none;
}

@media(max-width:820px){
  #sidebar nav a.mobile-menu-special-v207{
    display:flex !important;
    align-items:center !important;
    gap:11px !important;
  }

  #sidebar nav a.mobile-menu-special-v207 .mobile-nav-icon-v207{
    flex:0 0 32px !important;
    width:32px !important;
    height:32px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:10px !important;
    background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
    border:1px solid #e2e7ea !important;
    color:#567c85 !important;
  }

  #sidebar nav a.mobile-menu-special-v207 .mobile-nav-label-v207{
    display:block !important;
    min-width:0 !important;
  }

  /* NanaBot: exatamente o mesmo robozinho visual usado no chat */
  #sidebar .mobile-nav-nana-v207 .robot-face{
    width:19px !important;
    height:15px !important;
    border:1.6px solid #567c85 !important;
    border-radius:5px !important;
  }

  #sidebar .mobile-nav-nana-v207 .robot-face:before{
    height:4px !important;
    top:-5px !important;
  }

  #sidebar .mobile-nav-nana-v207 .robot-face:after{
    width:3.5px !important;
    height:3.5px !important;
    top:-7px !important;
  }

  /* Choro: ícone minimalista de gravação/microfone */
  #sidebar .mobile-nav-cry-v207 svg{
    width:19px !important;
    height:19px !important;
    fill:none !important;
    stroke:#567c85 !important;
    stroke-width:1.7 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
  }

  /* Mantém o risco ativo alinhado com o texto, não embaixo do ícone */
  #sidebar nav a.mobile-menu-special-v207.active::after{
    left:53px !important;
  }
}

/* Perfil: mesma separação vertical dos demais cards */
.profile-page-wide .profile-password-v179,
.profile-page-wide .profile-help-v177{
  margin-top:0 !important;
  margin-bottom:14px !important;
}

@media(max-width:820px){
  .profile-page-wide .profile-password-v179,
  .profile-page-wide .profile-help-v177{
    margin-top:0 !important;
    margin-bottom:14px !important;
  }
}


/* =========================================================
   V205 — Menu mobile: ícones realmente visíveis
   NanaBot = robô da NanaBot
   Choro = círculo de gravação
========================================================= */
@media(max-width:820px){

  #sidebar nav a.mobile-menu-special-v207{
    display:grid !important;
    grid-template-columns:32px minmax(0,1fr) !important;
    align-items:center !important;
    column-gap:11px !important;
  }

  #sidebar nav a.mobile-menu-special-v207 > .mobile-nav-icon-v207{
    display:grid !important;
    visibility:visible !important;
    opacity:1 !important;
    position:relative !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    margin:0 !important;
    place-items:center !important;
  }

  /* NanaBot — mesmo rosto do robô */
  #sidebar .mobile-nav-nana-v207{
    background:linear-gradient(135deg,#edf7fa,#fdf1f2) !important;
    border:1px solid #e2e7ea !important;
    border-radius:10px !important;
  }

  #sidebar .mobile-nav-nana-v207 .robot-face{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }

  /* Choro — botão circular de gravação, como na tela de Análise de Choro */
  #sidebar .mobile-nav-cry-v207{
    background:transparent !important;
    border:0 !important;
    border-radius:50% !important;
  }

  /* esconde o microfone anterior */
  #sidebar .mobile-nav-cry-v207 svg{
    display:none !important;
  }

  /* círculo vermelho externo */
  #sidebar .mobile-nav-cry-v207::before{
    content:"" !important;
    display:block !important;
    width:30px !important;
    height:30px !important;
    border-radius:50% !important;
    background:#ef6f72 !important;
    box-shadow:0 4px 12px rgba(239,111,114,.16) !important;
  }

  /* bolinha branca central de gravar */
  #sidebar .mobile-nav-cry-v207::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:10px !important;
    height:10px !important;
    transform:translate(-50%,-50%) !important;
    border-radius:50% !important;
    background:#fff !important;
  }

  #sidebar nav a.mobile-menu-special-v207.active::after{
    left:53px !important;
  }
}


/* =========================================================
   V206 — Menu mobile completo com ícones + bottom NanaBot/Choro
========================================================= */

/* Desktop: mantém o menu como era, sem mostrar os ícones extras */
.mobile-nav-icon-v207{
  display:none;
}

@media(max-width:820px){
  #sidebar nav a.mobile-menu-item-v207{
    display:grid !important;
    grid-template-columns:32px minmax(0,1fr) !important;
    align-items:center !important;
    gap:11px !important;
    min-height:48px !important;
  }

  #sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207{
    display:grid !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    place-items:center !important;
    border-radius:10px !important;
    background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
    border:1px solid #e2e7ea !important;
    color:#567c85 !important;
  }

  #sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207 svg{
    width:18px !important;
    height:18px !important;
    fill:none !important;
    stroke:#567c85 !important;
    stroke-width:1.65 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
  }

  /* NanaBot: mesmo robozinho usado no chat */
  #sidebar .mobile-nav-nana-v207 .robot-face{
    display:flex !important;
    width:19px !important;
    height:15px !important;
    border:1.6px solid #567c85 !important;
    border-radius:5px !important;
  }
  #sidebar .mobile-nav-nana-v207 .robot-face:before{
    height:4px !important;
    top:-5px !important;
  }
  #sidebar .mobile-nav-nana-v207 .robot-face:after{
    width:3.5px !important;
    height:3.5px !important;
    top:-7px !important;
  }

  /* Choro: círculo de gravação */
  #sidebar .mobile-nav-cry-v207{
    position:relative !important;
    border-radius:50% !important;
    border:0 !important;
    background:transparent !important;
  }
  #sidebar .mobile-nav-cry-v207::before{
    content:"" !important;
    width:30px !important;
    height:30px !important;
    border-radius:50% !important;
    background:#ef6f72 !important;
    box-shadow:0 4px 12px rgba(239,111,114,.16) !important;
  }
  #sidebar .mobile-nav-cry-v207::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:10px !important;
    height:10px !important;
    transform:translate(-50%,-50%) !important;
    border-radius:50% !important;
    background:#fff !important;
  }

  /* Item ativo continua alinhado com o texto */
  #sidebar nav a.mobile-menu-item-v207.active::after{
    left:53px !important;
  }

  /* Bottom nav: NanaBot com o robô verdadeiro */
  .bottom-nav .bottom-nana-icon-v207{
    width:24px !important;
    height:24px !important;
    display:grid !important;
    place-items:center !important;
    position:relative !important;
  }
  .bottom-nav .bottom-nana-icon-v207 .robot-face{
    width:18px !important;
    height:14px !important;
    border:1.6px solid currentColor !important;
    border-radius:5px !important;
  }
  .bottom-nav .bottom-nana-icon-v207 .robot-face:before{
    background:currentColor !important;
    height:4px !important;
    top:-5px !important;
  }
  .bottom-nav .bottom-nana-icon-v207 .robot-face:after{
    background:currentColor !important;
    width:3px !important;
    height:3px !important;
    top:-7px !important;
  }
  .bottom-nav .bottom-nana-icon-v207 .robot-face i{
    background:currentColor !important;
  }

  /* Bottom nav: Choro como botão circular de gravação */
  .bottom-nav .bottom-cry-icon-v207{
    width:24px !important;
    height:24px !important;
    display:grid !important;
    place-items:center !important;
    position:relative !important;
  }
  .bottom-nav .bottom-cry-icon-v207::before{
    content:"" !important;
    width:20px !important;
    height:20px !important;
    border-radius:50% !important;
    background:#ef6f72 !important;
  }
  .bottom-nav .bottom-cry-icon-v207::after{
    content:"" !important;
    position:absolute !important;
    width:7px !important;
    height:7px !important;
    border-radius:50% !important;
    background:#fff !important;
  }

  .bottom-nav a.active.bottom-cry-v207 .bottom-cry-icon-v207::before{
    box-shadow:0 0 0 3px rgba(239,111,114,.12) !important;
  }
}


/* =========================================================
   V207 — Ícones consistentes no desktop e mobile
   NanaBot e Choro preservam o estilo aprovado
========================================================= */

/* Todos os itens do menu lateral usam ícone + texto, desktop e mobile */
#sidebar nav a.mobile-menu-item-v207{
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  align-items:center !important;
  gap:11px !important;
}

#sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207{
  display:grid !important;
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  place-items:center !important;
  border-radius:10px !important;
  background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
  border:1px solid #e2e7ea !important;
  color:#567c85 !important;
}

#sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207 svg{
  display:block !important;
  width:18px !important;
  height:18px !important;
  fill:none !important;
  stroke:#567c85 !important;
  stroke-width:1.65 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

/* Plano e Perfil: garante que o SVG apareça */
#sidebar .mobile-nav-plan-v207 svg,
#sidebar .mobile-nav-profile-v207 svg{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

/* NanaBot — volta exatamente ao visual do robozinho */
#sidebar .mobile-nav-nana-v207{
  background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
  border:1px solid #e2e7ea !important;
  border-radius:10px !important;
}
#sidebar .mobile-nav-nana-v207 .robot-face{
  display:flex !important;
  width:19px !important;
  height:15px !important;
  border:1.6px solid #567c85 !important;
  border-radius:5px !important;
  color:#567c85 !important;
}
#sidebar .mobile-nav-nana-v207 .robot-face:before{
  height:4px !important;
  top:-5px !important;
  background:#567c85 !important;
}
#sidebar .mobile-nav-nana-v207 .robot-face:after{
  width:3.5px !important;
  height:3.5px !important;
  top:-7px !important;
  background:#567c85 !important;
}
#sidebar .mobile-nav-nana-v207 .robot-face i{
  background:#567c85 !important;
}

/* Choro — mantém o círculo vermelho aprovado */
#sidebar .mobile-nav-cry-v207{
  position:relative !important;
  border-radius:50% !important;
  border:0 !important;
  background:transparent !important;
}
#sidebar .mobile-nav-cry-v207::before{
  content:"" !important;
  display:block !important;
  width:30px !important;
  height:30px !important;
  border-radius:50% !important;
  background:#ef6f72 !important;
  box-shadow:0 4px 12px rgba(239,111,114,.16) !important;
}
#sidebar .mobile-nav-cry-v207::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:10px !important;
  height:10px !important;
  transform:translate(-50%,-50%) !important;
  border-radius:50% !important;
  background:#fff !important;
}

/* Desktop: um pouco mais compacto para não pesar */
@media(min-width:821px){
  #sidebar nav a.mobile-menu-item-v207{
    min-height:46px !important;
    padding:7px 10px !important;
  }

  #sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
  }

  #sidebar .mobile-nav-cry-v207::before{
    width:28px !important;
    height:28px !important;
  }
  #sidebar .mobile-nav-cry-v207::after{
    width:9px !important;
    height:9px !important;
  }
}

/* Mobile mantém o tamanho que ficou legal */
@media(max-width:820px){
  #sidebar nav a.mobile-menu-item-v207{
    min-height:48px !important;
  }
}


/* =========================================================
   V208 — Menu lateral realmente padronizado
========================================================= */

/* Todos os itens: mesma caixa de ícone e mesmo espaçamento */
#sidebar nav a.mobile-menu-item-v207{
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) !important;
  align-items:center !important;
  column-gap:13px !important;
}

#sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
}

/* SVGs comuns todos no mesmo tamanho visual */
#sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207 svg{
  width:18px !important;
  height:18px !important;
}

/* NanaBot no MESMO tamanho dos demais */
#sidebar .mobile-nav-nana-v207 .robot-face{
  width:18px !important;
  height:14px !important;
  min-width:18px !important;
  min-height:14px !important;
  border-width:1.5px !important;
  border-radius:5px !important;
}

/* Choro: círculo de gravação clean e do mesmo tamanho da caixa */
#sidebar .mobile-nav-cry-v207{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  position:relative !important;
  border-radius:10px !important;
  background:linear-gradient(135deg,#fff1f2 0%,#fdf4f4 100%) !important;
  border:1px solid #f1dfe1 !important;
}
#sidebar .mobile-nav-cry-v207::before{
  width:18px !important;
  height:18px !important;
  border-radius:50% !important;
  background:#ef6f72 !important;
  box-shadow:none !important;
}
#sidebar .mobile-nav-cry-v207::after{
  width:6px !important;
  height:6px !important;
  background:#fff !important;
}

/* Desktop: afasta ícones dos escritos e mantém tudo alinhado */
@media(min-width:821px){
  #sidebar nav a.mobile-menu-item-v207{
    grid-template-columns:32px minmax(0,1fr) !important;
    column-gap:14px !important;
    min-height:48px !important;
    padding:8px 10px !important;
  }

  #sidebar nav a.mobile-menu-item-v207 .mobile-nav-icon-v207{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
  }
}

/* Mobile: mesma escala, sem NanaBot/Choro maiores que os outros */
@media(max-width:820px){
  #sidebar nav a.mobile-menu-item-v207{
    grid-template-columns:32px minmax(0,1fr) !important;
    column-gap:12px !important;
    min-height:48px !important;
  }
}

#sidebar nav a.mobile-menu-item-v206{column-gap:13px !important}
@media(min-width:821px){#sidebar nav a.mobile-menu-item-v206{column-gap:14px !important}}


/* =========================================================
   V209 — Menu mobile/desktop final + avatar do Olá corrigido
========================================================= */

/* -------- MENU LATERAL: todos com a mesma cor -------- */
#sidebar .mobile-nav-cry-v207,
#sidebar .mobile-nav-cry-v206{
  background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
  border:1px solid #e2e7ea !important;
  border-radius:10px !important;
  color:#567c85 !important;
}

/* Choro deixa de ser vermelho e vira gravação na mesma cor dos demais */
#sidebar .mobile-nav-cry-v207::before,
#sidebar .mobile-nav-cry-v206::before{
  width:18px !important;
  height:18px !important;
  border-radius:50% !important;
  background:#567c85 !important;
  box-shadow:none !important;
}
#sidebar .mobile-nav-cry-v207::after,
#sidebar .mobile-nav-cry-v206::after{
  width:6px !important;
  height:6px !important;
  background:#fff !important;
}

/* NanaBot exatamente na mesma caixa dos outros */
#sidebar .mobile-nav-nana-v207,
#sidebar .mobile-nav-nana-v206{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
}

/* Robô centralizado e mesmo tamanho visual */
#sidebar .mobile-nav-nana-v207 .robot-face,
#sidebar .mobile-nav-nana-v206 .robot-face{
  width:18px !important;
  height:14px !important;
  margin:1px 0 0 !important;
  transform:none !important;
}

/* No mobile, baixa um pouquinho o robô sem aumentar o botão */
@media(max-width:820px){
  #sidebar .mobile-nav-nana-v207 .robot-face,
  #sidebar .mobile-nav-nana-v206 .robot-face{
    margin-top:3px !important;
  }
}

/* -------- MENU DE BAIXO: igual ao menu de cima -------- */

/* NanaBot inferior usa a mesma caixinha suave + robô */
.bottom-nav .bottom-nana-icon-v207,
.bottom-nav .bottom-nana-icon-v206{
  width:26px !important;
  height:26px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:8px !important;
  background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
  border:1px solid #e2e7ea !important;
  color:#567c85 !important;
}
.bottom-nav .bottom-nana-icon-v207 .robot-face,
.bottom-nav .bottom-nana-icon-v206 .robot-face{
  width:16px !important;
  height:13px !important;
  border:1.5px solid #567c85 !important;
  border-radius:5px !important;
  color:#567c85 !important;
}
.bottom-nav .bottom-nana-icon-v207 .robot-face:before,
.bottom-nav .bottom-nana-icon-v206 .robot-face:before,
.bottom-nav .bottom-nana-icon-v207 .robot-face:after,
.bottom-nav .bottom-nana-icon-v206 .robot-face:after,
.bottom-nav .bottom-nana-icon-v207 .robot-face i,
.bottom-nav .bottom-nana-icon-v206 .robot-face i{
  background:#567c85 !important;
}

/* Choro inferior na MESMA cor dos demais, sem vermelho */
.bottom-nav .bottom-cry-icon-v207,
.bottom-nav .bottom-cry-icon-v206{
  width:26px !important;
  height:26px !important;
  display:grid !important;
  place-items:center !important;
  position:relative !important;
  border-radius:8px !important;
  background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
  border:1px solid #e2e7ea !important;
}
.bottom-nav .bottom-cry-icon-v207::before,
.bottom-nav .bottom-cry-icon-v206::before{
  content:"" !important;
  width:16px !important;
  height:16px !important;
  border-radius:50% !important;
  background:#567c85 !important;
  box-shadow:none !important;
}
.bottom-nav .bottom-cry-icon-v207::after,
.bottom-nav .bottom-cry-icon-v206::after{
  content:"" !important;
  position:absolute !important;
  width:5px !important;
  height:5px !important;
  border-radius:50% !important;
  background:#fff !important;
}

/* -------- AVATAR "OLÁ" MOBILE -------- */
.welcome-avatar{
  position:relative !important;
  overflow:hidden !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  text-align:center !important;
  line-height:1 !important;
}

.welcome-avatar > img,
.welcome-avatar .profile-avatar-img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:50% !important;
}

.welcome-avatar .profile-avatar-fallback{
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  text-align:center !important;
  line-height:1 !important;
  font-size:18px !important;
  font-weight:700 !important;
}

@media(max-width:820px){
  .welcome-person{
    align-items:center !important;
  }

  .welcome-avatar{
    flex:0 0 54px !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    border-radius:50% !important;
  }

  .welcome-avatar > img,
  .welcome-avatar .profile-avatar-img{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    object-fit:cover !important;
    object-position:50% 50% !important;
  }

  .welcome-avatar .profile-avatar-fallback{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    display:grid !important;
    place-items:center !important;
    transform:none !important;
    font-size:17px !important;
  }
}


/* =========================================================
   V210 — Bottom nav padronizado igual ao menu de cima
========================================================= */
@media(max-width:820px){

  .bottom-nav.bottom-nav-v210 a{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-menu-icon-v210{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    min-height:28px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:8px !important;
    background:linear-gradient(135deg,#edf7fa 0%,#fdf1f2 100%) !important;
    border:1px solid #e2e7ea !important;
    color:#567c85 !important;
    position:relative !important;
    box-sizing:border-box !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-menu-icon-v210 svg{
    width:17px !important;
    height:17px !important;
    display:block !important;
    fill:none !important;
    stroke:#567c85 !important;
    stroke-width:1.65 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
  }

  /* NanaBot de baixo: mesmo robozinho do menu de cima */
  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face{
    display:flex !important;
    width:18px !important;
    height:14px !important;
    border:1.5px solid #567c85 !important;
    border-radius:5px !important;
    color:#567c85 !important;
    position:relative !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    margin-top:2px !important;
    box-sizing:border-box !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face:before{
    content:"" !important;
    position:absolute !important;
    width:1.5px !important;
    height:4px !important;
    background:#567c85 !important;
    top:-5px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face:after{
    content:"" !important;
    position:absolute !important;
    width:3.5px !important;
    height:3.5px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    top:-7px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face i{
    width:3px !important;
    height:3px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    display:block !important;
  }

  /* Choro de baixo: mesma paleta dos demais */
  .bottom-nav.bottom-nav-v210 .bottom-cry-v210::before{
    content:"" !important;
    width:16px !important;
    height:16px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    display:block !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-cry-v210::after{
    content:"" !important;
    position:absolute !important;
    width:5px !important;
    height:5px !important;
    border-radius:50% !important;
    background:#fff !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-50%,-50%) !important;
  }

  /* Item ativo preserva a mesma paleta, sem trocar o desenho */
  .bottom-nav.bottom-nav-v210 a.active .bottom-menu-icon-v210{
    border-color:#cbdfe5 !important;
    background:linear-gradient(135deg,#e7f4f7 0%,#f9ecee 100%) !important;
  }
}


/* =========================================================
   V211 — NanaBot bottom idêntico ao topo + sidebar desktop maior
========================================================= */

/* NanaBot inferior: cópia visual fiel do robô do menu superior, com antena */
@media(max-width:820px){
  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210{
    overflow:visible !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face{
    width:18px !important;
    height:14px !important;
    min-width:18px !important;
    min-height:14px !important;
    border:1.5px solid #567c85 !important;
    border-radius:5px !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    margin-top:3px !important;
    overflow:visible !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face::before{
    content:"" !important;
    position:absolute !important;
    width:1.5px !important;
    height:4px !important;
    background:#567c85 !important;
    top:-5px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    border-radius:2px !important;
    display:block !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face::after{
    content:"" !important;
    position:absolute !important;
    width:3.5px !important;
    height:3.5px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    top:-7px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    display:block !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face i{
    width:3px !important;
    height:3px !important;
    min-width:3px !important;
    min-height:3px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    display:block !important;
  }

  /* Confirma avatar do "Olá" centralizado no mobile */
  .welcome-avatar{
    display:grid !important;
    place-items:center !important;
    overflow:hidden !important;
    border-radius:50% !important;
  }

  .welcome-avatar > img,
  .welcome-avatar .profile-avatar-img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
    margin:0 !important;
    transform:none !important;
  }

  .welcome-avatar .profile-avatar-fallback{
    width:100% !important;
    height:100% !important;
    display:grid !important;
    place-items:center !important;
    text-align:center !important;
    line-height:1 !important;
    margin:0 !important;
    transform:none !important;
  }
}

/* Desktop: menu lateral um pouco mais largo e com mais respiro */
@media(min-width:821px){
  :root{
    --side:240px !important;
  }

  .sidebar{
    width:240px !important;
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .main{
    margin-left:240px !important;
  }

  #sidebar nav a.mobile-menu-item-v207{
    grid-template-columns:32px minmax(0,1fr) !important;
    column-gap:16px !important;
    padding-left:11px !important;
    padding-right:11px !important;
  }
}


/* =========================================================
   V212 FINAL — Sidebar desktop + avatar "Olá" mobile
========================================================= */

/* Desktop: menu lateral um pouco mais largo */
@media(min-width:821px){
  :root{
    --side:260px !important;
  }

  .sidebar{
    width:260px !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }

  .main{
    margin-left:260px !important;
  }

  #sidebar nav a.mobile-menu-item-v207{
    column-gap:17px !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }
}

/* Mobile: centralização absoluta do avatar/letra do "Olá" */
@media(max-width:820px){
  .welcome-avatar{
    position:relative !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    padding:0 !important;
    margin:0 !important;
    overflow:hidden !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    line-height:1 !important;
  }

  .welcome-avatar > img,
  .welcome-avatar .profile-avatar-img{
    position:absolute !important;
    inset:0 !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    max-width:54px !important;
    max-height:54px !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:cover !important;
    object-position:50% 50% !important;
    transform:none !important;
    border-radius:50% !important;
  }

  .welcome-avatar .profile-avatar-fallback{
    position:absolute !important;
    inset:0 !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    line-height:54px !important;
    font-size:17px !important;
    font-weight:700 !important;
    transform:none !important;
    text-indent:0 !important;
  }
}




/* =========================================================
   V230 — Favoritos dos Sons para Dormir
========================================================= */
.sounds-premium-shell:not(.sound-premium-locked) .sound-tile .fav{
  position:absolute !important;
  z-index:30 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}

.sounds-premium-shell:not(.sound-premium-locked) .sound-tile .fav:disabled{
  opacity:.55 !important;
  cursor:wait !important;
}




/* =========================================================
   V232 — Menu desktop final: recolher + Sair vermelho alinhado
========================================================= */
.desktop-sidebar-toggle-v232{display:none;}

@media(min-width:821px){

  html,body,.app{
    width:100% !important;
    max-width:none !important;
  }

  body{overflow-x:hidden !important;}

  /* MENU ABERTO */
  .sidebar{
    width:260px !important;
    min-width:260px !important;
    max-width:260px !important;
    padding-left:18px !important;
    padding-right:18px !important;
    overflow:visible !important;
    border-right:0 !important;
    box-shadow:8px 0 0 #fff !important;
  }

  .main{
    margin-left:260px !important;
    width:calc(100% - 260px) !important;
    max-width:none !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  /* SETA */
  .desktop-sidebar-toggle-v232{
    display:grid !important;
    place-items:center !important;
    position:absolute !important;
    top:86px !important;
    right:-13px !important;
    width:26px !important;
    height:26px !important;
    min-width:26px !important;
    min-height:26px !important;
    max-width:26px !important;
    max-height:26px !important;
    padding:0 !important;
    margin:0 !important;
    border:1px solid #e2e6e9 !important;
    border-radius:50% !important;
    background:#fff !important;
    box-shadow:0 3px 10px rgba(20,27,33,.08) !important;
    z-index:100 !important;
    cursor:pointer !important;
    appearance:none !important;
  }

  .desktop-sidebar-toggle-v232 > span{
    display:block !important;
    width:7px !important;
    height:7px !important;
    border-left:1.5px solid #66727c !important;
    border-bottom:1.5px solid #66727c !important;
    transform:rotate(45deg) !important;
    margin-left:3px !important;
  }

  /* MENU RECOLHIDO */
  html.sidebar-collapsed-v232 .sidebar{
    width:82px !important;
    min-width:82px !important;
    max-width:82px !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }

  html.sidebar-collapsed-v232 .main{
    margin-left:82px !important;
    width:calc(100% - 82px) !important;
    max-width:none !important;
    min-width:0 !important;
  }

  html.sidebar-collapsed-v232 .desktop-sidebar-toggle-v232 > span{
    transform:rotate(225deg) !important;
    margin-left:-3px !important;
  }

  /* Itens comuns: apenas esconde texto; não altera tamanho dos ícones */
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207{
    grid-template-columns:32px !important;
    column-gap:0 !important;
    justify-content:center !important;
    justify-items:center !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207 > span:last-child{
    display:none !important;
  }

  html.sidebar-collapsed-v232 .sidebar .brand{
    justify-content:center !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  /* SAIR — MESMO ALINHAMENTO DOS OUTROS ITENS */
  #sidebar .logout-v232{
    display:grid !important;
    grid-template-columns:32px minmax(0,1fr) !important;
    align-items:center !important;
    column-gap:17px !important;
    width:100% !important;
    min-height:48px !important;
    margin-top:auto !important;
    padding:8px 12px !important;
    border:0 !important;
    border-radius:10px !important;
    background:transparent !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
    color:#d94c4c !important;
    font-size:14px !important;
    font-weight:600 !important;
  }

  #sidebar .logout-v232:hover{
    background:#fff4f4 !important;
  }

  #sidebar .logout-menu-icon-v232{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:10px !important;
    background:#fff1f1 !important;
    border:1px solid #f2caca !important;
    color:#d94c4c !important;
  }

  #sidebar .logout-menu-icon-v232 svg{
    width:18px !important;
    height:18px !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.7 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
  }

  #sidebar .logout-menu-label-v232{
    display:block !important;
    color:#d94c4c !important;
  }

  html.sidebar-collapsed-v232 #sidebar .logout-v232{
    width:100% !important;
    grid-template-columns:32px !important;
    column-gap:0 !important;
    justify-content:center !important;
    justify-items:center !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  html.sidebar-collapsed-v232 #sidebar .logout-menu-label-v232{
    display:none !important;
  }
}


/* =========================================================
   V234 — Estado recolhido limpo e alinhado
   Base V232 (descarta ajustes da V233)
========================================================= */
@media(min-width:821px){

  /* Toggle minimalista na borda */
  .desktop-sidebar-toggle-v232{
    top:88px !important;
    right:-12px !important;
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    min-height:24px !important;
    max-width:24px !important;
    max-height:24px !important;
    padding:0 !important;
    border:1px solid #e5e8eb !important;
    border-radius:50% !important;
    background:#fff !important;
    box-shadow:0 2px 8px rgba(20,27,33,.07) !important;
  }

  .desktop-sidebar-toggle-v232 > span{
    width:6px !important;
    height:6px !important;
    border-left:1.4px solid #7b858e !important;
    border-bottom:1.4px solid #7b858e !important;
    margin-left:2px !important;
  }

  html.sidebar-collapsed-v232 .desktop-sidebar-toggle-v232 > span{
    margin-left:-2px !important;
  }

  /* Sidebar recolhida */
  html.sidebar-collapsed-v232 .sidebar{
    width:82px !important;
    min-width:82px !important;
    max-width:82px !important;
    padding-left:10px !important;
    padding-right:10px !important;
    align-items:stretch !important;
  }

  html.sidebar-collapsed-v232 #sidebar nav{
    width:100% !important;
    display:grid !important;
    gap:3px !important;
  }

  /* Todos os itens usam exatamente a mesma coluna central */
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207{
    position:relative !important;
    width:100% !important;
    min-height:48px !important;
    padding:8px 0 !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:32px !important;
    justify-content:center !important;
    justify-items:center !important;
    align-items:center !important;
    column-gap:0 !important;
    box-sizing:border-box !important;
    border-radius:10px !important;
  }

  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207 > span:last-child{
    display:none !important;
  }

  /* Remove o risco preto deslocado no modo recolhido */
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207::before,
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207::after{
    content:none !important;
    display:none !important;
  }

  /* Ativo fica apenas com fundo suave */
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207.active{
    background:var(--blue-soft) !important;
  }

  /* Logo não muda de tamanho, apenas centraliza */
  html.sidebar-collapsed-v232 .sidebar .brand{
    justify-content:center !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  /* Sair exatamente na mesma coluna e largura dos itens */
  html.sidebar-collapsed-v232 #sidebar .logout-v232{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:48px !important;
    margin-top:auto !important;
    margin-left:0 !important;
    margin-right:0 !important;
    margin-bottom:0 !important;
    padding:8px 0 !important;

    display:grid !important;
    grid-template-columns:32px !important;
    justify-content:center !important;
    justify-items:center !important;
    align-items:center !important;
    column-gap:0 !important;

    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
  }

  html.sidebar-collapsed-v232 #sidebar .logout-menu-label-v232{
    display:none !important;
  }

  html.sidebar-collapsed-v232 #sidebar .logout-menu-icon-v232{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    max-width:32px !important;
    max-height:32px !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    display:grid !important;
    place-items:center !important;
  }

  html.sidebar-collapsed-v232 #sidebar .logout-v232:hover{
    background:#fff4f4 !important;
  }
}


/* V235 — seta centralizada exatamente sobre a lateral do menu */
@media(min-width:821px){
  .desktop-sidebar-toggle-v232{
    right:-12px !important;
  }

  html.sidebar-collapsed-v232 .desktop-sidebar-toggle-v232{
    right:-12px !important;
  }
}


/* V236 — seta exatamente sobre a linha branca lateral */
@media(min-width:821px){
  .desktop-sidebar-toggle-v232,
  html.sidebar-collapsed-v232 .desktop-sidebar-toggle-v232{
    right:-20px !important;
  }
}


/* V237 — margem lateral ligeiramente menor no menu recolhido */
@media(min-width:821px){
  html.sidebar-collapsed-v232 .sidebar{
    padding-left:8px !important;
    padding-right:8px !important;
  }
}


/* V238 — favoritos: clique e estado visual garantidos */
.sound-tile .fav{
  pointer-events:auto !important;
  cursor:pointer !important;
  z-index:50 !important;
}
.sound-tile .fav.active{
  opacity:1 !important;
}
.sound-tile .fav:disabled{
  pointer-events:none !important;
}
.sound-tile.hide-by-filter{
  display:none !important;
}


/* =========================================================
   V239 — coração de Favoritos sempre clicável
========================================================= */
.sounds-premium-shell{
  position:relative !important;
}

.sounds-premium-shell .sound-tile{
  position:relative !important;
}

.sounds-premium-shell .sound-tile .fav{
  position:absolute !important;
  z-index:1002 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}

/* A camada premium não bloqueia os corações.
   Só o botão Assinar continua clicável na própria camada. */
.sounds-premium-shell .sound-premium-overlay{
  pointer-events:none !important;
  z-index:900 !important;
}

.sounds-premium-shell .sound-premium-overlay .sound-premium-cta{
  pointer-events:auto !important;
}

.sounds-premium-shell.sound-premium-locked .sound-page{
  pointer-events:none !important;
}

.sounds-premium-shell.sound-premium-locked .sound-tile .fav{
  pointer-events:auto !important;
}

.sound-tile.hide-by-filter{
  display:none !important;
}


/* =========================================================
   V240 — Sidebar estilo Gemini: controle junto da logo
========================================================= */
@media(min-width:821px){

  /* Cria uma área de cabeçalho limpa para logo + recolher */
  #sidebar{
    position:fixed !important;
  }

  #sidebar .brand{
    position:relative !important;
    height:66px !important;
    min-height:66px !important;
    margin-bottom:16px !important;
    padding-left:15px !important;
    padding-right:48px !important;
    justify-content:flex-start !important;
    overflow:visible !important;
  }

  /* Aberto: seta no canto direito, alinhada com a logo */
  #sidebar .desktop-sidebar-toggle-v232{
    top:43px !important;
    right:16px !important;
    transform:translateY(-50%) !important;

    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    min-height:30px !important;
    max-width:30px !important;
    max-height:30px !important;

    border:0 !important;
    border-radius:9px !important;
    background:transparent !important;
    box-shadow:none !important;
    transition:background .16s ease, transform .16s ease !important;
  }

  #sidebar .desktop-sidebar-toggle-v232:hover{
    background:#f2f4f6 !important;
  }

  #sidebar .desktop-sidebar-toggle-v232 > span{
    width:8px !important;
    height:8px !important;
    border-left:1.6px solid #66727c !important;
    border-bottom:1.6px solid #66727c !important;
    transform:rotate(45deg) !important;
    margin-left:3px !important;
  }

  /* Recolhido: o topo vira um único controle visual, como no Gemini */
  html.sidebar-collapsed-v232 #sidebar .brand{
    height:66px !important;
    min-height:66px !important;
    margin-bottom:16px !important;
    padding:0 !important;
    justify-content:center !important;
    pointer-events:none !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand img{
    opacity:0 !important;
    transform:scale(.88) !important;
    transition:opacity .14s ease, transform .14s ease !important;
  }

  html.sidebar-collapsed-v232 #sidebar .desktop-sidebar-toggle-v232{
    top:43px !important;
    left:50% !important;
    right:auto !important;
    transform:translate(-50%,-50%) !important;

    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    max-width:42px !important;
    max-height:42px !important;

    border:0 !important;
    border-radius:12px !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html.sidebar-collapsed-v232 #sidebar .desktop-sidebar-toggle-v232:hover{
    background:#f1f3f5 !important;
  }

  html.sidebar-collapsed-v232 #sidebar .desktop-sidebar-toggle-v232 > span{
    width:9px !important;
    height:9px !important;
    transform:rotate(225deg) !important;
    margin-left:-3px !important;
    border-left:1.7px solid #5f6b75 !important;
    border-bottom:1.7px solid #5f6b75 !important;
  }
}

/* =========================================================
   V241 — logo e recolher perfeitamente alinhados + logo reabre
========================================================= */
@media(min-width:821px){
  /* aberto: botão exatamente no eixo vertical da logo */
  #sidebar .desktop-sidebar-toggle-v232{
    top:55px !important;
    right:17px !important;
    transform:translateY(-50%) !important;
  }

  /* recolhido: mantém a logo visível e ela vira o botão de reabrir */
  html.sidebar-collapsed-v232 #sidebar .brand{
    height:66px !important;
    min-height:66px !important;
    margin-bottom:16px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    pointer-events:auto !important;
    cursor:pointer !important;
    border-radius:12px !important;
    transition:background .16s ease !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand:hover{
    background:#f3f5f6 !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand img{
    width:40px !important;
    height:40px !important;
    opacity:1 !important;
    transform:none !important;
    object-fit:contain !important;
  }

  /* quando fechado não mostra seta: a própria logo é o controle */
  html.sidebar-collapsed-v232 #sidebar .desktop-sidebar-toggle-v232{
    display:none !important;
  }
}


/* V242 — menu recolhido com margens laterais perfeitamente iguais */
@media(min-width:821px){
  html.sidebar-collapsed-v232 #sidebar{
    width:80px !important; min-width:80px !important; max-width:80px !important;
    padding-left:8px !important; padding-right:8px !important;
    box-sizing:border-box !important;
  }
  html.sidebar-collapsed-v232 #sidebar nav,
  html.sidebar-collapsed-v232 #sidebar .brand,
  html.sidebar-collapsed-v232 #sidebar .logout-v232{
    width:100% !important; box-sizing:border-box !important;
    margin-left:0 !important; margin-right:0 !important;
  }
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207{
    width:100% !important; box-sizing:border-box !important;
    margin-left:0 !important; margin-right:0 !important;
    padding-left:0 !important; padding-right:0 !important;
  }
  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207 > span:first-child,
  html.sidebar-collapsed-v232 #sidebar .logout-menu-icon-v232{
    margin-left:auto !important; margin-right:auto !important;
  }
  html.sidebar-collapsed-v232 #sidebar .brand{
    padding-left:0 !important; padding-right:0 !important;
    justify-content:center !important;
  }
  html.sidebar-collapsed-v232 .main{margin-left:80px !important;}
}


/* V243 — recolhido: ao passar o mouse na logo, mostrar > */
@media(min-width:821px){
  html.sidebar-collapsed-v232 #sidebar .brand{
    position:relative !important;
    cursor:pointer !important;
    overflow:visible !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand::after{
    content:">";
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:10px;
    background:#fff;
    color:#667085;
    font-family:Arial,sans-serif;
    font-size:23px;
    font-weight:400;
    line-height:1;
    opacity:0;
    pointer-events:none;
    transition:opacity .15s ease, background .15s ease;
    z-index:20;
  }

  html.sidebar-collapsed-v232 #sidebar .brand:hover::after{
    opacity:1;
    background:#f3f5f7;
  }

  html.sidebar-collapsed-v232 #sidebar .brand:hover img{
    opacity:0;
  }
}


/* =========================================================
   V244 — recolhido realmente simétrico + hover igual ao toggle aberto
========================================================= */
@media(min-width:821px){

  /* Remove a faixa/sombra branca que fazia o lado direito parecer maior */
  html.sidebar-collapsed-v232 #sidebar.sidebar,
  html.sidebar-collapsed-v232 #sidebar{
    width:80px !important;
    min-width:80px !important;
    max-width:80px !important;
    padding-left:8px !important;
    padding-right:8px !important;
    box-sizing:border-box !important;
    box-shadow:none !important;
    border-right:0 !important;
  }

  html.sidebar-collapsed-v232 .main{
    margin-left:80px !important;
    width:calc(100% - 80px) !important;
  }

  /* Todos os elementos ocupam exatamente a mesma área útil */
  html.sidebar-collapsed-v232 #sidebar nav,
  html.sidebar-collapsed-v232 #sidebar .brand,
  html.sidebar-collapsed-v232 #sidebar .logout-v232{
    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }

  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207,
  html.sidebar-collapsed-v232 #sidebar .logout-v232{
    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    display:grid !important;
    grid-template-columns:32px !important;
    justify-content:center !important;
    justify-items:center !important;
  }

  html.sidebar-collapsed-v232 #sidebar nav a.mobile-menu-item-v207 > span:first-child,
  html.sidebar-collapsed-v232 #sidebar .logout-menu-icon-v232{
    margin:0 !important;
    justify-self:center !important;
  }

  /* Logo é o controle de reabertura */
  html.sidebar-collapsed-v232 #sidebar .brand{
    position:relative !important;
    height:66px !important;
    min-height:66px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer !important;
    pointer-events:auto !important;
    background:transparent !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand img{
    display:block !important;
    width:40px !important;
    height:40px !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    transition:none !important;
  }

  /* Remove o > antigo */
  html.sidebar-collapsed-v232 #sidebar .brand::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:8px !important;
    height:8px !important;
    transform:translate(-65%,-50%) rotate(225deg) !important;
    border-left:1.6px solid #66727c !important;
    border-bottom:1.6px solid #66727c !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    opacity:0 !important;
    z-index:30 !important;
    pointer-events:none !important;
  }

  /* No hover a logo some DE VERDADE e entra a mesma seta minimalista */
  html.sidebar-collapsed-v232 #sidebar .brand:hover{
    background:#f2f4f6 !important;
    border-radius:9px !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand:hover img{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand:hover::after{
    opacity:1 !important;
  }

  /* O toggle separado continua escondido quando recolhido */
  html.sidebar-collapsed-v232 #sidebar .desktop-sidebar-toggle-v232{
    display:none !important;
  }
}

/* V245 — Sons para Dormir reconstruído: filtros consistentes */
.sound-category.hide-by-filter{
  display:none !important;
}
.sound-tile .fav.is-saving{
  opacity:.55 !important;
  cursor:wait !important;
}




/* =========================================================
   V248 — somente o DESENHO dos ícones NanaBot e Análise de Choro
   Não altera fundo, caixa, padding, largura ou altura dos botões.
========================================================= */
@media (min-width:821px){

  /* NanaBot */
  #sidebar a[href*="nanabot"] > span:first-child svg,
  #sidebar a[href*="nanabot"] > span:first-child img,
  #sidebar a[data-page="nanabot"] > span:first-child svg,
  #sidebar a[data-page="nanabot"] > span:first-child img{
    width:20px !important;
    height:20px !important;
    max-width:20px !important;
    max-height:20px !important;
    object-fit:contain !important;
  }

  /* Análise de Choro */
  #sidebar a[href*="choro"] > span:first-child svg,
  #sidebar a[href*="choro"] > span:first-child img,
  #sidebar a[data-page*="choro"] > span:first-child svg,
  #sidebar a[data-page*="choro"] > span:first-child img{
    width:20px !important;
    height:20px !important;
    max-width:20px !important;
    max-height:20px !important;
    object-fit:contain !important;
  }
}


/* =========================================================
   V250 — ajuste seguro: reduz só o desenho, sem alterar layout
========================================================= */
@media (min-width:821px){

  /* NanaBot: mantém toda a estrutura original e só escala visualmente */
  #sidebar .mobile-nav-nana-v207 .robot-face{
    transform:scale(.82) !important;
    transform-origin:center center !important;
  }

  /* Análise de Choro: escala os dois elementos visuais sem mudar caixa */
  #sidebar .mobile-nav-cry-v207::before,
  #sidebar .mobile-nav-cry-v207::after{
    transform:translate(-50%,-50%) scale(.82) !important;
    transform-origin:center center !important;
  }
}


/* =========================================================
   V252 — Análise de Choro: desenho proporcional, menor e CENTRALIZADO
   Mantém a caixa/fundo original e não toca no NanaBot.
========================================================= */
@media (min-width:821px){

  /* Mantém a caixa original sem escala/deformação */
  #sidebar .mobile-nav-cry-v207{
    transform:none !important;
    position:relative !important;
  }

  /* Círculo principal menor, porém centralizado */
  #sidebar .mobile-nav-cry-v207::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:15px !important;
    height:15px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    box-shadow:none !important;
    transform:translate(-50%,-50%) !important;
    transform-origin:center center !important;
  }

  /* Miolo proporcional e centralizado */
  #sidebar .mobile-nav-cry-v207::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:5px !important;
    height:5px !important;
    border-radius:50% !important;
    background:#fff !important;
    transform:translate(-50%,-50%) !important;
    transform-origin:center center !important;
  }
}


/* V253 — desktop: logo do menu aberto alinhada mais à esquerda com os itens */
@media (min-width:821px){
  html:not(.sidebar-collapsed-v232) #sidebar .brand{
    justify-content:flex-start !important;
    padding-left:12px !important;
  }
}


/* V254 — desktop: logo ainda mais para a esquerda no menu aberto */
@media (min-width:821px){
  html:not(.sidebar-collapsed-v232) #sidebar .brand{
    justify-content:flex-start !important;
    padding-left:4px !important;
  }
}


/* =========================================================
   V256 — SOMENTE 2 ajustes mobile:
   1) foto do Olá em círculo perfeito
   2) título Dica da NanaBot sem espaço exagerado
========================================================= */
@media(max-width:820px){

  /* Foto do perfil no "Olá" — círculo perfeito */
  .welcome-person .welcome-avatar{
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
    min-height:50px !important;
    flex:0 0 50px !important;
    border-radius:50% !important;
    overflow:hidden !important;
    position:relative !important;
    display:grid !important;
    place-items:center !important;
    box-sizing:border-box !important;
  }

  .welcome-person .welcome-avatar .profile-avatar-img{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    object-fit:cover !important;
    object-position:center !important;
    border-radius:50% !important;
    display:block;
    z-index:2 !important;
  }

  .welcome-person .welcome-avatar .welcome-avatar-backup{
    display:none !important;
  }

  .welcome-person .welcome-avatar.avatar-load-error .welcome-avatar-backup{
    display:grid !important;
    position:absolute !important;
    inset:0 !important;
    place-items:center !important;
    border-radius:50% !important;
    z-index:1 !important;
  }

  /* DICA DA NANABOT — tira o espaço entre kicker e título */
  .ai-tips.single-tip .nanabot-tip-title{
    align-items:center !important;
    gap:10px !important;
  }

  .ai-tips.single-tip .nanabot-tip-title > div{
    display:block !important;
    line-height:1 !important;
  }

  .ai-tips.single-tip .nanabot-tip-title .eyebrow{
    display:block !important;
    margin:0 0 2px !important;
    padding:0 !important;
    line-height:1.1 !important;
  }

  .ai-tips.single-tip .nanabot-tip-title h2{
    margin:0 !important;
    padding:0 !important;
    line-height:1.18 !important;
  }
}


/* =========================================================
   V257 — mobile: NanaBot e Choro padronizados com os demais ícones
   Mexe somente no desenho interno, não na caixa/fundo.
========================================================= */
@media(max-width:820px){

  /* MENU SUPERIOR / SIDEBAR ABERTO — NanaBot */
  #sidebar .mobile-nav-nana-v207 .robot-face{
    transform:scale(.82) !important;
    transform-origin:center center !important;
  }

  /* MENU SUPERIOR / SIDEBAR ABERTO — Choro */
  #sidebar .mobile-nav-cry-v207{
    transform:none !important;
    position:relative !important;
  }

  #sidebar .mobile-nav-cry-v207::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:15px !important;
    height:15px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    transform:translate(-50%,-50%) !important;
  }

  #sidebar .mobile-nav-cry-v207::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:5px !important;
    height:5px !important;
    border-radius:50% !important;
    background:#fff !important;
    transform:translate(-50%,-50%) !important;
  }

  /* MENU INFERIOR — NanaBot */
  .bottom-nav.bottom-nav-v210 .bottom-nana-exact-v210 .robot-face{
    transform:scale(.82) !important;
    transform-origin:center center !important;
  }

  /* MENU INFERIOR — Choro */
  .bottom-nav.bottom-nav-v210 .bottom-cry-v210{
    position:relative !important;
    transform:none !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-cry-v210::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:15px !important;
    height:15px !important;
    border-radius:50% !important;
    background:#567c85 !important;
    transform:translate(-50%,-50%) !important;
  }

  .bottom-nav.bottom-nav-v210 .bottom-cry-v210::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:5px !important;
    height:5px !important;
    border-radius:50% !important;
    background:#fff !important;
    transform:translate(-50%,-50%) !important;
  }
}


/* =========================================================
   V258 — Diário do Sono mobile:
   alinha o ícone da Sugestão da NanaBot com o bloco de texto
========================================================= */
@media(max-width:820px){
  .nanabot-diary-tip .nanabot-suggestion-head{
    display:grid !important;
    grid-template-columns:35px minmax(0,1fr) !important;
    column-gap:10px !important;
    align-items:center !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head .nanabot-mini{
    margin:0 !important;
    align-self:center !important;
    justify-self:start !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head > div{
    min-width:0 !important;
    align-self:center !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head .eyebrow{
    display:block !important;
    margin:0 0 3px !important;
    padding:0 !important;
    line-height:1.15 !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head h2{
    margin:0 !important;
    padding:0 !important;
    line-height:1.22 !important;
  }
}


/* =========================================================
   V259 — iPhone/Chrome: botão Sair visível no menu mobile
========================================================= */
@media(max-width:820px){

  /* menu ocupa a altura útil real do navegador */
  #sidebar.sidebar{
    height:100dvh !important;
    max-height:100dvh !important;
    box-sizing:border-box !important;
    padding-bottom:calc(18px + env(safe-area-inset-bottom)) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }

  /* sobe o botão Sair para ele não ficar escondido atrás da barra do iPhone */
  #sidebar .logout-v232{
    margin-top:18px !important;
    margin-bottom:calc(10px + env(safe-area-inset-bottom)) !important;
    flex:0 0 auto !important;
  }

  /* garante espaço depois do último item do menu */
  #sidebar nav{
    flex:0 0 auto !important;
  }
}

/* fallback para navegadores sem dvh */
@supports not (height:100dvh){
  @media(max-width:820px){
    #sidebar.sidebar{
      height:100vh !important;
      max-height:100vh !important;
    }
  }
}


/* =========================================================
   V260 — desktop: alinhamento NanaBot no Resumo e Diário
========================================================= */
@media(min-width:821px){

  /* RESUMO — ícone centralizado com "DICA DA NANABOT / Uma sugestão para hoje" */
  .ai-tips.single-tip .nanabot-tip-title{
    display:flex !important;
    align-items:center !important;
    gap:11px !important;
  }

  .ai-tips.single-tip .nanabot-tip-title .nanabot-mini{
    align-self:center !important;
    margin:0 !important;
  }

  .ai-tips.single-tip .nanabot-tip-title > div{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-height:35px !important;
  }

  .ai-tips.single-tip .nanabot-tip-title .eyebrow{
    display:block !important;
    margin:0 0 3px !important;
    line-height:1.1 !important;
  }

  .ai-tips.single-tip .nanabot-tip-title h2{
    margin:0 !important;
    line-height:1.2 !important;
  }

  /* DIÁRIO — ícone centralizado com título/subtítulo */
  .nanabot-diary-tip .nanabot-suggestion-head{
    display:flex !important;
    align-items:center !important;
    gap:11px !important;
    margin-bottom:12px !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head .nanabot-mini{
    align-self:center !important;
    margin:0 !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head > div{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-height:35px !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head .eyebrow{
    display:block !important;
    margin:0 0 3px !important;
    line-height:1.1 !important;
  }

  .nanabot-diary-tip .nanabot-suggestion-head h2{
    margin:0 !important;
    line-height:1.2 !important;
  }

  /* mantém o texto da sugestão alinhado ao bloco abaixo do cabeçalho */
  .nanabot-diary-tip > p{
    margin-top:0 !important;
  }
}


/* =========================================================
   V261 — desktop: seta da logo recolhida igual à seta de encolher
   Mesmo desenho/tamanho minimalista.
========================================================= */
@media(min-width:821px){

  /* Menu recolhido: ao passar na logo, usa seta pequena no mesmo padrão */
  html.sidebar-collapsed-v232 #sidebar .brand::after{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:6px !important;
    height:6px !important;
    border-left:1.35px solid #66727c !important;
    border-bottom:1.35px solid #66727c !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    transform:translate(-60%,-50%) rotate(225deg) !important;
    transform-origin:center center !important;
  }

  /* Mantém o hover minimalista, sem aumentar a área/desenho */
  html.sidebar-collapsed-v232 #sidebar .brand:hover{
    background:#f2f4f6 !important;
    border-radius:9px !important;
  }
}


/* =========================================================
   V262 — menu recolhido: hover cinza pequeno igual ao botão aberto
========================================================= */
@media(min-width:821px){
  html.sidebar-collapsed-v232 #sidebar .brand:hover{
    background:transparent !important;
    border-radius:0 !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:32px !important;
    height:32px !important;
    transform:translate(-50%,-50%) !important;
    border-radius:9px !important;
    background:transparent !important;
    z-index:19 !important;
    pointer-events:none !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand:hover::before{
    background:#f2f4f6 !important;
  }

  html.sidebar-collapsed-v232 #sidebar .brand::after{
    z-index:20 !important;
  }
}


/* V263 — loaders discretos dos históricos contínuos */
.nanabot-history-loader,
.nanabot-history-end{
  padding:10px 8px 6px;
  text-align:center;
  color:#969da7;
  font-size:9px;
}
.nanabot-history-loader .loader-dot{
  display:inline-block;
  width:5px;
  height:5px;
  margin-right:5px;
  border-radius:50%;
  background:#8ebbc7;
  vertical-align:middle;
}


/* =========================================================
   V271 — CTA Premium: cadeado branco minimalista, sem emoji/duplicação
========================================================= */
.premium-btn-lock-icon{
  width:15px !important;
  height:15px !important;
  min-width:15px !important;
  flex:0 0 15px !important;
  display:inline-block !important;
  fill:none !important;
  stroke:#fff !important;
  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vertical-align:middle !important;
}

.nanabot-premium-btn,
.sound-premium-cta,
.cry-premium-cta,
.home-guides-paywall a,
.premium-main-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
}

.premium-btn-label{
  display:inline-block !important;
}


/* =========================================================
   V283 — Novo registro do Diário REFEITO DO ZERO
========================================================= */
.db-sleep-modal{display:none!important}
.db-sleep-modal.open{
  display:flex!important;
  position:fixed!important;
  inset:0!important;
  z-index:10000!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  background:rgba(17,19,24,.30)!important;
  backdrop-filter:blur(4px)!important;
  box-sizing:border-box!important;
}
.db-sleep-card{
  width:min(620px,100%)!important;
  max-height:min(760px,calc(100vh - 48px))!important;
  background:#fff!important;
  border-radius:20px!important;
  box-shadow:0 24px 70px rgba(20,28,38,.18)!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
}
.db-sleep-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:flex-start!important;
  gap:16px!important;
  padding:20px 22px 14px!important;
  border-bottom:1px solid var(--line)!important;
  background:#fff!important;
}
.db-sleep-head h2{font-size:20px!important;line-height:1.2!important;margin:4px 0 4px!important}
.db-sleep-head p{font-size:11px!important;line-height:1.45!important;margin:0!important;color:var(--muted)!important}
.db-sleep-close{
  flex:0 0 30px!important;width:30px!important;height:30px!important;
  display:grid!important;place-items:center!important;
  border:0!important;border-radius:9px!important;background:#f2f4f7!important;
  color:#65707c!important;font-size:18px!important;line-height:1!important;cursor:pointer!important
}
.db-sleep-form{
  min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  display:grid!important;gap:12px!important;padding:16px 22px 18px!important
}
.db-sleep-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
.db-sleep-form label,.db-sleep-quality legend{font-size:10.5px!important;font-weight:600!important;color:#525b66!important}
.db-sleep-form label>span{display:block!important;margin-bottom:5px!important}
.db-sleep-form input,.db-sleep-form select,.db-sleep-form textarea{
  width:100%!important;min-width:0!important;box-sizing:border-box!important;
  min-height:42px!important;border:1px solid var(--line)!important;border-radius:10px!important;
  background:#fff!important;padding:9px 10px!important;color:#252a31!important;font-size:12px!important
}
.db-sleep-form textarea{min-height:58px!important;resize:vertical!important}
.db-sleep-quality{border:0!important;padding:0!important;margin:0!important}
.db-sleep-quality legend{margin-bottom:6px!important}
.db-sleep-quality-options{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
.db-sleep-quality-options input{position:absolute!important;opacity:0!important;pointer-events:none!important}
.db-sleep-quality-options label>span{
  min-height:58px!important;margin:0!important;display:grid!important;place-items:center!important;
  align-content:center!important;gap:3px!important;border:1px solid var(--line)!important;
  border-radius:10px!important;background:#fff!important;font-size:20px!important
}
.db-sleep-quality-options small{font-size:8px!important;color:#717984!important}
.db-sleep-quality-options input:checked+span{border-color:#edc65b!important;background:#fff8dd!important}
.db-sleep-status{min-height:14px!important;font-size:10px!important;color:#64707d!important}
.db-sleep-footer{padding:12px 22px 18px!important;border-top:1px solid var(--line)!important;background:#fff!important}
.db-sleep-footer .gradient-btn{width:100%!important;min-height:42px!important;margin:0!important}

@media(max-width:820px){
  #sleepModal.db-sleep-modal.open{
    align-items:center!important;justify-content:center!important;
    padding:
      max(72px,calc(env(safe-area-inset-top) + 62px))
      10px
      max(88px,calc(env(safe-area-inset-bottom) + 76px))
      !important;
  }
  #sleepModal .db-sleep-card{
    width:100%!important;
    max-height:calc(100dvh - 168px - env(safe-area-inset-bottom))!important;
    border-radius:16px!important;
  }
  #sleepModal .db-sleep-head{padding:13px 14px 10px!important;gap:10px!important}
  #sleepModal .db-sleep-head .eyebrow{font-size:8px!important}
  #sleepModal .db-sleep-head h2{font-size:18px!important;margin:2px 0 3px!important}
  #sleepModal .db-sleep-head p{font-size:9.5px!important;line-height:1.35!important}
  #sleepModal .db-sleep-close{width:28px!important;height:28px!important;flex-basis:28px!important;font-size:17px!important}
  #sleepModal .db-sleep-form{gap:8px!important;padding:10px 14px 11px!important}
  #sleepModal .db-sleep-row{gap:7px!important}
  #sleepModal .db-sleep-form label,#sleepModal .db-sleep-quality legend{font-size:9px!important}
  #sleepModal .db-sleep-form label>span{margin-bottom:4px!important}
  #sleepModal .db-sleep-form input,#sleepModal .db-sleep-form select{
    min-height:37px!important;padding:7px 8px!important;font-size:11px!important;border-radius:9px!important
  }
  #sleepModal .db-sleep-form textarea{
    min-height:46px!important;height:46px!important;padding:7px 8px!important;font-size:10.5px!important;resize:none!important
  }
  #sleepModal .db-sleep-quality-options{gap:5px!important}
  #sleepModal .db-sleep-quality-options label>span{min-height:46px!important;font-size:17px!important;border-radius:9px!important}
  #sleepModal .db-sleep-quality-options small{font-size:6.8px!important}
  #sleepModal .db-sleep-footer{padding:9px 14px 11px!important}
  #sleepModal .db-sleep-footer .gradient-btn{min-height:38px!important;font-size:11.5px!important}
  body:has(#sleepModal.open) .bottom-nav{visibility:hidden!important;pointer-events:none!important}
}
@supports not (height:100dvh){
  @media(max-width:820px){
    #sleepModal .db-sleep-card{max-height:calc(100vh - 168px)!important}
  }
}


/* =========================================================
   V284 — modal Diário cobre 100% da tela real no mobile
========================================================= */
html.db-sleep-modal-open,
body.db-sleep-modal-open{
  overflow:hidden !important;
  overscroll-behavior:none !important;
}

@media(max-width:820px){
  body > #sleepModal.db-sleep-modal{
    display:none !important;
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100dvh !important;
    min-height:100dvh !important;
    max-height:100dvh !important;
    z-index:2147483000 !important;

    margin:0 !important;
    padding:
      max(10px, env(safe-area-inset-top))
      10px
      max(10px, env(safe-area-inset-bottom))
      !important;

    background:rgba(8,12,18,.48) !important;
    backdrop-filter:blur(5px) !important;
    -webkit-backdrop-filter:blur(5px) !important;

    box-sizing:border-box !important;
    overflow:hidden !important;

    align-items:center !important;
    justify-content:center !important;
  }

  body > #sleepModal.db-sleep-modal.open{
    display:flex !important;
  }

  body > #sleepModal .db-sleep-card{
    width:min(100%, 500px) !important;
    height:auto !important;
    max-height:calc(100dvh - max(20px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))) !important;

    margin:0 !important;
    border-radius:16px !important;
    overflow:hidden !important;

    display:grid !important;
    grid-template-rows:auto minmax(0,1fr) auto !important;

    background:#fff !important;
    box-shadow:0 22px 70px rgba(0,0,0,.28) !important;
  }

  body > #sleepModal .db-sleep-head{
    flex:0 0 auto !important;
    padding:13px 14px 10px !important;
    background:#fff !important;
  }

  body > #sleepModal .db-sleep-form{
    min-height:0 !important;
    max-height:none !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;

    padding:10px 14px 12px !important;
  }

  body > #sleepModal .db-sleep-footer{
    flex:0 0 auto !important;
    padding:9px 14px calc(10px + env(safe-area-inset-bottom)) !important;
    background:#fff !important;
  }

  body > #sleepModal .db-sleep-close{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    z-index:10 !important;
    pointer-events:auto !important;
  }

  /* O menu inferior nunca aparece por cima do modal. */
  body.db-sleep-modal-open .bottom-nav,
  body.db-sleep-modal-open .mobile-head,
  body.db-sleep-modal-open #sidebar{
    pointer-events:none !important;
  }

  body.db-sleep-modal-open .bottom-nav{
    visibility:hidden !important;
  }
}

@supports not (height:100dvh){
  @media(max-width:820px){
    body > #sleepModal.db-sleep-modal{
      height:100vh !important;
      min-height:100vh !important;
      max-height:100vh !important;
    }

    body > #sleepModal .db-sleep-card{
      max-height:calc(100vh - 20px) !important;
    }
  }
}


/* =========================================================
   V285 — iPhone: restaura controles nativos no Novo registro
   Corrige selects e inputs de data/hora que ficaram "vazios".
========================================================= */
@media(max-width:820px){

  /* Selects: mantém a seta nativa do iPhone */
  body > #sleepModal .db-sleep-form select{
    -webkit-appearance:auto !important;
    appearance:auto !important;
    background-color:#fff !important;
    color:#252a31 !important;
    opacity:1 !important;
    padding-left:9px !important;
    padding-right:8px !important;
  }

  /* Data e hora: usa o controle nativo do iOS */
  body > #sleepModal .db-sleep-form input[type="date"],
  body > #sleepModal .db-sleep-form input[type="time"]{
    -webkit-appearance:auto !important;
    appearance:auto !important;
    background-color:#fff !important;
    color:#252a31 !important;
    -webkit-text-fill-color:#252a31 !important;
    opacity:1 !important;
    padding:7px 8px !important;
    line-height:1.2 !important;
  }

  /* Garante que o indicador/calendário/relógio do WebKit apareça */
  body > #sleepModal input[type="date"]::-webkit-calendar-picker-indicator,
  body > #sleepModal input[type="time"]::-webkit-calendar-picker-indicator{
    display:block !important;
    opacity:.62 !important;
    visibility:visible !important;
    width:16px !important;
    height:16px !important;
    margin:0 !important;
  }

  /* Área interna dos campos de hora/data */
  body > #sleepModal input[type="date"]::-webkit-date-and-time-value,
  body > #sleepModal input[type="time"]::-webkit-date-and-time-value{
    text-align:left !important;
    min-height:20px !important;
  }

  /* Remove regras antigas que escondiam partes do controle */
  body > #sleepModal input[type="date"]::-webkit-inner-spin-button,
  body > #sleepModal input[type="time"]::-webkit-inner-spin-button{
    opacity:1 !important;
  }

  /* Mantém duas colunas sem esmagar os controles */
  body > #sleepModal .db-sleep-row{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  }

  body > #sleepModal .db-sleep-form input,
  body > #sleepModal .db-sleep-form select{
    min-width:0 !important;
    width:100% !important;
    box-sizing:border-box !important;
  }
}

/* iPhones estreitos: dá um pouco mais de área útil aos horários */
@media(max-width:370px){
  body > #sleepModal .db-sleep-form input[type="time"]{
    font-size:10.5px !important;
    padding-left:6px !important;
    padding-right:6px !important;
  }
}
/* =========================================================
   CORREÇÃO DEFINITIVA: FUNDO DO MODAL TELA CHEIA
========================================================= */
@media (max-width: 820px) {
  /* 1. Força a película escura a ignorar limites e cobrir 100% da tela */
  html body div.modal,
  html body div.modal.open {
    max-width: 100% !important;
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    inset: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  
  /* 2. Mantém a caixinha branca ("Adicionar passo") centralizada e com margem */
  html body div.modal .modal-card,
  html body div.modal .routine-modal-card {
    max-width: calc(100% - 32px) !important;
    width: 100% !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
  }
}
/* =========================================================
   V286 — Plano de Sono / Adicionar passo
   Correção isolada: remove azul dos rótulos, campos e fechar.
   Escopado somente em #routineModal para não afetar o app.
========================================================= */
#routineModal{
  color-scheme:light !important;
}
#routineModal .routine-modal-card,
#routineModal .routine-modal-card form,
#routineModal .routine-modal-card .fields,
#routineModal .routine-modal-card label{
  color:#525b66 !important;
  -webkit-text-fill-color:#525b66 !important;
}
#routineModal .routine-modal-card h2{
  color:#111318 !important;
  -webkit-text-fill-color:#111318 !important;
}
#routineModal .routine-modal-card .modal-sub,
#routineModal .routine-modal-card .optional,
#routineModal #routineStatus{
  color:#68717d !important;
  -webkit-text-fill-color:#68717d !important;
}
#routineModal .routine-modal-card input,
#routineModal .routine-modal-card input[type="text"],
#routineModal .routine-modal-card input[type="time"]{
  color:#252a31 !important;
  -webkit-text-fill-color:#252a31 !important;
  background:#fff !important;
  border-color:#dfe3e7 !important;
  opacity:1 !important;
  caret-color:#252a31 !important;
}
#routineModal input[type="time"]::-webkit-date-and-time-value,
#routineModal input[type="time"]::-webkit-datetime-edit,
#routineModal input[type="time"]::-webkit-datetime-edit-fields-wrapper,
#routineModal input[type="time"]::-webkit-datetime-edit-hour-field,
#routineModal input[type="time"]::-webkit-datetime-edit-minute-field,
#routineModal input[type="time"]::-webkit-datetime-edit-ampm-field{
  color:#252a31 !important;
  -webkit-text-fill-color:#252a31 !important;
}
#routineModal input::placeholder{
  color:#9aa0aa !important;
  -webkit-text-fill-color:#9aa0aa !important;
  opacity:1 !important;
}
#routineModal .close,
#routineModal button.close,
#routineModal [data-close-routine]{
  color:#65707c !important;
  -webkit-text-fill-color:#65707c !important;
  background:#f2f4f7 !important;
  border:0 !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
#routineModal .gradient-btn{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* =========================================================
   V287 — Plano de Sono / Adicionar passo / Horário
   Corrige somente o input time no mobile/Safari.
========================================================= */
#routineModal input[type="time"][name="item_time"]{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  color:#252a31 !important;
  -webkit-text-fill-color:#252a31 !important;
  background-color:#fff !important;
  border:1px solid #dfe3e7 !important;
  border-radius:12px !important;
  opacity:1 !important;
  font:inherit !important;
  line-height:1.25 !important;
  accent-color:#65707c !important;
}
#routineModal input[type="time"][name="item_time"]::-webkit-date-and-time-value,
#routineModal input[type="time"][name="item_time"]::-webkit-datetime-edit,
#routineModal input[type="time"][name="item_time"]::-webkit-datetime-edit-fields-wrapper,
#routineModal input[type="time"][name="item_time"]::-webkit-datetime-edit-hour-field,
#routineModal input[type="time"][name="item_time"]::-webkit-datetime-edit-minute-field,
#routineModal input[type="time"][name="item_time"]::-webkit-datetime-edit-ampm-field{
  color:#252a31 !important;
  -webkit-text-fill-color:#252a31 !important;
  opacity:1 !important;
}
#routineModal input[type="time"][name="item_time"]::-webkit-calendar-picker-indicator{
  opacity:.58 !important;
  filter:grayscale(1) !important;
}
@media(max-width:820px){
  #routineModal input[type="time"][name="item_time"]{
    padding:11px 12px !important;
    min-height:46px !important;
  }
}

/* =========================================================
   V288 — Plano de Sono / Adicionar passo / Horário
   Mantém o horário sem azul e devolve um ícone de relógio
   cinza visível no lado direito do campo.
========================================================= */
#routineModal input[type="time"][name="item_time"]{
  -webkit-appearance:none !important;
  appearance:none !important;
  padding-right:44px !important;
  background-color:#fff !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2365707c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5v5l3.2 1.8'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 13px center !important;
  background-size:20px 20px !important;
}
#routineModal input[type="time"][name="item_time"]::-webkit-calendar-picker-indicator{
  position:absolute !important;
  right:0 !important;
  width:44px !important;
  height:100% !important;
  opacity:0 !important;
  cursor:pointer !important;
}

/* =========================================================
   V292 — Diário do Sono / Novo registro mobile
   Layout limpo e isolado. Mantém cabeçalho e menu inferior.
========================================================= */
#sleepModal{color-scheme:light!important}
#sleepModal .db-sleep-control{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:0!important;
}
#sleepModal .db-sleep-control>input{
  margin:0!important;
  padding-right:46px!important;
}
#sleepModal .db-sleep-control>svg{
  position:absolute!important;
  right:14px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:20px!important;
  height:20px!important;
  fill:none!important;
  stroke:#6d7680!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  pointer-events:none!important;
  z-index:2!important;
}
#sleepModal input[type="date"]::-webkit-calendar-picker-indicator,
#sleepModal input[type="time"]::-webkit-calendar-picker-indicator{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  opacity:0!important;
  cursor:pointer!important;
}

@media(max-width:820px){
  /* cabeçalho e navegação continuam visíveis */
  body.db-sleep-modal-open .mobile-head,
  body:has(#sleepModal.open) .mobile-head{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    position:sticky!important;
    z-index:220!important;
  }
  body.db-sleep-modal-open .bottom-nav,
  body:has(#sleepModal.open) .bottom-nav{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    z-index:200!important;
  }

  /* backdrop ocupa somente a área entre topo e menu inferior */
  body > #sleepModal.db-sleep-modal,
  body > #sleepModal.db-sleep-modal.open,
  html body #sleepModal.modal,
  html body #sleepModal.modal.open{
    position:fixed!important;
    top:64px!important;
    right:0!important;
    bottom:86px!important;
    left:0!important;
    inset:64px 0 86px 0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:12px!important;
    box-sizing:border-box!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    background:rgba(14,18,24,.42)!important;
    backdrop-filter:blur(4px)!important;
    -webkit-backdrop-filter:blur(4px)!important;
    z-index:190!important;
  }
  body > #sleepModal.db-sleep-modal{display:none!important}
  body > #sleepModal.db-sleep-modal.open{display:flex!important}

  body > #sleepModal .db-sleep-card{
    width:min(100%,520px)!important;
    height:auto!important;
    max-height:100%!important;
    min-height:0!important;
    margin:0 auto!important;
    border:1px solid #e5e8eb!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 18px 55px rgba(21,28,36,.20)!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
  }

  body > #sleepModal .db-sleep-head{
    padding:16px 16px 13px!important;
    gap:12px!important;
    border-bottom:1px solid #edf0f2!important;
    background:#fff!important;
  }
  body > #sleepModal .db-sleep-head .eyebrow{
    font-size:9px!important;
    font-weight:700!important;
    letter-spacing:.08em!important;
    color:#6f7882!important;
  }
  body > #sleepModal .db-sleep-head h2{
    margin:3px 0 4px!important;
    font-size:22px!important;
    line-height:1.18!important;
    letter-spacing:-.025em!important;
    color:#111318!important;
  }
  body > #sleepModal .db-sleep-head p{
    margin:0!important;
    max-width:390px!important;
    font-size:12.5px!important;
    line-height:1.45!important;
    color:#737b85!important;
  }
  body > #sleepModal .db-sleep-close{
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    display:grid!important;
    place-items:center!important;
    border:0!important;
    border-radius:10px!important;
    background:#f2f4f6!important;
    color:#626b75!important;
    font-size:21px!important;
    line-height:1!important;
  }

  /* formulário: uma coluna no mobile, sem campos grudados */
  body > #sleepModal .db-sleep-form{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:15px!important;
    min-height:0!important;
    padding:15px 16px 18px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    background:#fff!important;
  }
  body > #sleepModal .db-sleep-row{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:15px!important;
    width:100%!important;
    min-width:0!important;
  }
  body > #sleepModal .db-sleep-form label,
  body > #sleepModal .db-sleep-quality legend{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    font-size:13px!important;
    line-height:1.3!important;
    font-weight:650!important;
    color:#505963!important;
    -webkit-text-fill-color:#505963!important;
  }
  body > #sleepModal .db-sleep-form label>span:first-child{
    display:block!important;
    margin:0 0 7px!important;
  }
  body > #sleepModal .db-sleep-form input,
  body > #sleepModal .db-sleep-form select,
  body > #sleepModal .db-sleep-form textarea{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    margin:0!important;
    border:1px solid #dfe3e7!important;
    border-radius:12px!important;
    background:#fff!important;
    color:#252a31!important;
    -webkit-text-fill-color:#252a31!important;
    opacity:1!important;
    outline:0!important;
    font-family:inherit!important;
    font-size:16px!important;
    font-weight:500!important;
    line-height:1.25!important;
    box-shadow:none!important;
  }
  body > #sleepModal .db-sleep-form input,
  body > #sleepModal .db-sleep-form select{
    min-height:50px!important;
    padding:12px 13px!important;
  }
  body > #sleepModal .db-sleep-form textarea{
    min-height:82px!important;
    height:auto!important;
    padding:12px 13px!important;
    resize:vertical!important;
  }
  body > #sleepModal .db-sleep-form select{
    -webkit-appearance:auto!important;
    appearance:auto!important;
    padding-right:12px!important;
  }
  body > #sleepModal .db-sleep-form input[type="date"],
  body > #sleepModal .db-sleep-form input[type="time"]{
    -webkit-appearance:none!important;
    appearance:none!important;
    min-height:50px!important;
    padding:12px 46px 12px 13px!important;
    text-align:left!important;
  }
  body > #sleepModal input[type="date"]::-webkit-date-and-time-value,
  body > #sleepModal input[type="time"]::-webkit-date-and-time-value{
    text-align:left!important;
    min-height:22px!important;
  }

  body > #sleepModal .db-sleep-quality{
    border:0!important;
    padding:0!important;
    margin:0!important;
    min-width:0!important;
  }
  body > #sleepModal .db-sleep-quality legend{
    margin:0 0 8px!important;
  }
  body > #sleepModal .db-sleep-quality-options{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
  }
  body > #sleepModal .db-sleep-quality-options label>span{
    min-height:62px!important;
    margin:0!important;
    padding:6px 2px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    border:1px solid #e0e4e8!important;
    border-radius:12px!important;
    background:#fff!important;
    font-size:21px!important;
  }
  body > #sleepModal .db-sleep-quality-options small{
    font-size:9px!important;
    line-height:1!important;
    color:#747d87!important;
  }

  body > #sleepModal .db-sleep-status{
    min-height:4px!important;
    font-size:11px!important;
  }
  body > #sleepModal .db-sleep-footer{
    padding:11px 16px 13px!important;
    border-top:1px solid #edf0f2!important;
    background:#fff!important;
  }
  body > #sleepModal .db-sleep-footer .gradient-btn{
    width:100%!important;
    min-height:48px!important;
    margin:0!important;
    border-radius:12px!important;
    font-size:14px!important;
    font-weight:700!important;
  }
}

@media(max-width:420px){
  body > #sleepModal.db-sleep-modal,
  body > #sleepModal.db-sleep-modal.open,
  html body #sleepModal.modal,
  html body #sleepModal.modal.open{
    top:64px!important;
    bottom:84px!important;
    inset:64px 0 84px 0!important;
    padding:9px!important;
  }
  body > #sleepModal .db-sleep-card{border-radius:16px!important}
  body > #sleepModal .db-sleep-head{padding:14px 14px 12px!important}
  body > #sleepModal .db-sleep-head h2{font-size:21px!important}
  body > #sleepModal .db-sleep-head p{font-size:12px!important}
  body > #sleepModal .db-sleep-form{padding:14px!important;gap:14px!important}
  body > #sleepModal .db-sleep-row{gap:14px!important}
  body > #sleepModal .db-sleep-footer{padding:10px 14px 12px!important}
}


/* =========================================================
   V295 — Diário do Sono / backdrop único FULL + cartão central
   Usa o PRÓPRIO #sleepModal como fundo escuro em toda a viewport.
   Não cria pseudo-elemento/quadrado extra.
========================================================= */
@media(max-width:820px){
  body > #sleepModal.db-sleep-modal,
  body > #sleepModal.db-sleep-modal.open,
  html body #sleepModal.modal,
  html body #sleepModal.modal.open{
    position:fixed!important;
    inset:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    max-height:none!important;
    margin:0!important;

    /* espaço reservado visualmente para header/nav,
       mas o MESMO fundo preto continua por trás deles */
    padding:72px 12px 88px!important;
    box-sizing:border-box!important;

    display:none!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;

    /* um único fundo, sem segundo quadrado */
    background:rgba(14,18,24,.48)!important;
    backdrop-filter:blur(4px)!important;
    -webkit-backdrop-filter:blur(4px)!important;
    z-index:190!important;
  }

  body > #sleepModal.db-sleep-modal.open,
  html body #sleepModal.modal.open{
    display:flex!important;
  }

  /* Garante que nenhuma camada adicional crie outro retângulo */
  body > #sleepModal::before,
  body > #sleepModal::after{
    content:none!important;
    display:none!important;
  }

  body > #sleepModal .db-sleep-card{
    position:relative!important;
    inset:auto!important;
    transform:translateY(6px)!important;
    width:min(100%,520px)!important;
    max-width:520px!important;
    max-height:calc(100vh - 176px)!important;
    margin:auto!important;
    align-self:center!important;
    justify-self:center!important;
  }

  /* Cabeçalho e menu continuam utilizáveis e aparecem por cima
     do MESMO backdrop full */
  body.db-sleep-modal-open .mobile-head,
  body:has(#sleepModal.open) .mobile-head{
    z-index:220!important;
  }

  body.db-sleep-modal-open .bottom-nav,
  body:has(#sleepModal.open) .bottom-nav{
    z-index:220!important;
  }
}

@supports (height:100dvh){
  @media(max-width:820px){
    body > #sleepModal.db-sleep-modal,
    body > #sleepModal.db-sleep-modal.open,
    html body #sleepModal.modal,
    html body #sleepModal.modal.open{
      height:100dvh!important;
      min-height:100dvh!important;
    }
    body > #sleepModal .db-sleep-card{
      max-height:calc(100dvh - 176px)!important;
    }
  }
}

@media(max-width:420px){
  body > #sleepModal.db-sleep-modal,
  body > #sleepModal.db-sleep-modal.open,
  html body #sleepModal.modal,
  html body #sleepModal.modal.open{
    padding:70px 9px 84px!important;
  }

  body > #sleepModal .db-sleep-card{
    width:100%!important;
    max-width:520px!important;
    max-height:calc(100vh - 154px)!important;
    transform:translateY(5px)!important;
  }
}

@supports (height:100dvh){
  @media(max-width:420px){
    body > #sleepModal .db-sleep-card{
      max-height:calc(100dvh - 154px)!important;
    }
  }
}


/* =========================================================
   V307 — Diário do Sono / Novo registro DESKTOP
   Alinha Data do registro + Tipo de sono e devolve setas dos selects.
========================================================= */
@media(min-width:821px){
  #sleepModal .db-sleep-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    width:100%!important;
  }

  #sleepModal .db-sleep-row > label{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-row > label > span:first-child{
    display:block!important;
    margin:0 0 7px!important;
  }

  #sleepModal .db-sleep-row input,
  #sleepModal .db-sleep-row select,
  #sleepModal .db-sleep-row .db-sleep-control{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  /* Data e Tipo com mesma altura e alinhamento */
  #sleepModal .db-sleep-row input[type="date"],
  #sleepModal .db-sleep-row select{
    min-height:46px!important;
    height:46px!important;
  }

  /* Selects com seta explícita, consistente no desktop */
  #sleepModal .db-sleep-form select{
    -webkit-appearance:none!important;
    appearance:none!important;
    padding:11px 40px 11px 12px!important;
    background-color:#fff!important;
    background-image:
      linear-gradient(45deg, transparent 50%, #6d7680 50%),
      linear-gradient(135deg, #6d7680 50%, transparent 50%)!important;
    background-position:
      calc(100% - 18px) 50%,
      calc(100% - 13px) 50%!important;
    background-size:5px 5px, 5px 5px!important;
    background-repeat:no-repeat!important;
    cursor:pointer!important;
  }

  #sleepModal .db-sleep-form select::-ms-expand{
    display:none!important;
  }
}


/* =========================================================
   V308 — Diário / Novo registro desktop
   Data do registro e Tipo de sono batendo exatamente na linha.
========================================================= */
@media(min-width:821px){
  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    column-gap:14px!important;
    align-items:start!important;
  }

  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type > label{
    display:grid!important;
    grid-template-rows:auto 46px!important;
    align-content:start!important;
    gap:7px!important;
    margin:0!important;
    padding:0!important;
    min-width:0!important;
  }

  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type > label > span:first-child{
    margin:0!important;
    padding:0!important;
    height:auto!important;
    line-height:1.3!important;
  }

  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type .db-sleep-control,
  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type input[type="date"],
  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type select[name="sleep_period"]{
    display:block!important;
    width:100%!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type .db-sleep-control{
    position:relative!important;
  }

  #sleepModal .db-sleep-form > .db-sleep-row:first-of-type .db-sleep-control > input[type="date"]{
    position:relative!important;
    top:0!important;
    left:0!important;
  }
}


/* =========================================================
   V309 — Diário do Sono / Novo registro DESKTOP
   Normalização final de margens e alinhamentos de todo o formulário.
========================================================= */
@media(min-width:821px){
  #sleepModal .db-sleep-form{
    display:grid!important;
    gap:16px!important;
  }

  #sleepModal .db-sleep-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    width:100%!important;
    margin:0!important;
  }

  #sleepModal .db-sleep-row > label{
    display:grid!important;
    grid-template-rows:auto 46px!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-row > label > span:first-child{
    display:block!important;
    margin:0!important;
    padding:0!important;
    line-height:1.3!important;
  }

  #sleepModal .db-sleep-control,
  #sleepModal .db-sleep-row input,
  #sleepModal .db-sleep-row select{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-control{
    position:relative!important;
    display:block!important;
  }

  #sleepModal .db-sleep-control > input{
    position:relative!important;
    top:0!important;
    left:0!important;
  }

  #sleepModal .db-sleep-form select{
    -webkit-appearance:none!important;
    appearance:none!important;
    padding:11px 40px 11px 12px!important;
    background-color:#fff!important;
    background-image:
      linear-gradient(45deg, transparent 50%, #6d7680 50%),
      linear-gradient(135deg, #6d7680 50%, transparent 50%)!important;
    background-position:
      calc(100% - 18px) 50%,
      calc(100% - 13px) 50%!important;
    background-size:5px 5px, 5px 5px!important;
    background-repeat:no-repeat!important;
  }

  #sleepModal .db-sleep-quality{
    margin:0!important;
    padding:0!important;
    border:0!important;
  }

  #sleepModal .db-sleep-quality legend{
    margin:0 0 8px!important;
    padding:0!important;
  }

  #sleepModal textarea{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    margin:0!important;
  }

  #sleepModal .db-sleep-footer{
    margin:0!important;
  }
}


/* =========================================================
   V310 — Diário / Qualidade do sono DESKTOP
   Ruim, Regular, Boa e Ótima mudam de cor ao selecionar.
========================================================= */
@media(min-width:821px){
  #sleepModal .db-sleep-quality-options label{
    cursor:pointer!important;
  }

  #sleepModal .db-sleep-quality-options label > input[type="radio"]{
    position:absolute!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  #sleepModal .db-sleep-quality-options label > span{
    transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease!important;
  }

  /* Ruim */
  #sleepModal .db-sleep-quality-options label:nth-child(1) > input:checked + span{
    background:#fdecec!important;
    border-color:#e8a5a5!important;
    box-shadow:0 0 0 2px rgba(201,87,87,.08)!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(1) > input:checked + span small{
    color:#a74444!important;
  }

  /* Regular */
  #sleepModal .db-sleep-quality-options label:nth-child(2) > input:checked + span{
    background:#fff5df!important;
    border-color:#e6c57b!important;
    box-shadow:0 0 0 2px rgba(194,145,47,.08)!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(2) > input:checked + span small{
    color:#92701f!important;
  }

  /* Boa */
  #sleepModal .db-sleep-quality-options label:nth-child(3) > input:checked + span{
    background:#eaf6ef!important;
    border-color:#94caaa!important;
    box-shadow:0 0 0 2px rgba(71,148,103,.08)!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(3) > input:checked + span small{
    color:#397a55!important;
  }

  /* Ótima */
  #sleepModal .db-sleep-quality-options label:nth-child(4) > input:checked + span{
    background:#eaf3fb!important;
    border-color:#91badb!important;
    box-shadow:0 0 0 2px rgba(73,131,179,.08)!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(4) > input:checked + span small{
    color:#3d719b!important;
  }
}


/* =========================================================
   V311 — Diário do Sono / revisão final MOBILE
   Mantém desktop intacto. Normaliza campos, margens, rolagem,
   ícones, selects, qualidade e botão no mobile.
========================================================= */
@media(max-width:820px){
  #sleepModal .db-sleep-card{
    width:min(100%,520px)!important;
    max-width:520px!important;
    margin:auto!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-form{
    width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
  }

  #sleepModal .db-sleep-row{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }

  #sleepModal .db-sleep-row > label,
  #sleepModal .db-sleep-full{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-form label > span:first-child{
    display:block!important;
    margin:0 0 7px!important;
  }

  #sleepModal .db-sleep-control,
  #sleepModal .db-sleep-form input,
  #sleepModal .db-sleep-form select,
  #sleepModal .db-sleep-form textarea{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-form input,
  #sleepModal .db-sleep-form select{
    min-height:50px!important;
  }

  #sleepModal .db-sleep-form select{
    -webkit-appearance:none!important;
    appearance:none!important;
    padding:12px 40px 12px 13px!important;
    background-color:#fff!important;
    background-image:
      linear-gradient(45deg, transparent 50%, #6d7680 50%),
      linear-gradient(135deg, #6d7680 50%, transparent 50%)!important;
    background-position:
      calc(100% - 18px) 50%,
      calc(100% - 13px) 50%!important;
    background-size:5px 5px,5px 5px!important;
    background-repeat:no-repeat!important;
  }

  #sleepModal .db-sleep-control > svg{
    right:14px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    pointer-events:none!important;
  }

  #sleepModal .db-sleep-quality{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }

  #sleepModal .db-sleep-quality-options{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
  }

  #sleepModal .db-sleep-quality-options label{
    min-width:0!important;
  }

  #sleepModal .db-sleep-quality-options label > span{
    width:100%!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-form textarea{
    min-height:82px!important;
    resize:vertical!important;
  }

  #sleepModal .db-sleep-footer{
    width:100%!important;
    box-sizing:border-box!important;
  }

  #sleepModal .db-sleep-footer .gradient-btn{
    width:100%!important;
    min-height:48px!important;
    margin:0!important;
  }
}

@media(max-width:420px){
  #sleepModal .db-sleep-row{gap:13px!important}
  #sleepModal .db-sleep-quality-options{gap:6px!important}
}


/* =========================================================
   V312 — Diário do Sono / Qualidade mobile clicável
   Garante que cada card inteiro seja área de toque.
========================================================= */
@media(max-width:820px){
  #sleepModal .db-sleep-quality-options label{
    position:relative!important;
    display:block!important;
    min-width:0!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:transparent!important;
    touch-action:manipulation!important;
  }

  #sleepModal .db-sleep-quality-options label > input[type="radio"]{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    opacity:0!important;
    z-index:5!important;
    cursor:pointer!important;
    pointer-events:auto!important;
  }

  #sleepModal .db-sleep-quality-options label > span{
    position:relative!important;
    z-index:1!important;
    pointer-events:none!important;
    width:100%!important;
    min-height:62px!important;
    box-sizing:border-box!important;
    transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease!important;
  }

  /* estado selecionado também visível no mobile */
  #sleepModal .db-sleep-quality-options label:nth-child(1) > input:checked + span{
    background:#fdecec!important;
    border-color:#e8a5a5!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(2) > input:checked + span{
    background:#fff5df!important;
    border-color:#e6c57b!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(3) > input:checked + span{
    background:#eaf6ef!important;
    border-color:#94caaa!important;
  }
  #sleepModal .db-sleep-quality-options label:nth-child(4) > input:checked + span{
    background:#eaf3fb!important;
    border-color:#91badb!important;
  }

  #sleepModal .db-sleep-quality-options label:nth-child(1) > input:checked + span small{color:#a74444!important}
  #sleepModal .db-sleep-quality-options label:nth-child(2) > input:checked + span small{color:#92701f!important}
  #sleepModal .db-sleep-quality-options label:nth-child(3) > input:checked + span small{color:#397a55!important}
  #sleepModal .db-sleep-quality-options label:nth-child(4) > input:checked + span small{color:#3d719b!important}
}


/* V313 — ajuste final mobile em Sons + Choro aberto com gravação Premium */
@media(max-width:820px){
  html body .sound-page-v130 .sound-tile{
    min-height:156px !important;
  }
  html body .sound-page-v130 .sound-tile .play-sound{
    margin-top:12px !important;
    align-self:flex-end !important;
  }
}

/* V314 — Sons para Dormir: play mais abaixo no card somente no mobile */
@media(max-width:820px){
  html body .sound-page-v130 .sound-tile{
    min-height:172px !important;
  }
  html body .sound-page-v130 .sound-tile .play-sound,
  html body .sound-page-v130 .sound-tile.is-playing .play-sound{
    margin-top:24px !important;
    margin-bottom:0 !important;
    align-self:flex-end !important;
    flex:0 0 auto !important;
  }
}

/* =========================================================
   V315 — Sons mobile: play mais baixo + volume/timers legíveis
========================================================= */
@media(max-width:820px){
  /* Cards das músicas: cria respiro real entre texto e play degradê */
  html body .sound-page-v130 .spotify-grid .sound-tile{
    min-height:190px!important;
    padding:13px 12px 14px!important;
  }
  html body .sound-page-v130 .spotify-grid .sound-tile small{
    display:block!important;
    min-height:30px!important;
    line-height:1.45!important;
  }
  html body .sound-page-v130 .spotify-grid .sound-tile .play-sound,
  html body .sound-page-v130 .spotify-grid .sound-tile.is-playing .play-sound{
    margin-top:auto!important;
    margin-bottom:0!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    align-self:flex-end!important;
    flex:0 0 auto!important;
  }

  /* Player principal: volume em uma linha e tempos grandes abaixo */
  #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:11px!important;
    width:100%!important;
  }
  #soundPlayer.sound-player-v131 .sound-volume-label{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:10px!important;
    width:100%!important;
    font-size:11px!important;
    font-weight:600!important;
  }
  #soundPlayer.sound-player-v131 #volume{
    -webkit-appearance:none!important;
    appearance:none!important;
    display:block!important;
    width:100%!important;
    height:5px!important;
    min-width:0!important;
    border-radius:999px!important;
    outline:0!important;
    background:linear-gradient(to right,#6DB2C8 0%,#ED9D9C var(--volume-fill,32%),#e5e8eb var(--volume-fill,32%),#e5e8eb 100%)!important;
  }
  #soundPlayer.sound-player-v131 #volume::-webkit-slider-runnable-track{
    height:5px!important;
    border:0!important;
    border-radius:999px!important;
    background:transparent!important;
  }
  #soundPlayer.sound-player-v131 #volume::-webkit-slider-thumb{
    -webkit-appearance:none!important;
    appearance:none!important;
    width:16px!important;
    height:16px!important;
    margin-top:-5.5px!important;
    border:2px solid #fff!important;
    border-radius:50%!important;
    background:#6DB2C8!important;
    box-shadow:0 1px 4px rgba(0,0,0,.18)!important;
  }
  #soundPlayer.sound-player-v131 #volume::-moz-range-track{
    height:5px!important;
    border:0!important;
    border-radius:999px!important;
    background:#e5e8eb!important;
  }
  #soundPlayer.sound-player-v131 #volume::-moz-range-progress{
    height:5px!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,#6DB2C8,#ED9D9C)!important;
  }
  #soundPlayer.sound-player-v131 #volume::-moz-range-thumb{
    width:14px!important;
    height:14px!important;
    border:2px solid #fff!important;
    border-radius:50%!important;
    background:#6DB2C8!important;
    box-shadow:0 1px 4px rgba(0,0,0,.18)!important;
  }

  #soundPlayer.sound-player-v131 .sound-timers-v131{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:6px!important;
    width:100%!important;
    max-width:none!important;
    overflow:visible!important;
  }
  #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    width:100%!important;
    min-width:0!important;
    height:34px!important;
    padding:0 5px!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:600!important;
    white-space:nowrap!important;
  }
}

@media(max-width:390px){
  html body .sound-page-v130 .spotify-grid .sound-tile{min-height:186px!important}
  #soundPlayer.sound-player-v131 .sound-timers-v131 button{font-size:10.5px!important}
}


/* =========================================================
   V316 — Sons mobile final: timers maiores + infinito em ícone
========================================================= */
@media(max-width:820px){
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    min-height:40px!important;
    height:40px!important;
    padding:0 7px!important;
    font-size:14px!important;
    line-height:1!important;
    font-weight:700!important;
    letter-spacing:-.01em!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button .infinity-icon{
    display:inline-block!important;
    font-size:25px!important;
    line-height:.8!important;
    font-weight:600!important;
    transform:translateY(-1px)!important;
  }
}
@media(max-width:390px){
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    font-size:13px!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button .infinity-icon{
    font-size:24px!important;
  }
}
\n\n/* =========================================================\n   V317 — Sons mobile: tipografia visível + prioridade final\n========================================================= */\n@media (max-width:820px){\n  html body #soundPlayer.sound-player-v131 .sound-timers-v131{\n    display:grid!important;\n    grid-template-columns:repeat(4,minmax(0,1fr))!important;\n    gap:8px!important;\n    width:100%!important;\n  }\n  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button,\n  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button,\n  html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button{\n    min-height:44px!important;\n    height:44px!important;\n    padding:0 6px!important;\n    font-size:16px!important;\n    line-height:44px!important;\n    font-weight:700!important;\n    letter-spacing:-.02em!important;\n    text-align:center!important;\n    white-space:nowrap!important;\n  }\n  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer=\"infinite\"] .infinity-icon,\n  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button[data-timer=\"infinite\"] .infinity-icon{\n    display:inline-block!important;\n    font-size:31px!important;\n    line-height:40px!important;\n    font-weight:600!important;\n    vertical-align:middle!important;\n    transform:none!important;\n  }\n}\n@media (max-width:390px){\n  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button,\n  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button{\n    font-size:15px!important;\n  }\n  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer=\"infinite\"] .infinity-icon{\n    font-size:30px!important;\n  }\n}\n
/* =========================================================
   V318 — Sons mobile final: timers médios + volume preenchido
========================================================= */
#soundPlayer.sound-player-v131 #volume{
  --volume-fill:32%;
  -webkit-appearance:none!important;
  appearance:none!important;
  height:4px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#6DB2C8 0%,#ED9D9C var(--volume-fill),#e4e8eb var(--volume-fill),#e4e8eb 100%)!important;
  outline:none!important;
}
#soundPlayer.sound-player-v131 #volume::-webkit-slider-runnable-track{
  height:4px!important;
  border-radius:999px!important;
  background:transparent!important;
}
#soundPlayer.sound-player-v131 #volume::-webkit-slider-thumb{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:14px!important;
  height:14px!important;
  margin-top:-5px!important;
  border:2px solid #fff!important;
  border-radius:50%!important;
  background:#6DB2C8!important;
  box-shadow:0 1px 4px rgba(0,0,0,.18)!important;
}
#soundPlayer.sound-player-v131 #volume::-moz-range-track{
  height:4px!important;
  border-radius:999px!important;
  background:#e4e8eb!important;
}
#soundPlayer.sound-player-v131 #volume::-moz-range-progress{
  height:4px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#6DB2C8,#ED9D9C)!important;
}
#soundPlayer.sound-player-v131 #volume::-moz-range-thumb{
  width:14px!important;
  height:14px!important;
  border:2px solid #fff!important;
  border-radius:50%!important;
  background:#6DB2C8!important;
}
@media(max-width:820px){
  #soundPlayer.sound-player-v131 .sound-timers-v131 button{
    min-width:49px!important;
    height:30px!important;
    padding:0 7px!important;
    font-size:10.5px!important;
    font-weight:600!important;
    line-height:1!important;
  }
  #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"]{
    min-width:38px!important;
    width:38px!important;
    font-size:18px!important;
    padding:0!important;
  }
  #soundPlayer.sound-player-v131 .sound-timers-v131 .infinity-icon{
    font-size:18px!important;
    line-height:1!important;
  }
}

/* =========================================================
   V319 — Sons mobile: timers menores + volume funcional final
========================================================= */
@media(max-width:820px){
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button,
  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button,
  html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button,
  html body #soundPlayer.sound-player-v131[data-playing="true"] .sound-timers-v131 button{
    min-width:0!important;
    width:100%!important;
    height:29px!important;
    min-height:29px!important;
    padding:0 4px!important;
    font-size:9px!important;
    line-height:29px!important;
    font-weight:600!important;
    letter-spacing:0!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button[data-timer="infinite"],
  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button[data-timer="infinite"],
  html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button[data-timer="infinite"]{
    width:100%!important;
    min-width:0!important;
    padding:0!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 .infinity-icon,
  html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 .infinity-icon{
    font-size:15px!important;
    line-height:29px!important;
    font-weight:600!important;
    transform:none!important;
  }

  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    font-size:8.5px!important;
  }
  html body #soundPlayer.sound-player-v131 #volume{
    --volume-fill:32%;
    -webkit-appearance:none!important;
    appearance:none!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:18px!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
    touch-action:pan-x!important;
  }
  html body #soundPlayer.sound-player-v131 #volume::-webkit-slider-runnable-track{
    height:4px!important;
    border:0!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,#6DB2C8 0%,#ED9D9C var(--volume-fill,32%),#dfe4e8 var(--volume-fill,32%),#dfe4e8 100%)!important;
  }
  html body #soundPlayer.sound-player-v131.is-playing #volume::-webkit-slider-runnable-track,
  html body #soundPlayer.sound-player-v131[data-playing="true"] #volume::-webkit-slider-runnable-track{
    background:linear-gradient(90deg,#fff 0%,#fff var(--volume-fill,32%),rgba(255,255,255,.35) var(--volume-fill,32%),rgba(255,255,255,.35) 100%)!important;
  }
  html body #soundPlayer.sound-player-v131 #volume::-webkit-slider-thumb{
    -webkit-appearance:none!important;
    appearance:none!important;
    width:14px!important;
    height:14px!important;
    margin-top:-5px!important;
    border:2px solid #fff!important;
    border-radius:50%!important;
    background:#6DB2C8!important;
    box-shadow:0 1px 4px rgba(0,0,0,.2)!important;
  }
  html body #soundPlayer.sound-player-v131.is-playing #volume::-webkit-slider-thumb,
  html body #soundPlayer.sound-player-v131[data-playing="true"] #volume::-webkit-slider-thumb{
    background:#fff!important;
  }
  html body #soundPlayer.sound-player-v131 #volume::-moz-range-track{
    height:4px!important;
    border-radius:999px!important;
    background:#dfe4e8!important;
  }
  html body #soundPlayer.sound-player-v131 #volume::-moz-range-progress{
    height:4px!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,#6DB2C8,#ED9D9C)!important;
  }
}

/* =========================================================
   V320 — Sons: player "Tocando" mobile estável
========================================================= */
@media (max-width:820px){
  html body #soundPlayer.sound-player-v131,
  html body #soundPlayer.sound-player-v131.has-track,
  html body #soundPlayer.sound-player-v131.has-track.is-playing{
    left:10px!important;
    right:10px!important;
    bottom:72px!important;
    width:auto!important;
    max-width:none!important;
    padding:12px 12px 11px!important;
    border-radius:16px!important;
    overflow:hidden!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-player-top{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) 38px!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
  }
  html body #soundPlayer.sound-player-v131 .player-cover{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    border-radius:11px!important;
    display:grid!important;
    place-items:center!important;
    margin:0!important;
  }
  html body #soundPlayer.sound-player-v131 .player-copy{
    min-width:0!important;
    width:100%!important;
    display:block!important;
    overflow:hidden!important;
  }
  html body #soundPlayer.sound-player-v131 .player-copy small{
    display:block!important;
    font-size:8px!important;
    line-height:1.15!important;
    margin:0 0 2px!important;
  }
  html body #soundPlayer.sound-player-v131 .player-copy b{
    display:block!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #soundPlayer.sound-player-v131 .player-copy span{
    display:block!important;
    font-size:9px!important;
    line-height:1.25!important;
    margin-top:2px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #soundPlayer.sound-player-v131 #playPause.sound-player-play{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
  }
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:end!important;
    gap:10px!important;
    width:100%!important;
    margin:9px 0 0!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-volume-label{
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
    display:grid!important;
    gap:3px!important;
    margin:0!important;
  }
  html body #soundPlayer.sound-player-v131 #volume{
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131{
    display:grid!important;
    grid-template-columns:repeat(4,34px)!important;
    gap:4px!important;
    width:auto!important;
    margin:0!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button,
  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button,
  html body #soundPlayer.sound-player-v131.is-playing .sound-timers-v131 button{
    width:34px!important;
    min-width:34px!important;
    height:28px!important;
    min-height:28px!important;
    padding:0 2px!important;
    font-size:8.5px!important;
    line-height:28px!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 .infinity-icon{
    font-size:15px!important;
    line-height:28px!important;
  }
  html body #soundPlayer.sound-player-v131.has-track #volume::-webkit-slider-runnable-track{
    height:4px!important;
    background:linear-gradient(90deg,#fff 0%,#fff var(--volume-fill,32%),rgba(255,255,255,.30) var(--volume-fill,32%),rgba(255,255,255,.30) 100%)!important;
  }
}
@media (max-width:390px){
  html body #soundPlayer.sound-player-v131 .player-controls.sound-player-controls-v131{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131{
    grid-template-columns:repeat(4,31px)!important;
    gap:3px!important;
  }
  html body #soundPlayer.sound-player-v131 .sound-timers-v131 button,
  html body #soundPlayer.sound-player-v131.has-track .sound-timers-v131 button{
    width:31px!important;
    min-width:31px!important;
    font-size:8px!important;
  }
}


/* DormeBaby V324 — ajuste visual do popup Premium no mobile */
@media (max-width: 767px) {
  [class*="premium"][class*="modal"] [class*="content"],
  [class*="premium"][class*="popup"] [class*="content"],
  .premium-modal,
  .premium-popup {
    box-sizing: border-box !important;
    max-width: calc(100vw - 28px) !important;
  }

  [class*="premium"] h1,
  [class*="premium"] h2,
  [class*="premium"] h3 {
    font-size: 21px !important;
    line-height: 1.22 !important;
    letter-spacing: -0.02em !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  [class*="premium"] p,
  [class*="premium"] li,
  [class*="premium"] span:not(.material-symbols-outlined):not(.material-icons) {
    line-height: 1.45 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }

  [class*="premium"] p {
    font-size: 14px !important;
  }

  [class*="premium"] li {
    font-size: 13px !important;
  }

  [class*="premium"] button,
  [class*="premium"] a[class*="btn"],
  [class*="premium"] a[class*="button"] {
    white-space: normal !important;
    line-height: 1.25 !important;
    min-height: 46px !important;
    height: auto !important;
    text-align: center !important;
  }
}


/* =========================================================
   V325 — Popup Premium de Favoritos / Sons para Dormir
   Corrige botão comprimido ao lado de "Agora não"
========================================================= */
#soundPremiumModal .nanabot-premium-dialog{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
}

#soundPremiumModal .nanabot-premium-lock{
  flex:0 0 auto !important;
}

#soundPremiumModal .eyebrow,
#soundPremiumModal h2,
#soundPremiumModal p{
  align-self:center !important;
  width:100% !important;
}

#soundPremiumModal .nanabot-premium-btn{
  display:flex !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  margin:20px 0 0 !important;
  padding:0 16px !important;
  min-height:50px !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
  overflow:visible !important;
}

#soundPremiumModal .nanabot-premium-btn .premium-btn-label{
  display:block !important;
  min-width:0 !important;
  white-space:nowrap !important;
  font-size:13px !important;
  line-height:1.2 !important;
}

#soundPremiumModal .nanabot-premium-later{
  display:block !important;
  width:auto !important;
  align-self:center !important;
  margin:10px auto 0 !important;
  padding:7px 14px !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

@media(max-width:620px){
  #soundPremiumModal{
    padding:16px !important;
  }

  #soundPremiumModal .nanabot-premium-dialog{
    width:100% !important;
    max-width:430px !important;
    padding:28px 20px 22px !important;
  }

  #soundPremiumModal .nanabot-premium-btn{
    min-height:48px !important;
    padding:0 12px !important;
  }

  #soundPremiumModal .nanabot-premium-btn .premium-btn-label{
    font-size:12px !important;
  }

  #soundPremiumModal .nanabot-premium-later{
    font-size:11px !important;
  }
}

@media(max-width:370px){
  #soundPremiumModal .nanabot-premium-btn .premium-btn-label{
    font-size:11px !important;
  }
}