/* ========================================================================== LEMONADE — design system, faithful to Somatic Emotion Atlas v43. Inlined into every page so each page is self-contained (open directly, upload anywhere — no folder, no build step). ========================================================================== */ :root{ --bg:#F9FAFB; --paper:#FFFFFF; --cream:#FBF6EC; --ink:#2C2218; --soft:#5C4A32; --muted:#8A7B66; --line:#E7DCC8; --line2:#E5E7EB; --rose:#B5446E; --rose-soft:#F6E7EC; --green-bg:#EAF4EE; --green:#1D7A57; --green-pill:#2E9E6E; --gold:#C08A2D; --amber-soft:#EAD8B4; --radius:14px; --font-serif:Georgia,"Times New Roman",serif; --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --shadow:0 4px 16px rgba(80,60,30,.06); --maxw:1044px; } *{box-sizing:border-box} html,body{margin:0} body{background:var(--bg);color:var(--ink);font-family:var(--font-sans); font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased} .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;width:100%} h1,h2,h3{font-family:var(--font-serif);font-weight:600;line-height:1.14;text-align:center} h1{font-size:clamp(28px,5vw,42px);letter-spacing:-.015em;margin:0 0 14px} h2{font-size:clamp(22px,3.6vw,28px);margin:40px 0 14px} h3{font-size:19px;margin:22px 0 8px} p{margin:0 0 15px} a{color:var(--rose);text-decoration:none} a:hover{text-decoration:underline} em,i{font-style:italic} strong,b{font-weight:700} .site-head{background:var(--paper);border-bottom:1px solid var(--line2);position:sticky;top:0;z-index:500} body.nav-static .site-head{position:static} h1[id],h2[id],h3[id],h4[id],.chap[id]{scroll-margin-top:112px} .sticky-toggle{background:none;border:1px solid var(--line2);border-radius:8px;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;color:var(--muted);flex:0 0 auto} .sticky-toggle:hover{border-color:var(--rose);color:var(--rose)} .sticky-toggle.off{opacity:.45} .site-head .wrap{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 22px} .site-head-top{display:flex;align-items:center;justify-content:center;gap:10px} .brand{font-family:var(--font-serif);font-size:21px;font-weight:600;color:var(--ink)} .brand:hover{text-decoration:none} .site-nav{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;align-items:center;row-gap:4px} .site-nav>a{display:inline-flex;align-items:center;line-height:1} .site-nav a{color:var(--soft);font-size:14.5px;font-weight:600;white-space:nowrap} @media(max-width:780px){ .site-nav{gap:12px} .site-nav a{font-size:13.5px} } @media(max-width:520px){ .site-nav{gap:9px 14px} .site-nav a{font-size:12.5px} .brand{font-size:19px} } /* ---- header actions + pinned entry pills ---- */ .head-actions{display:flex;align-items:center;gap:9px} .head-pill{display:inline-flex;align-items:center;font-size:13px;font-weight:700;color:var(--ink);background:#fdfbc4;border:1px solid #E7DE8C;border-radius:999px;padding:6px 13px;white-space:nowrap} .head-pill:hover{background:#f6ef9f;color:var(--ink);border-color:#D8CE6E;text-decoration:none} .nav-toggle{display:none;background:none;border:1px solid var(--line2);border-radius:8px;width:34px;height:30px;align-items:center;justify-content:center;cursor:pointer;font-size:16px;color:var(--soft)} .nav-toggle:hover{border-color:var(--rose);color:var(--rose)} /* ---- dropdown menus ---- */ .nav-drop{position:relative;display:inline-flex;align-items:center} .nav-drop-t{font-family:var(--font-sans);color:var(--soft);font-size:14.5px;font-weight:600;line-height:1;background:none;border:0;cursor:pointer;padding:0;display:inline-flex;align-items:center;gap:4px;white-space:nowrap} .nav-drop-t:hover,.nav-drop-t[aria-expanded="true"]{color:var(--rose)} .nav-drop .caret{font-size:9px;transition:transform .15s} .nav-drop-t[aria-expanded="true"] .caret{transform:rotate(180deg)} .nav-drop-menu{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);min-width:212px;max-width:calc(100vw - 24px);max-height:calc(100vh - 110px);overflow-y:auto;background:var(--paper);border:1px solid var(--line2);border-radius:12px;box-shadow:0 10px 30px rgba(80,60,30,.14);padding:8px;display:none;flex-direction:column;gap:1px;z-index:600} .nav-drop-menu a{display:block;padding:8px 12px;border-radius:8px;font-size:14px;color:var(--soft);font-weight:600;white-space:nowrap;text-align:left} .nav-drop-menu a:hover{background:var(--rose-soft);color:var(--rose);text-decoration:none} .nav-drop-sub{font-family:var(--font-sans);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:11px 12px 4px;border-top:1px solid var(--line2);margin-top:5px} .nav-drop.open .nav-drop-menu{display:flex} @media(max-width:780px){ .nav-drop-t{font-size:13.5px} } /* ---- mobile: collapse nav behind a toggle ---- */ @media(max-width:820px){ .nav-toggle{display:inline-flex} .site-nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;padding-top:6px} .site-nav.open{display:flex} .site-nav>a,.site-nav .nav-drop-t{padding:11px 4px;border-bottom:1px solid var(--line2);width:100%;justify-content:space-between;font-size:15px} .site-nav .nav-drop{width:100%} .nav-drop-menu{position:static;transform:none;border:0;box-shadow:none;padding:2px 0 8px 14px;min-width:0;max-width:none} .nav-drop-menu a{white-space:normal;line-height:1.35} .head-pill{font-size:12px;padding:5px 10px} } .crumb{text-align:center;font-size:13px;color:var(--muted);margin:22px 0 4px} .crumb a{color:var(--muted)} .hero{text-align:center;padding:32px 24px 26px;border-radius:16px;margin-bottom:20px;overflow:hidden} .hero,.steel-header,.tool-header,.pv-steel-header{ background: radial-gradient(circle, rgba(255,255,255,.9) 1.1px, transparent 1.5px) 0 0 / 21px 21px, radial-gradient(circle, rgba(255,255,255,.55) 1.7px, transparent 2.1px) 10.5px 10.5px / 42px 42px, radial-gradient(ellipse 72% 125% at 50% 50%, #FCF9CD 0%, #DBEAFE 50%, #FEE2E2 100%); max-width:var(--maxw);margin-left:auto;margin-right:auto; } .steel-header,.tool-header,.pv-steel-header{border-radius:16px;margin-bottom:22px;overflow:hidden} /* Homepage-only header: full-bleed, taller, stronger gradient. Scoped to .hero.hero-home so every other page (including per-emotion .hero bands) keeps the standard contained band above untouched. */ .hero.hero-home{ width:100vw; margin-left:50%; margin-right:50%; transform:translateX(-50%); max-width:none; border-radius:0; padding-top:42px; padding-bottom:34px; /* ~25% taller than the standard 32px/26px band */ background: radial-gradient(circle, rgba(255,255,255,.72) 1.1px, transparent 1.5px) 0 0 / 21px 21px, radial-gradient(circle, rgba(255,255,255,.4) 1.7px, transparent 2.1px) 10.5px 10.5px / 42px 42px, radial-gradient(ellipse 72% 125% at 50% 50%, #FCF9CD 0%, #FCF9CD 12%, #DBEAFE 50%, #FEE2E2 100%); } .eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--rose);font-weight:700;margin:0 0 10px;text-align:center} .card{background:var(--paper);border:1px solid var(--line2);border-radius:var(--radius);padding:22px 26px;margin:16px 0;box-shadow:var(--shadow)} .plain-answer{font-size:18.5px;line-height:1.62} .plain-answer .src{font-size:inherit;color:var(--muted)} .ev-badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;letter-spacing:.03em;border-radius:9px;padding:4px 10px;text-transform:uppercase} .ev-badge.measured{background:#DCEBE3;color:#1D6F52} .ev-badge.adjacent{background:#E7EEF6;color:#37597B} .ev-badge.approx{background:var(--amber-soft);color:#7A4A00} .ev-note{font-size:13.5px;color:var(--muted);margin-top:10px;text-align:center} /* body activation map */ .map-eyebrow{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);text-align:left;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px} .bodymap-grid{display:grid;grid-template-columns:150px 1fr;gap:26px;align-items:center} @media(max-width:600px){.bodymap-grid{grid-template-columns:1fr;justify-items:center}.region-bars{width:100%}} .silhouette{text-align:center} .silhouette svg{width:130px;height:auto} .silhouette .sil-name{font-family:var(--font-serif);font-weight:600;color:var(--soft);margin-top:6px} .region-bars{display:flex;flex-direction:column;gap:9px} .region-row{display:grid;grid-template-columns:118px 1fr 44px;align-items:center;gap:12px} @media(max-width:600px){.region-row{grid-template-columns:96px 1fr 40px;gap:8px}} .region-name{font-size:16px;color:var(--soft);text-align:left} .region-track{background:#E9E4DA;border-radius:99px;height:15px;overflow:hidden} .region-fill{height:100%;border-radius:99px;transition:width .5s ease} .region-pct{font-size:14px;font-weight:700;text-align:right;color:var(--ink)} .own-bodymap{grid-column:1 / -1;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line2)} .own-bm-head{font-size:14.5px;font-weight:700;color:var(--soft);margin-bottom:6px} .own-bm-hint{font-size:12px;color:var(--muted);margin-bottom:10px} .own-bm-taps{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;margin-bottom:10px} @media(max-width:600px){.own-bm-taps{grid-template-columns:1fr}} .own-bm-region{border:1.5px solid var(--line2);border-radius:12px;overflow:hidden;cursor:pointer} .own-bm-region:focus-visible{outline:2px solid var(--rose);outline-offset:2px} .own-bm-region-selected{border-color:var(--rose)} .own-bm-region-main{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:8px 10px;font-size:16px;font-weight:600;flex-wrap:wrap;row-gap:2px} .own-bm-region-name{white-space:nowrap} .own-bm-region-word{font-weight:400;opacity:.85} .own-bm-pips{display:inline-flex;align-items:center;gap:3px;margin-left:auto} .own-bm-pip{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.22;display:inline-block} .own-bm-pip-mid{opacity:.35} .own-bm-pip-on{opacity:1} .own-bm-lever{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;background:var(--cream);padding:10px 8px;border-top:1px dashed var(--line2)} .own-bm-lever-btn{border-radius:999px;border:1.5px solid var(--line2);background:var(--paper);font-size:12.5px;font-weight:600;cursor:pointer;color:var(--soft);padding:6px 12px} .own-bm-lever-btn:hover{border-color:var(--rose);color:var(--rose)} .own-bm-lever-btn:focus-visible{outline:2px solid var(--rose);outline-offset:2px} .own-bm-lever-label{font-size:12px;color:var(--soft);font-weight:600;min-width:74px;text-align:center;width:100%;order:4} .own-bm-done{margin:2px 0 12px} .own-bm-done-btn{font:inherit;font-weight:700;border-radius:9px;padding:9px 18px;cursor:pointer;background:var(--rose);color:#fff;border:1.5px solid var(--rose)} .own-bm-done-btn:hover{filter:brightness(0.97)} .own-bm-science{font-size:12px;color:var(--muted);margin:10px 0 0;line-height:1.5} .own-bm-nothing{margin-bottom:12px} .own-bm-nothing-btn{font:inherit;font-size:12.5px;color:var(--muted);background:none;border:none;text-decoration:underline;cursor:pointer;padding:0} .own-bm-nothing-btn:hover{color:var(--rose)} .own-bm-texture-row{background:var(--cream);border-radius:10px;padding:10px 14px;margin-bottom:12px} .own-bm-texture-label{font-size:13px;color:var(--soft);margin-bottom:8px} .own-bm-texture-label em{color:var(--muted);font-style:italic} .own-bm-texture-chips{display:flex;flex-wrap:wrap;gap:6px} .own-bm-texture{font:inherit;font-size:12px;border:1px solid var(--line2);background:var(--paper);border-radius:999px;padding:4px 10px;cursor:pointer;color:var(--soft)} .own-bm-texture:hover{border-color:var(--rose)} .own-bm-texture-active{background:var(--rose);border-color:var(--rose);color:#fff} .own-bm-texture-hint{font-size:12.5px;font-style:italic;color:var(--soft);margin-top:8px} .own-bm-texture-both{font-size:12px;color:var(--muted);margin:8px 0 0} .own-bm-texture-input{font:inherit;font-size:12.5px;width:100%;box-sizing:border-box;border:1px solid var(--line2);border-radius:8px;padding:6px 10px;margin-top:8px;background:var(--paper);color:var(--ink)} .own-bm-texture-input:focus-visible{outline:2px solid var(--rose);outline-offset:1px} .own-bm-texture-note{font-size:11.5px;color:var(--muted);margin:8px 0 0} .own-bm-intro{background:var(--cream);border-radius:12px;padding:14px 16px;margin-bottom:14px} .own-bm-intro p{font-size:13.5px;color:var(--soft);line-height:1.55;margin:0 0 8px} .own-bm-intro p:last-child{margin-bottom:0} .own-bm-intro-privacy{font-style:italic;color:var(--muted)} .own-bm-sowhat{margin:6px 0 14px} .own-bm-sowhat-found{font-size:15px;font-weight:700;color:var(--ink);margin:0 0 8px} .own-bm-sowhat-scale{font-size:12.5px;font-style:italic;color:var(--muted);margin:0} .own-bm-compare{display:flex;gap:22px;justify-content:center;margin:8px 0 12px;flex-wrap:wrap} .own-bm-col{text-align:center} .own-bm-col-label{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px} .own-bm-mini svg{width:78px;height:auto} .own-bm-blurred{position:relative;filter:blur(6px);pointer-events:none;user-select:none} .own-bm-gate{margin-top:6px} .own-bm-skip{font:inherit;font-size:11.5px;color:var(--muted);background:none;border:1px dashed var(--line2);border-radius:8px;padding:4px 10px;cursor:pointer} .own-bm-skip:hover{border-color:var(--rose);color:var(--rose)} .own-bm-note{font-size:13px;font-style:italic;color:var(--muted);margin:6px 0 10px} .own-bm-action{margin:4px 0 12px} .own-bm-action-dominant{background:var(--rose-soft);border-radius:14px;padding:16px 18px;text-align:center;margin:10px 0 16px} .own-bm-action-label{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px} .own-bm-action-dominant .own-bm-route{font-size:16px;padding:10px 20px} .own-bm-optin{background:var(--cream);border:1px dashed var(--line2);border-radius:12px;padding:14px 16px;margin:10px 0 16px} .own-bm-optin-q{font-size:13.5px;color:var(--soft);line-height:1.55;margin:0 0 10px} .own-bm-optin-btns{display:flex;gap:10px;flex-wrap:wrap} .own-bm-optin-yes{font:inherit;font-weight:700;border-radius:9px;padding:8px 16px;cursor:pointer;background:var(--rose);color:#fff;border:1.5px solid var(--rose)} .own-bm-optin-yes:hover{filter:brightness(0.97)} .own-bm-optin-no{font:inherit;font-size:13px;color:var(--muted);background:none;border:1px solid var(--line2);border-radius:9px;padding:8px 16px;cursor:pointer} .own-bm-optin-no:hover{border-color:var(--rose);color:var(--rose)} .own-bm-history{grid-column:1 / -1;margin-top:10px;padding-top:14px;border-top:1px dashed var(--line2)} .own-bm-hist-head h4{font-size:14.5px;font-weight:700;color:var(--soft);margin:0 0 6px} .own-bm-hist-copy{font-size:12px;color:var(--muted);margin:0 0 12px;line-height:1.5} .own-bm-hist-filter{font-size:12px;color:var(--muted);margin:0 0 10px} .own-bm-hist-filter-toggle{font:inherit;font-size:12px;color:var(--rose);background:none;border:none;text-decoration:underline;cursor:pointer;padding:0} .own-bm-hist-strip-v{display:flex;flex-direction:column;gap:10px} .own-bm-hist-item{border:1px solid var(--line2);border-radius:12px;padding:10px 12px;background:var(--paper)} .own-bm-hist-row{display:flex;gap:12px;align-items:flex-start} .own-bm-hist-thumb{flex:0 0 auto;background:none;border:1px solid var(--line2);border-radius:10px;padding:4px;cursor:pointer;width:64px} .own-bm-hist-thumb:hover{border-color:var(--rose)} .own-bm-hist-thumb svg{width:52px;height:auto;display:block} .own-bm-hist-content{flex:1 1 auto;min-width:0} .own-bm-hist-headline{display:flex;flex-wrap:wrap;align-items:baseline;gap:0;font-size:12px;color:var(--muted)} .own-bm-hist-date{font-weight:700;color:var(--soft)} .own-bm-hist-emotion{font-weight:700;color:var(--rose)} .own-bm-hist-edited{font-style:italic} .own-bm-hist-actions{margin-left:auto;display:flex;gap:10px;white-space:nowrap} .own-bm-hist-actions button{font:inherit;font-size:11.5px;background:none;border:none;cursor:pointer;padding:0;text-decoration:underline} .own-bm-hist-edit{color:var(--rose)} .own-bm-hist-del{color:#B1493F} .own-bm-hist-note{font-size:13px;font-weight:600;color:var(--ink);margin:4px 0 2px;font-style:italic} .own-bm-hist-words{font-size:12.5px;color:var(--soft);line-height:1.6;margin-top:3px;word-break:break-word} .own-bm-hist-expand-btn{font:inherit;font-size:12px;color:var(--rose);background:none;border:none;text-decoration:underline;cursor:pointer;padding:2px 0;margin-top:3px} .own-bm-hist-route-line{font-size:12px;margin-top:5px} .own-bm-hist-route{color:var(--rose);text-decoration:none} .own-bm-hist-route:hover{text-decoration:underline} .own-bm-hist-empty{font-size:13px;color:var(--muted);font-style:italic} .own-bm-hist-export-note{font-size:11px;color:var(--muted);font-style:italic;margin:8px 0 0} .own-bm-hist-controls{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px} .own-bm-hist-controls button{font:inherit;font-size:12.5px;color:var(--soft);background:var(--paper);border:1px solid var(--line2);border-radius:8px;padding:6px 12px;cursor:pointer} .own-bm-hist-controls button:hover{border-color:var(--rose);color:var(--rose)} .own-bm-hist-off{margin-left:auto} .own-bm-note-field{margin:10px 0} .own-bm-note-field label{display:block;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px} .own-bm-note-field label em{text-transform:none;font-weight:400;letter-spacing:0} .own-bm-note-input{font:inherit;font-size:13.5px;width:100%;box-sizing:border-box;border:1px solid var(--line2);border-radius:8px;padding:7px 10px;background:var(--paper);color:var(--ink)} .own-bm-edit-cancel,.own-bm-edit-cancel-2{font:inherit;font-size:12.5px;color:var(--muted);background:none;border:1px solid var(--line2);border-radius:8px;padding:4px 10px;cursor:pointer;margin-left:8px} .own-bm-edit-save{font:inherit;font-weight:700;border-radius:9px;padding:9px 18px;cursor:pointer;background:var(--rose);color:#fff;border:1.5px solid var(--rose)} .own-bm-save-remap{font:inherit;font-weight:600;border-radius:9px;padding:8px 16px;cursor:pointer;background:var(--paper);color:var(--rose);border:1.5px solid var(--rose)} .own-bm-save-remap:hover{background:var(--rose-soft)} .own-bm-route{display:inline-block;font-size:13px;font-weight:600;color:var(--rose);background:var(--rose-soft);border-radius:999px;padding:6px 14px;text-decoration:none} .own-bm-route:hover{filter:brightness(0.97)} .own-bm-buttons{display:flex;gap:10px;flex-wrap:wrap} .own-bm-remap,.own-bm-reset{font:inherit;font-size:12.5px;font-weight:600;color:var(--rose);background:none;border:1px solid var(--line2);border-radius:8px;padding:5px 12px;cursor:pointer} .own-bm-remap:hover,.own-bm-reset:hover{border-color:var(--rose)} .own-bm-remap-compare{display:flex;gap:22px;justify-content:center;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line2);flex-wrap:wrap} .cluster-box{background:#F4F2EE;border:1px solid var(--line);border-radius:var(--radius);padding:18px 24px;margin:18px 0} .cluster-box .cb-label{font-size:12.5px;color:var(--muted);letter-spacing:.02em} .cluster-box .cb-num{font-family:var(--font-serif);font-size:34px;font-weight:600;margin:2px 0 6px} .cluster-box .cb-cluster{font-size:16px;color:var(--soft)} .cluster-box .cb-badge{display:inline-block;margin-top:10px;font-size:11px;background:var(--amber-soft);color:#7A4A00;border-radius:8px;padding:3px 9px} .two-faces{display:grid;grid-template-columns:1fr 1fr;gap:14px} .two-faces .face.wide{grid-column:1 / -1} @media(max-width:560px){.two-faces{grid-template-columns:1fr}} .face{border:1px solid var(--line2);border-radius:var(--radius);padding:20px 24px} .face h3{text-align:left;margin-top:0} .face.healthy{background:#EFF6F1} .face.healthy h3{color:#1E7A55} .face.stuck{background:#FBF3E4} .face.stuck h3{color:#9A6B15} .subtype-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0} @media(max-width:640px){.subtype-grid{grid-template-columns:1fr}} .subtype.wide{grid-column:1 / -1} .subtype{background:var(--paper);border:1px solid var(--line2);border-radius:var(--radius);padding:18px 22px} .subtype .st-name{font-family:var(--font-serif);font-weight:600;font-size:18px;color:var(--rose);margin:0 0 6px} .sorting-q{background:var(--rose-soft);border-radius:var(--radius);padding:18px 24px;margin:18px 0;text-align:center;font-family:var(--font-serif);font-size:19px;font-style:italic;color:var(--ink)} .practice-setup{font-size:16.5px;color:var(--soft);text-align:center;max-width:620px;margin:0 auto 14px} .wave{background:var(--paper);border:1px solid var(--line2);border-radius:var(--radius);padding:24px;margin:16px 0;text-align:center;box-shadow:var(--shadow)} .wave canvas{width:100%;max-width:600px;height:120px;display:block;margin:0 auto 8px} .wave-journey{width:100%;max-width:600px;height:44px;display:block;margin:0 auto 10px;opacity:.9} .wave-stage{font-family:var(--font-serif);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--rose);font-weight:700;margin:6px 0 4px;min-height:18px} .wave-prompt{font-size:18px;line-height:1.5;min-height:56px;max-width:520px;margin:0 auto 14px} .wave-controls{display:flex;gap:10px;justify-content:center;flex-wrap:wrap} .wave-music-row{display:flex;align-items:center;gap:6px;justify-content:center;margin:10px 0 0;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch} .wave-music-row select{font:inherit;font-size:.78rem;border:1px solid var(--line2);border-radius:8px;padding:4px 6px;max-width:150px;flex:0 0 auto} .wave-music-row button{font:inherit;font-size:.78rem;font-weight:700;border:1px solid var(--line2);background:#F7F9FB;color:var(--ink,#2f3438);border-radius:999px;padding:4px 10px;cursor:pointer;white-space:nowrap;flex:0 0 auto} .wave-music-row input[type=range].wave-music-vol{flex:0 0 auto;width:78px} @media(max-width:480px){ .wave-music-row{flex-wrap:wrap;overflow-x:visible;row-gap:8px} .wave-music-row select{flex:1 1 100%;max-width:100%} .wave-music-row input[type=range].wave-music-vol{width:66px} } /* floating voice/music pills (wave engine, all emotion pages): keep volume reachable, never fully hidden, at any width — just a little narrower as the screen narrows. */ @media(max-width:640px){ #waveVoiceFloat,#waveMusicFloat{padding:6px 9px!important;gap:6px!important} #waveVoiceFloat input[type=range],#waveMusicFloat input[type=range]{width:64px!important} } @media(max-width:420px){ #waveVoiceFloat,#waveMusicFloat{padding:6px 8px!important;gap:5px!important} #waveVoiceFloat input[type=range],#waveMusicFloat input[type=range]{width:48px!important} } .btn{font-family:inherit;font-size:15px;font-weight:600;border-radius:11px;padding:11px 20px;cursor:pointer;border:2px solid var(--rose);background:var(--rose);color:#fff;transition:.15s} .btn:hover{filter:brightness(.96);text-decoration:none} .btn.ghost{background:transparent;color:var(--rose)} .btn.ghost:hover{background:var(--rose-soft)} .btn.quiet{border-color:var(--line2);background:transparent;color:var(--soft)} .btn.sm{font-size:13.5px;padding:8px 14px} .wave-end .opts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:12px 0} .wave-ground-offer{font-size:14.5px;color:var(--muted);margin:12px 0 0;text-align:center} .btn-link{font:inherit;font-weight:700;color:var(--rose);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline} .btn-link:hover{color:var(--soft)} .hidden{display:none!important} .ground-overlay{position:fixed;inset:0;z-index:9999;background:rgba(249,250,251,.98);display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px} .ground-overlay.on{display:flex} .ground-overlay h2{margin-top:0} .ground-overlay p{max-width:460px} .safety{background:var(--rose-soft);border:1px solid #E9CBD5;border-radius:var(--radius);padding:22px 28px;margin:24px 0} .safety h2{text-align:left;margin-top:0;color:var(--ink)} .safety p{margin-bottom:10px} .safety a{font-weight:600} .ref-divider{display:flex;align-items:center;gap:16px;margin:46px 0 8px} .ref-divider::before,.ref-divider::after{content:"";flex:1;height:1px;background:var(--line)} .ref-divider span,.ref-divider h2{font-family:var(--font-serif);font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600;white-space:nowrap;margin:0} .ref-intro{text-align:center;color:var(--muted);font-size:14.5px;max-width:560px;margin:0 auto 12px} .ref-block{background:var(--paper);border:1px solid var(--line2);border-radius:var(--radius);padding:18px 22px;margin:12px 0} .ref-block h3{text-align:left;margin:0 0 6px;color:var(--rose)} .ref-block.frame h3{color:var(--gold)} .ref-block .ref-quote{font-family:var(--font-serif);font-style:italic;color:var(--rose);font-size:16px} .companions{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);padding:16px 22px;margin:14px 0} .companions .co-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);margin-bottom:6px} .companions p{font-size:14.5px;color:var(--soft);margin:4px 0} .antidote-section{background:var(--green-bg);border-radius:18px;padding:26px 24px;margin:20px 0} .antidote-section h3{color:var(--green);text-align:center;letter-spacing:.04em;text-transform:uppercase;font-size:15px;margin:0 0 6px} .antidote-legend{font-size:13.5px;color:#4C6A5B;text-align:center;margin:0 0 18px;line-height:1.55} .antidote-legend .chip{margin:0 2px} .antidote-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px} .antidote{background:var(--paper);border-radius:14px;padding:18px 20px;box-shadow:0 2px 10px rgba(30,80,60,.05)} .antidote .a-name{font-family:var(--font-serif);font-weight:600;font-size:16.5px;color:var(--green);margin:0 0 10px} .antidote .a-body{font-size:14.5px;color:var(--soft);margin:0} .antidote .a-body ul{margin:6px 0 10px;padding-left:19px} .antidote .a-body li{margin:5px 0;line-height:1.5} .antidote .a-body .a-source{display:block;margin-top:8px;font-size:13px;color:var(--muted);font-style:italic} .chip{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;border-radius:99px;padding:4px 12px;white-space:nowrap;margin-bottom:10px} .chip.well{background:#bbe2c7;color:#14532D;border:1px solid #9BD3AE} .chip.promising{background:#edf7f0;color:#15803D;border:1px solid #C3E3D0} .chip.anecdotal{background:#DBEAFE;color:#1E40AF;border:1px solid #BFD8FB} .chip.contested{background:#FBEAEA;color:#9B3B3B;border:1px solid #F0C9C9} .lens{display:flex;align-items:center;justify-content:center;gap:10px;margin:22px 0 6px;font-size:13.5px;color:var(--soft);flex-wrap:wrap} .lens label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;border:1px dashed var(--line);border-radius:20px;padding:8px 16px;background:var(--paper)} .lens label:hover{border-color:var(--gold)} .hawkins{display:none;background:#F3EEE4;border:1px dashed #D8CFC0;border-radius:12px;padding:12px 18px;margin:6px 0;font-size:13.5px;color:var(--soft)} .hawkins.on{display:block} .hawkins .hk-label{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#9A7B4F;margin-bottom:4px} .go-deeper{background:var(--paper);border:1px solid var(--line2);border-radius:var(--radius);padding:20px 26px;margin:24px 0;text-align:center} .tool-link{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:13.5px;font-weight:700;color:var(--rose);background:var(--bg);border:1px solid var(--line2);border-radius:999px;padding:7px 14px;text-decoration:none} .tool-link:hover{border-color:var(--rose);text-decoration:underline} .faq details{border:1px solid var(--line2);border-radius:12px;background:var(--paper);padding:0 20px;margin:10px 0} .faq summary{font-family:var(--font-serif);font-weight:600;font-size:17px;cursor:pointer;padding:15px 0;list-style:none} .faq summary::-webkit-details-marker{display:none} .faq summary::after{content:"+";float:right;color:var(--rose);font-weight:700} .faq details[open] summary::after{content:"\2013"} .faq details[open] summary{border-bottom:1px solid var(--line2)} .faq .ans{padding:12px 0 16px;font-size:15.5px;color:var(--soft)} .related{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0} @media(max-width:560px){.related{grid-template-columns:1fr}} .related a{display:block;background:var(--paper);border:1px solid var(--line2);border-radius:12px;padding:14px 16px;color:var(--ink)} .related a:hover{text-decoration:none;border-color:var(--rose)} .related .r-name{font-family:var(--font-serif);font-weight:600;color:var(--rose)} .related .r-desc{font-size:15.5px;color:var(--muted);margin-top:3px;display:block} .sources{font-size:13.5px;color:var(--muted)} .sources ul{padding-left:18px;margin:8px 0} .sources li{margin:4px 0} .reviewer{font-style:italic;color:var(--soft);margin-top:8px} .review-claim{display:none} /* shown only if SHOW_REVIEWER is flipped true in lemonade.js */ .site-foot{border-top:1px solid var(--line2);background:var(--paper);margin-top:48px;padding:26px 22px;text-align:center;font-size:13.5px;color:var(--muted)} .site-foot a{color:var(--soft);margin:0 8px} .site-foot a.donate-link{color:var(--rose);font-weight:700} .site-foot .disclaimer{margin-top:12px;max-width:620px;margin-left:auto;margin-right:auto} /* donate card — book.html, overview.html, for-practitioners.html */ .donate-card{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:20px 24px;margin:24px 0;text-align:center} .donate-card .dc-row{display:flex;align-items:center;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:12px;text-align:left} .donate-card .dc-row img{width:120px;height:auto;border-radius:6px;box-shadow:0 6px 16px rgba(60,40,10,.15);flex:none} .donate-card .dc-row p{margin:0} .donate-card p{margin:0 0 12px;color:var(--soft);font-size:15px} .donate-amounts{display:flex;gap:8px;justify-content:center;flex-wrap:wrap} .donate-amounts a{display:inline-flex;align-items:center;font-size:13px;font-weight:700;color:var(--ink);background:#fdfbc4;border:1px solid #E7DE8C;border-radius:999px;padding:6px 16px;text-decoration:none;white-space:nowrap} .donate-amounts a:hover{background:#fbf5a8;text-decoration:none} .donate-amounts a.other{background:var(--paper);border-color:var(--line2)} .feel-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:20px 0} .feel{border:1.5px solid var(--line);background:var(--paper);border-radius:22px;padding:11px 20px;font-family:var(--font-serif);font-size:17px;font-weight:600;color:var(--ink);cursor:pointer;transition:.15s;box-shadow:0 1px 2px rgba(0,0,0,.04)} .feel:hover{border-color:var(--rose);color:var(--rose)} .gentle-toggle{display:flex;align-items:center;justify-content:center;gap:9px;font-size:14.5px;color:var(--soft);margin:8px 0 2px} .honesty-block{background:var(--rose-soft);border:1px solid #E9CBD5;border-radius:var(--radius);padding:24px;margin:22px 0;text-align:center} .honesty-block h2{margin-top:0} .center{text-align:center} /* Note: no blanket prefers-reduced-motion kill-switch here. Every animation on this site is a functional, user-triggered practice tool (breathing pacers, timers, attention cues) rather than passive decorative motion, and a global kill broke four separate tools in a row as new ones were built with different class names. Any tool that specifically wants a reduced-motion accommodation implements its own local override (see practices/somatic-tools.html's .attention-cloud). */ @media(max-width:480px){ .wrap{padding:0 16px} h1{font-size:26px} .card,.safety,.cluster-box,.antidote-section,.go-deeper{padding:16px 18px} } /* Lemonade acceptance phrases & inquiry */ .lemonade-phrases{background:#fdfbc4;border:1px solid #ECDF97;border-radius:16px;padding:24px 26px;margin:22px 0} .lemonade-phrases .lp-note{text-align:center;font-style:italic;color:var(--muted);font-size:13.5px;margin:0 0 14px} .lemonade-phrases .lp-title{text-align:center;color:var(--gold);font-size:15px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;margin:0 0 16px} .lemonade-phrases .lp-why{background:var(--paper);border-radius:12px;padding:14px 18px;font-size:14px;color:var(--soft);line-height:1.55;margin-bottom:18px} .lemonade-phrases .lp-why b{color:var(--ink)} .lemonade-phrases .lp-chapters-h{text-align:center;color:var(--gold);font-size:14px;letter-spacing:.04em;text-transform:uppercase;font-weight:700;margin:0 0 10px} .lp-chapter-pills{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:14px} .lp-pill{background:#F0D46B;color:#6B4310;font-weight:700;font-size:13px;padding:7px 14px;border-radius:999px;white-space:nowrap} .nav-lock-tag{font-size:10.5px;font-weight:700;color:#8a5a12;background:#FBEBD2;border-radius:999px;padding:2px 7px;margin-left:6px;text-transform:none;letter-spacing:0;vertical-align:1px} .lp-pill:hover,.lp-pill:focus-visible{background:#E8C64F;outline:none} /* chapter pill popup */ .ch-pop{position:absolute;z-index:900;display:none;width:300px;max-width:calc(100vw - 24px); background:var(--paper);border:1px solid var(--amber-soft);border-top:3px solid var(--gold); border-radius:12px;box-shadow:0 14px 40px rgba(60,40,10,.18);padding:14px 16px 12px;text-align:left} .ch-pop.open{display:block} .ch-pop.above{transform:translateY(-100%)} .ch-pop-x{position:absolute;top:8px;right:10px;background:none;border:0;font-size:18px;line-height:1; color:var(--muted);cursor:pointer;padding:2px 4px} .ch-pop-x:hover{color:var(--ink)} .ch-pop-t{font-family:var(--font-serif);font-weight:700;font-size:15px;color:var(--ink); margin:0 22px 6px 0;text-align:left} .ch-pop-s{font-size:13.5px;color:var(--soft);line-height:1.5;margin-bottom:10px;text-align:left} .ch-pop-link{display:inline-block;font-size:13px;font-weight:700;color:var(--rose)} .lp-why-chapters{font-size:14px;color:var(--soft);line-height:1.6;margin:0 0 18px} .lp-why-chapters b{color:var(--gold)} .lp-block{background:var(--paper);border-radius:12px;padding:16px 20px;margin-bottom:12px} .lp-label{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;color:var(--gold);margin-bottom:8px} .lp-phrases-list{list-style:none;margin:0;padding:0} .lp-phrases-list li{border-left:3px solid var(--gold);padding:6px 0 6px 12px;margin:6px 0;font-style:italic;color:var(--soft);font-size:14.5px} .lp-questions-list{margin:0;padding-left:20px;color:var(--soft);font-size:14.5px;line-height:1.6} .lp-questions-list li{margin:8px 0} /* practices index cards — consolidated from the former inline block + taxonomy additions */ .prac-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:16px 0} .prac-card{position:relative;display:block;background:var(--paper);border:1px solid var(--line2); border-radius:14px;padding:18px 20px;text-decoration:none} .prac-card:hover{border-color:var(--rose)} .prac-card b{display:block;font-family:var(--font-serif);font-size:17px;color:var(--ink); margin-bottom:4px;padding-right:74px} .prac-card span{display:block;font-size:14px;color:var(--soft)} .prac-card.soon{opacity:.6;cursor:default} .prac-card .tag{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-left:6px} .prac-card .prac-time{position:absolute;top:10px;right:10px;font-size:10.5px;letter-spacing:.04em; text-transform:uppercase;font-weight:700;color:var(--muted);background:var(--cream); border-radius:999px;padding:3px 8px;white-space:nowrap} .prac-bucket{font-family:var(--font-serif);font-size:19px;color:var(--ink); margin:34px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line2)} .prac-bucket:first-of-type{margin-top:18px} .prac-crisis{background:var(--rose-soft);border:1px solid var(--rose);border-radius:12px; padding:12px 16px;margin:18px 0 6px;font-size:15px} .prac-crisis a{color:var(--rose);font-weight:700} .nav-drop-urgent{background:var(--rose-soft);border-radius:8px;padding:4px;margin-bottom:4px} .nav-drop-urgent a{color:var(--rose)!important;font-weight:700} @media(max-width:520px){ .prac-card .prac-time{position:static;display:inline-block;margin:0 0 6px} .prac-card b{padding-right:0} } /* ===================== Component C — the Answer block (SEO snippet target) ===================== */ .answer{font-size:18px;color:var(--ink);line-height:1.6;margin:12px 0 10px;text-align:left;background:var(--paper);border:1px solid var(--line2);border-radius:12px;padding:16px 20px} .answer-bullets{margin:0 0 20px;padding:14px 18px 14px 34px;font-size:16.5px;color:var(--soft);line-height:1.6;background:var(--paper);border:1px solid var(--line2);border-radius:12px;list-style:disc} .answer-bullets li{margin:6px 0} .quick-jump{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 24px} .quick-jump a{font-size:14px;font-weight:600;color:var(--soft);background:var(--cream);border:1px solid var(--line2);border-radius:999px;padding:5px 12px;text-decoration:none} .quick-jump a:hover{border-color:var(--rose);color:var(--rose)} /* ===================== The wave ticker ===================== */ .wave-ticker{background:var(--cream);border:1px solid var(--line2);border-radius:12px;padding:16px 20px;margin:14px 0} .wt-state.hidden{display:none} .wt-prompt{font-size:14.5px;color:var(--soft);margin:0 0 10px;text-align:center} .wt-optional{font-size:12px;color:var(--muted);text-align:center;margin:10px 0 12px;font-style:italic} #wtSkipBtn{display:block;margin:0 auto} .wt-word-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:10px} .wt-word-btn{font:inherit;font-size:13.5px;font-weight:600;border:1.5px solid var(--line2);background:var(--paper);color:var(--ink);border-radius:999px;padding:8px 16px;cursor:pointer} .wt-word-btn:hover{border-color:var(--rose)} .wt-skip-word{display:block;margin:0 auto;font:inherit;font-size:12px;color:var(--muted);background:none;border:none;text-decoration:underline;cursor:pointer;padding:0} .wt-skip-word:hover{color:var(--rose)} .wt-scale{display:flex;gap:5px;justify-content:center;flex-wrap:wrap} .wt-btn{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line2);background:var(--paper);font:inherit;font-weight:700;font-size:13px;color:var(--ink);cursor:pointer;padding:0} .wt-btn:hover{border-color:var(--rose)} .wt-btn.on{background:var(--rose);border-color:var(--rose);color:#fff} .wt-btn:focus-visible{outline:2px solid var(--rose);outline-offset:2px} .wt-delta{font-family:var(--font-serif);font-size:16px;color:var(--ink);text-align:center;margin:0 0 8px} .wt-alt{text-align:center;font-size:13px;margin:0 0 8px} .wt-to-commit{display:block;margin:4px auto 12px} .wt-alt.hidden{display:none} .wt-alt a{color:var(--rose);font-weight:600} .wt-science{font-size:15.5px;color:var(--muted);margin:0;text-align:center} .wt-sentence{font-size:15.5px;color:var(--ink);line-height:2.1;margin:0 0 14px;text-align:center;max-width:100%;white-space:normal} .wt-sentence select,.wt-sentence input[type=text]{font:inherit;font-weight:600;color:var(--rose);border:none;border-bottom:2px solid var(--rose);background:none;display:inline-block;padding:6px 22px 10px 4px;min-width:160px;max-width:100%;min-height:40px;line-height:1.4;text-align:center;vertical-align:middle;box-sizing:border-box} .wt-sentence select{-webkit-appearance:none;appearance:none;cursor:pointer;text-align-last:center;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23B5446E'%3E%3Cpath d='M5.5 7.5L10 12l4.5-4.5' stroke='%23B5446E' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 2px center;background-size:14px} .wt-sentence input[type=text]{padding-right:4px} .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .wt-commit-row{display:flex;gap:10px;justify-content:center;margin-bottom:12px} .wt-commit-out{margin-top:6px;text-align:center} .wt-commit-out.hidden{display:none} .wt-plans{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line2)} .wt-plans h4{margin:0 0 4px;font-size:14px;text-align:center;color:var(--soft)} .wt-plans-sub{font-size:12px;color:var(--muted);text-align:center;margin:0 0 10px;font-style:italic} .wt-plan-row{background:var(--paper);border:1px solid var(--line2);border-radius:10px;padding:10px 12px;margin:0 0 8px;font-size:13.5px} .wt-plan-row .wt-plan-date{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em} .wt-plan-row .wt-plan-del{float:right;background:none;border:0;color:var(--rose);cursor:pointer;font-size:12px} .wt-plan-row .wt-plan-text{margin-top:4px;color:var(--ink)} .wt-plans-empty{font-size:13px;color:var(--muted);text-align:center;font-style:italic} .wt-plans-actions{display:flex;gap:8px;justify-content:center;margin-top:10px} .wt-plans-export{font:inherit;font-size:12px;color:var(--muted);background:none;border:1px solid var(--line2);border-radius:8px;padding:5px 12px;cursor:pointer} .wt-plans-export:hover{border-color:var(--rose);color:var(--rose)} .wt-commit-final{font-family:var(--font-serif);font-size:16px;color:var(--ink);background:var(--paper);border-radius:10px;padding:12px 16px;margin:0 0 10px} /* ===================== Canonical dated-history row styles ===================== Style 1 — completed log row (.cbt-hist): a thing that happened. Date bold top-left, a compact count/summary top-right, delete in red, plain text second line. Style 2 — live commitment row (.ba-item): a thing committed to but not done yet. Same white box and frame, but stays interactive (outcome field + Check button) after saving. Previously defined locally in practices/cbt.html only — practices/dbt.html's Self-Soothe history already used the .cbt-hist class name with no matching stylesheet, so it rendered completely unstyled. Making these global fixes that silently and gives every future dated history list on the site the same look without redefining it per page. ===================== */ .cbt-hist{background:#fff;border:1px solid var(--line,#e6ecf2);border-radius:10px;padding:9px 12px;margin-top:8px;font-size:.9rem} .cbt-hist .meta{display:flex;justify-content:space-between;gap:8px;align-items:baseline;flex-wrap:wrap} .cbt-hist .d{font-weight:700;color:var(--ink)} .cbt-hist .count{color:var(--muted);font-size:.85em;margin-right:8px} .cbt-hist .del,.ba-item .del-ba{background:none;border:0;color:#b1493f;cursor:pointer;font-size:.8rem} .cbt-hist .body{margin-top:3px;color:var(--soft)} .cbt-date{border:1px solid #d7e0ea;border-radius:8px;padding:7px 9px;font:inherit;color:inherit} .ba-item{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:8px 0} .ba-item b{color:var(--ink)} .ba-item .ba-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:.92rem} .ba-item .ba-outcome{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap;align-items:center} .ba-item .ba-outcome select,.ba-item .ba-outcome input[type=text]{font:inherit;font-size:.85rem;border:1px solid var(--line2);border-radius:7px;padding:5px 8px} .ba-item .ba-check{font:inherit;font-size:.82rem;font-weight:600;color:#fff;background:var(--rose);border:1px solid var(--rose);border-radius:7px;padding:5px 12px;cursor:pointer} .ba-item .ba-compare{margin-top:6px;font-weight:700;color:var(--ink);font-size:.88rem} .lem-log-empty{font-size:13px;color:var(--muted);font-style:italic;margin:8px 0} .lem-log-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px} .lem-log-undo{font-size:12.5px;color:var(--rose);background:var(--rose-soft);border-radius:8px;padding:5px 10px;display:inline-flex;gap:8px;align-items:center} .lem-log-undo button{font:inherit;font-size:12.5px;font-weight:700;color:var(--rose);background:none;border:none;text-decoration:underline;cursor:pointer;padding:0} .lem-log-fail{font-size:12.5px;color:#B1493F;margin-top:6px} .lem-ics-note{font-size:12px;color:var(--muted);margin:8px 0 0;line-height:1.5;max-width:520px} .lem-ics-btn{font:inherit;font-size:12.5px;font-weight:600;color:var(--soft);background:#fff;border:1px solid var(--line2);border-radius:8px;padding:6px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px} .lem-ics-btn:hover{border-color:var(--rose);color:var(--rose)} /* ---- Float audio bars: compact, semi-transparent, pin tucked under both pills ---- */ #floatMusicBar,#floatVoiceBar{ background:rgba(255,255,255,.72)!important; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); gap:5px!important; padding:5px 8px!important; flex-wrap:wrap!important; max-width:min(92vw,228px)!important; } #floatMusicBar input[type=range],#floatVoiceBar input[type=range]{width:64px!important} #floatMusicBar #musicStopBtn,#floatVoiceBar #floatVoiceStop{padding:4px 9px!important} /* the injected "Remember this page" checkbox (a