:root{--jrl-black:#171717;--jrl-cream:#fff8ed;--jrl-pink:#ff4fa3;--jrl-teal:#17d6c3;--jrl-yellow:#ffe34e;--jrl-purple:#8b5cf6;--jrl-orange:#ff8a34;--jrl-blue:#65c8ff;--jrl-white:#fff}.jrl,.jrl *{box-sizing:border-box}.jrl{--shadow:7px 7px 0 var(--jrl-black);color:var(--jrl-black);background:var(--jrl-cream);font-family:Arial,Helvetica,sans-serif;line-height:1.35;width:100%;overflow:hidden}.jrl button,.jrl input{font:inherit}.jrl button{cursor:pointer}.jrl h1,.jrl h2,.jrl h3,.jrl p{margin-top:0}.jrl h1,.jrl h2,.jrl h3,.jrl strong,.jrl-kicker,.jrl-eyebrow,.jrl-strip,.jrl-btn,.jrl-pill,.jrl-card-num{font-family:"Arial Black",Arial,Helvetica,sans-serif;letter-spacing:-.04em}.jrl a{color:inherit;text-decoration:none}.jrl-hero{min-height:72vh;padding:clamp(42px,7vw,90px) clamp(20px,6vw,80px);background:radial-gradient(circle at 88% 18%,var(--jrl-yellow) 0 9%,transparent 9.4%),radial-gradient(circle at 12% 78%,var(--jrl-teal) 0 10%,transparent 10.4%),var(--jrl-pink);border-bottom:6px solid var(--jrl-black);position:relative;display:flex;flex-direction:column;justify-content:center}.jrl-kicker{display:inline-block;width:max-content;background:var(--jrl-black);color:white;padding:8px 13px;transform:rotate(-1.8deg);margin-bottom:18px;font-size:clamp(13px,2vw,18px)}.jrl h1{font-size:clamp(64px,13vw,168px);line-height:.78;margin:0;max-width:1050px;text-transform:uppercase}.jrl h1 span{color:var(--jrl-yellow);-webkit-text-stroke:3px var(--jrl-black);text-shadow:6px 6px 0 var(--jrl-black)}.jrl-hero-copy{font-size:clamp(24px,4vw,54px);font-weight:900;margin:34px 0 24px;max-width:850px}.jrl-hero-actions,.jrl-action-row,.jrl-choice-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.jrl-disclaimer{margin:24px 0 0;font-size:13px;font-weight:700;max-width:680px}.jrl-btn,.jrl-mini-btn,.jrl-pill{border:3px solid var(--jrl-black);border-radius:999px;font-weight:900}.jrl-btn{padding:14px 20px;box-shadow:4px 4px 0 var(--jrl-black);display:inline-flex;align-items:center;justify-content:center}.jrl-btn:hover,.jrl-card:hover,.jrl-decision:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--jrl-black)}.jrl-btn-black{background:var(--jrl-black);color:#fff;box-shadow:4px 4px 0 rgba(255,255,255,.55)}.jrl-btn-cream{background:var(--jrl-cream)}.jrl-mini-btn{background:rgba(255,255,255,.7);padding:9px 14px;box-shadow:none}.jrl-pill{padding:10px 14px;background:white}.jrl-pill.active{background:var(--jrl-black);color:white}.jrl-strip{display:flex;justify-content:space-around;gap:20px;padding:17px 20px;background:var(--jrl-black);color:white;font-size:clamp(14px,2.4vw,26px);white-space:nowrap;overflow:auto}.jrl-strip span:nth-child(1){color:var(--jrl-pink)}.jrl-strip span:nth-child(2){color:var(--jrl-teal)}.jrl-strip span:nth-child(3){color:var(--jrl-yellow)}.jrl-strip span:nth-child(4){color:var(--jrl-purple)}.jrl-strip span:nth-child(5){color:var(--jrl-orange)}.jrl-section,.jrl-tool{padding:clamp(48px,7vw,90px) clamp(20px,6vw,80px);border-bottom:5px solid var(--jrl-black)}.jrl-section-head,.jrl-tool-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr);gap:30px;align-items:end;margin-bottom:34px}.jrl-section-head h2,.jrl-tool-head h2,.jrl-kindness h2{font-size:clamp(38px,6vw,78px);line-height:.95;margin-bottom:0}.jrl-section-head>p,.jrl-tool-head>p{font-size:18px;max-width:560px}.jrl-eyebrow{display:inline-block;font-size:13px;background:var(--jrl-black);color:white;padding:7px 10px;margin-bottom:12px}.jrl-grid{display:grid;gap:18px}.jrl-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.jrl-card{border:4px solid var(--jrl-black);border-radius:24px;min-height:220px;padding:24px;text-align:left;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:flex-end;transition:.12s ease;color:var(--jrl-black)}.jrl-card strong{font-size:clamp(24px,3vw,39px);line-height:.95}.jrl-card small{font-size:15px;font-weight:800;margin-top:10px}.jrl-card-num{margin-bottom:auto;font-size:18px}.jrl-card-pink{background:var(--jrl-pink)}.jrl-card-teal{background:var(--jrl-teal)}.jrl-card-yellow{background:var(--jrl-yellow)}.jrl-card-purple{background:var(--jrl-purple)}.jrl-card-orange{background:var(--jrl-orange)}.jrl-card-blue{background:var(--jrl-blue)}.jrl-tool{position:relative}.jrl-tool-pink{background:#ffabd3}.jrl-tool-teal{background:#a4f3eb}.jrl-tool-yellow{background:#fff09a}.jrl-tool-purple{background:#c7b5ff}.jrl-tool-orange{background:#ffc49a}.jrl-tool-blue{background:#b9e8ff}.jrl-tool-head .jrl-mini-btn{justify-self:end}.jrl-breathe-layout{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(320px,1.25fr);gap:40px;align-items:center}.jrl-breathe-controls{display:flex;flex-direction:column;gap:18px;align-items:flex-start}.jrl-breath-stage{display:flex;justify-content:center;padding:24px}.jrl-box-breath{width:min(62vw,420px);aspect-ratio:1;border:8px solid var(--jrl-black);background:var(--jrl-cream);position:relative;display:grid;place-items:center;box-shadow:12px 12px 0 var(--jrl-black)}.jrl-box-breath.exhale{border-radius:50%;box-shadow:10px 10px 0 var(--jrl-black)}.jrl-breath-dot{width:28px;height:28px;background:var(--jrl-pink);border:4px solid var(--jrl-black);border-radius:50%;position:absolute;top:-18px;left:-18px;transform:translate(0,0)}.jrl-box-breath.exhale .jrl-breath-dot{display:none}.jrl-breath-word{font-family:"Arial Black";font-size:clamp(25px,5vw,58px);text-align:center}.jrl-breath-count{position:absolute;bottom:20px;font-size:40px;font-weight:900}.jrl-focus-wrap,.jrl-pattern-wrap,.jrl-category-wrap{max-width:980px;margin:auto;background:rgba(255,255,255,.5);border:4px solid var(--jrl-black);border-radius:28px;padding:clamp(22px,5vw,48px);box-shadow:var(--shadow)}.jrl-timer{font-family:"Arial Black",Arial,sans-serif;font-size:clamp(80px,16vw,180px);line-height:1;letter-spacing:-.09em;margin:30px 0}.jrl-input{width:100%;border:4px solid var(--jrl-black);border-radius:16px;padding:15px 17px;background:#fff;color:var(--jrl-black);font-weight:800;box-shadow:4px 4px 0 var(--jrl-black)}.jrl-input:focus{outline:4px solid rgba(255,255,255,.8)}.jrl-input-big{font-size:22px;margin:18px 0}.jrl-status{font-size:17px;font-weight:800;margin:18px 0 0}.jrl-reset-flow{max-width:1100px;margin:auto}.jrl-reset-step{display:none;background:rgba(255,255,255,.62);border:4px solid var(--jrl-black);border-radius:28px;padding:clamp(25px,5vw,54px);box-shadow:var(--shadow)}.jrl-reset-step.active{display:block}.jrl-step-no{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;border:4px solid var(--jrl-black);font-family:"Arial Black";background:var(--jrl-pink)}.jrl-reset-step h3{font-size:clamp(44px,8vw,86px);margin:12px 0 4px}.jrl-reset-step p{font-size:20px;font-weight:700}.jrl-decision-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.jrl-decision{border:4px solid var(--jrl-black);border-radius:24px;padding:30px;min-height:250px;box-shadow:var(--shadow);text-align:left;display:flex;flex-direction:column;justify-content:flex-end}.jrl-decision strong{font-size:40px}.jrl-decision small{font-size:16px;font-weight:800;margin-top:8px}.jrl-dump{background:var(--jrl-black);color:white}.jrl-do{background:var(--jrl-teal)}.jrl-dumpster,.jrl-do-icon{font-size:80px;line-height:1;margin-bottom:auto}.jrl-do-box{display:none;margin-top:24px;gap:12px}.jrl-do-box.open{display:grid;grid-template-columns:1fr auto}.jrl-dump-fall{animation:jrlDump .7s ease-in forwards}@keyframes jrlDump{from{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(130px) rotate(10deg);opacity:0}}.jrl-done-note{margin-top:28px;border:4px solid var(--jrl-black);padding:18px;background:#fff;font-size:18px}.jrl-simon{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:600px;margin:28px auto}.jrl-simon-tile{aspect-ratio:1;border:5px solid var(--jrl-black);border-radius:28px;box-shadow:6px 6px 0 var(--jrl-black);opacity:.78}.jrl-simon-tile.tile-a{background:var(--jrl-pink)}.jrl-simon-tile.tile-b{background:var(--jrl-teal)}.jrl-simon-tile.tile-c{background:var(--jrl-yellow)}.jrl-simon-tile.tile-d{background:var(--jrl-purple)}.jrl-simon-tile.flash{opacity:1;transform:scale(.94);box-shadow:2px 2px 0 var(--jrl-black);filter:brightness(1.2)}.jrl-round{font-family:"Arial Black"}.jrl-countdown-wrap{text-align:center}.jrl-count-big{font-family:"Arial Black";font-size:clamp(170px,35vw,480px);line-height:.8;letter-spacing:-.1em;text-shadow:8px 8px 0 rgba(255,255,255,.65)}.jrl-countdown-wrap .jrl-action-row{justify-content:center}.jrl-letter{width:120px;height:120px;border-radius:24px;border:5px solid var(--jrl-black);box-shadow:7px 7px 0 var(--jrl-black);display:grid;place-items:center;font-family:"Arial Black";font-size:72px;background:var(--jrl-yellow);margin:28px 0}.jrl-category-entry{display:grid;grid-template-columns:1fr auto;gap:12px;margin:18px 0}.jrl-chain-log{margin-top:24px;display:flex;gap:8px;flex-wrap:wrap}.jrl-chain-chip{border:3px solid var(--jrl-black);border-radius:999px;padding:7px 10px;background:#fff;font-weight:800}.jrl-creative{background:var(--jrl-cream)}.jrl-prompt-card{border:5px solid var(--jrl-black);border-radius:30px;background:var(--jrl-yellow);padding:clamp(26px,5vw,56px);box-shadow:var(--shadow);max-width:1050px}.jrl-prompt-label{font-family:"Arial Black";font-size:13px;background:var(--jrl-black);color:white;padding:6px 9px}.jrl-prompt-card p{font-family:"Arial Black";font-size:clamp(32px,5vw,66px);line-height:1;margin:24px 0 30px}.jrl-kindness{background:var(--jrl-pink);display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end}.jrl-kindness p:not(.jrl-eyebrow){max-width:760px;font-size:19px;font-weight:800}.jrl-footer{background:var(--jrl-black);color:white;padding:35px clamp(20px,6vw,80px);display:flex;align-items:center;gap:18px;flex-wrap:wrap}.jrl-footer strong{font-size:26px;color:var(--jrl-pink)}.jrl-footer span{font-weight:900}.jrl-footer small{margin-left:auto;opacity:.8}@media(max-width:850px){.jrl-grid-3{grid-template-columns:1fr}.jrl-section-head,.jrl-tool-head,.jrl-breathe-layout,.jrl-kindness{grid-template-columns:1fr}.jrl-tool-head .jrl-mini-btn{justify-self:start}.jrl-decision-grid{grid-template-columns:1fr}.jrl-do-box.open,.jrl-category-entry{grid-template-columns:1fr}.jrl-footer small{margin-left:0;width:100%}.jrl-card{min-height:175px}}@media(max-width:520px){.jrl-hero{min-height:72vh}.jrl h1{font-size:57px}.jrl h1 span{-webkit-text-stroke:2px var(--jrl-black);text-shadow:4px 4px 0 var(--jrl-black)}.jrl-hero-actions .jrl-btn{width:100%}.jrl-strip{justify-content:flex-start}.jrl-choice-row{gap:8px}.jrl-pill{font-size:12px;padding:8px 10px}.jrl-breath-stage{padding:8px}.jrl-box-breath{width:78vw}.jrl-count-big{font-size:49vw}}

/* v1.1 accessibility + low-stimulation pass */
.jrl{position:relative}
.jrl *{min-width:0}
.jrl h1,.jrl h2,.jrl h3,.jrl-card strong,.jrl-btn,.jrl-mini-btn,.jrl-pill{overflow-wrap:anywhere}
.jrl-mode-control{position:absolute;right:clamp(18px,4vw,50px);top:clamp(18px,4vw,40px);z-index:5;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.9);border:3px solid var(--jrl-black);border-radius:999px;padding:6px 7px 6px 12px;box-shadow:4px 4px 0 var(--jrl-black);font-size:12px;font-weight:900}
.jrl-mode-toggle{border:0;border-radius:999px;background:var(--jrl-black)!important;color:#fff!important;padding:8px 11px;font-weight:900;cursor:pointer}
.jrl-hero-copy{margin-bottom:10px!important;max-width:1050px!important;line-height:1.02}
.jrl-hero-subcopy{font-size:clamp(19px,2.3vw,30px);font-weight:800;max-width:850px;margin:0 0 15px}
.jrl-privacy-note{max-width:800px;margin:0 0 25px;font-size:15px;font-weight:700;line-height:1.5}
.jrl .jrl-btn-black,.jrl button.jrl-btn-black,.jrl a.jrl-btn-black{background:var(--jrl-black)!important;color:#fff!important;border-color:var(--jrl-black)!important}
.jrl .jrl-btn-black *,.jrl button.jrl-btn-black *,.jrl a.jrl-btn-black *{color:#fff!important}
.jrl .jrl-dump,.jrl button.jrl-dump{background:var(--jrl-black)!important;color:#fff!important}
.jrl .jrl-dump *{color:#fff!important}
.jrl .jrl-pill.active{background:var(--jrl-black)!important;color:#fff!important}
.jrl .jrl-eyebrow,.jrl .jrl-prompt-label{background:var(--jrl-black)!important;color:#fff!important}
.jrl-card,.jrl-decision,.jrl-focus-wrap,.jrl-pattern-wrap,.jrl-category-wrap,.jrl-reset-step,.jrl-prompt-card{overflow:hidden}
.jrl-card strong{font-size:clamp(22px,2.5vw,36px)}
.jrl-footer{align-items:flex-start!important;justify-content:space-between!important}
.jrl-footer>div:first-child{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.jrl-footer-small{display:grid;gap:4px;max-width:650px;margin-left:auto;text-align:right}

/* Low-stimulation mode: muted, softer contrast, less visual motion. */
.jrl.jrl-low-stim{
 --jrl-black:#34312f;
 --jrl-cream:#e7e2dc;
 --jrl-pink:#b48ea0;
 --jrl-teal:#8aa9a5;
 --jrl-yellow:#c5ba91;
 --jrl-purple:#9c93aa;
 --jrl-orange:#b59a84;
 --jrl-blue:#98aab3;
 --jrl-white:#f0ece7;
 --shadow:3px 3px 0 #514c49;
 background:#e7e2dc;
}
.jrl.jrl-low-stim .jrl-hero{background:#b7aaa4}
.jrl.jrl-low-stim .jrl-strip{background:#4b4744}
.jrl.jrl-low-stim .jrl-card,.jrl.jrl-low-stim .jrl-decision,.jrl.jrl-low-stim .jrl-focus-wrap,.jrl.jrl-low-stim .jrl-pattern-wrap,.jrl.jrl-low-stim .jrl-category-wrap,.jrl.jrl-low-stim .jrl-reset-step,.jrl.jrl-low-stim .jrl-prompt-card{box-shadow:3px 3px 0 #514c49}
.jrl.jrl-low-stim h1 span{-webkit-text-stroke:1px #34312f;text-shadow:2px 2px 0 #514c49}
.jrl.jrl-low-stim .jrl-mode-control{background:#eee9e3;box-shadow:2px 2px 0 #514c49}
.jrl.jrl-low-stim .jrl-simon-tile{box-shadow:2px 2px 0 #514c49;opacity:.9}
.jrl.jrl-low-stim .jrl-count-big{text-shadow:none}
.jrl.jrl-low-stim .jrl-breath-dot,.jrl.jrl-low-stim .jrl-dump-fall{animation-duration:0s!important;transition-duration:.2s!important}
.jrl.jrl-low-stim .jrl-card:hover,.jrl.jrl-low-stim .jrl-decision:hover,.jrl.jrl-low-stim .jrl-btn:hover{transform:none;box-shadow:3px 3px 0 #514c49}

@media(max-width:850px){
 .jrl-mode-control{position:static;width:max-content;margin-bottom:22px}
 .jrl-footer-small{margin-left:0;text-align:left}
}
@media(max-width:520px){
 .jrl-mode-control{max-width:100%;flex-wrap:wrap}
 .jrl-hero-copy{font-size:clamp(25px,8vw,40px)}
 .jrl-hero-subcopy{font-size:18px}
 .jrl-privacy-note{font-size:13px}
 .jrl-btn,.jrl-mini-btn,.jrl-pill{max-width:100%;white-space:normal;text-align:center}
}
@media(prefers-reduced-motion:reduce){
 .jrl *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}


/* v1.1.2 — typography/layout guardrails.
   These deliberately override aggressive display sizing so text cannot collide
   with itself, neighbouring controls, or narrow grid columns. */
.jrl,
.jrl *{
  min-width:0;
}

.jrl h1,
.jrl h2,
.jrl h3,
.jrl p,
.jrl strong,
.jrl small,
.jrl span,
.jrl button,
.jrl a,
.jrl label{
  max-width:100%;
  overflow-wrap:break-word;
  word-break:normal;
}

.jrl button,
.jrl a.jrl-btn,
.jrl .jrl-mini-btn,
.jrl .jrl-pill{
  white-space:normal!important;
  line-height:1.2!important;
  height:auto!important;
}

.jrl-hero{
  min-height:auto!important;
  padding-top:clamp(34px,5vw,64px)!important;
  padding-bottom:clamp(48px,7vw,88px)!important;
}

/* Keep the accessibility toggle in normal document flow so it never sits on text. */
.jrl-mode-control{
  position:static!important;
  align-self:flex-end;
  margin:0 0 clamp(22px,3vw,38px)!important;
  width:auto;
  max-width:100%;
  flex-wrap:wrap;
}

/* Main display title: still bold, but no line collision. */
.jrl h1{
  font-size:clamp(54px,9.5vw,128px)!important;
  line-height:.9!important;
  letter-spacing:-.055em!important;
  max-width:980px!important;
}
.jrl h1 span{
  display:inline-block;
  line-height:.92!important;
}

/* Section headings need breathing room when they wrap. */
.jrl-section-head h2,
.jrl-tool-head h2,
.jrl-kindness h2{
  font-size:clamp(34px,5vw,66px)!important;
  line-height:1.03!important;
  letter-spacing:-.045em!important;
}
.jrl-tool-head,
.jrl-section-head{
  align-items:start!important;
}
.jrl-tool-head > div,
.jrl-section-head > div{
  min-width:0;
}

/* Smaller labels should wrap rather than spill into adjacent content. */
.jrl-kicker,
.jrl-eyebrow,
.jrl-prompt-label{
  width:auto!important;
  max-width:100%!important;
  white-space:normal!important;
  line-height:1.2!important;
}

/* Cards: stop long titles colliding with descriptions. */
.jrl-card{
  height:auto!important;
  min-height:210px;
  gap:8px;
}
.jrl-card strong{
  display:block;
  font-size:clamp(22px,2.35vw,34px)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
}
.jrl-card small{
  display:block;
  line-height:1.35!important;
}

/* Reset flow and decision cards */
.jrl-reset-step h3{
  font-size:clamp(40px,6.5vw,76px)!important;
  line-height:1!important;
  letter-spacing:-.045em!important;
}
.jrl-decision{
  height:auto!important;
}
.jrl-decision strong{
  display:block;
  font-size:clamp(30px,4vw,40px)!important;
  line-height:1.05!important;
}
.jrl-decision small{
  display:block;
  line-height:1.35!important;
}

/* Prevent very large utility text from escaping its panel. */
.jrl-timer{
  font-size:clamp(64px,12vw,150px)!important;
  line-height:.95!important;
  letter-spacing:-.06em!important;
  overflow-wrap:normal!important;
}
.jrl-count-big{
  font-size:clamp(150px,30vw,400px)!important;
  line-height:.9!important;
}

/* Controls in grid/flex rows must be allowed to wrap cleanly. */
.jrl-choice-row,
.jrl-action-row,
.jrl-hero-actions{
  align-items:stretch!important;
}
.jrl-choice-row > *,
.jrl-action-row > *,
.jrl-hero-actions > *{
  flex:0 1 auto;
}

/* Give long tool headings their own row before the back button on medium screens. */
@media (max-width:1100px){
  .jrl-tool-head,
  .jrl-section-head{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .jrl-tool-head .jrl-mini-btn{
    justify-self:start!important;
  }
}

@media (max-width:700px){
  .jrl h1{
    font-size:clamp(48px,15vw,78px)!important;
    line-height:.92!important;
  }
  .jrl-hero-copy{
    font-size:clamp(24px,7.5vw,38px)!important;
    line-height:1.08!important;
  }
  .jrl-section-head h2,
  .jrl-tool-head h2,
  .jrl-kindness h2{
    font-size:clamp(32px,9vw,48px)!important;
    line-height:1.06!important;
  }
  .jrl-grid-3{
    grid-template-columns:1fr!important;
  }
  .jrl-card{
    min-height:160px;
  }
  .jrl-timer{
    font-size:clamp(56px,20vw,105px)!important;
  }
}

@media (max-width:420px){
  .jrl-section,
  .jrl-tool,
  .jrl-hero{
    padding-left:16px!important;
    padding-right:16px!important;
  }
  .jrl h1{
    font-size:clamp(43px,14vw,62px)!important;
  }
  .jrl-btn,
  .jrl-mini-btn,
  .jrl-pill{
    width:100%;
    justify-content:center;
  }
}