#bb-phrasal-app{font-family:inherit;color:#17304d;max-width:1150px;margin:24px auto;padding:30px;background:linear-gradient(135deg,#e0f3ff,#f6e9fa 60%,#fdfcff);border-radius:22px;box-shadow:0 12px 40px #13375c18;box-sizing:border-box}#bb-phrasal-app *{box-sizing:border-box}.bbih{text-align:center;margin:10px auto 25px}.bbi-kicker{font-size:12px;letter-spacing:1.5px;font-weight:800;color:#3878a0}.bbih h2{font-size:clamp(29px,4vw,45px);margin:12px 0 8px;color:#183858;line-height:1.18}.bbih h2 em{font-style:normal;color:#b30f85}.bbih p{margin:0;color:#51657a}.bbi-summary{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:24px 0}.bbi-summary span{background:white;padding:11px 18px;border-radius:40px;font-weight:700;font-size:13px;box-shadow:0 2px 10px #12416812}.bbi-level,.bbi-locked,.bbi-quiz,.bbi-results{background:#fff;border:1px solid #e1eaf4;border-radius:18px;padding:25px;box-shadow:0 5px 20px #103f6010}.bbi-level h3,.bbi-locked h3{margin:0 0 8px;font-size:22px}.bbi-level p,.bbi-locked p{color:#60748a}.bbi-sets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:20px}.bbi-set{text-align:left;background:#f8fcff;border:1px solid #d4e8f6;border-radius:14px;padding:20px;cursor:pointer;display:flex;flex-direction:column;gap:7px;color:#17304d}.bbi-set:hover{background:#eaf6ff;border-color:#0084d1;transform:translateY(-1px)}.bbi-num{font-size:11px;font-weight:800;letter-spacing:1px;color:#b30f85}.bbi-set strong{font-size:18px}.bbi-set small{color:#59758d}.bbi-locked{margin-top:18px;background:#ffffffb5}.bbi-top{display:flex;justify-content:space-between;align-items:center;color:#54708c;font-size:13px;font-weight:700}.bbi-back{background:transparent;border:0;color:#0084d1;font-weight:800;cursor:pointer}.bbi-track{height:8px;background:#e8f1f7;border-radius:10px;margin:19px 0 26px;overflow:hidden}.bbi-track div{height:100%;background:#b30f85;border-radius:10px}.bbi-instruction{font-size:17px;font-weight:700}.bbi-sentence{padding:20px;background:#eff8ff;border-left:4px solid #0084d1;border-radius:8px;font-size:18px;line-height:1.6;margin:17px 0 23px}.bbi-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.bbi-option{display:flex;align-items:center;text-align:left;gap:12px;background:#fff;border:1px solid #cadceb;border-radius:12px;padding:15px;color:#17304d;cursor:pointer;font-size:15px}.bbi-option span{display:inline-grid;place-items:center;min-width:30px;height:30px;border-radius:50%;background:#e7f4fd;color:#0069ae;font-weight:800}.bbi-option:not(:disabled):hover{border-color:#0084d1;background:#f0faff}.bbi-option.correct{background:#e9f9f0;border-color:#42a66e}.bbi-option.incorrect{background:#fff0f1;border-color:#d97c83}.bbi-option:disabled{cursor:default}.bbi-feedback{background:#f8f6ff;border-radius:12px;padding:18px;margin-top:19px}.bbi-feedback strong{color:#5a2383}.bbi-feedback p{margin:8px 0 0}.bbi-tip{font-size:14px;color:#596276}.bbi-actions{text-align:right;margin-top:20px}.bbi-actions button,.bbi-result-buttons button{background:#0084d1;color:white;border:0;border-radius:10px;padding:13px 22px;font-weight:800;cursor:pointer}.bbi-actions button:disabled{opacity:.45;cursor:not-allowed}.bbi-results{text-align:center}.bbi-score{font-size:65px;color:#b30f85;font-weight:900}.bbi-score span{font-size:25px;color:#617589}.bbi-result-buttons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.bbi-review{text-align:left;border-top:1px solid #e3ebf2;margin-top:20px;padding-top:18px}.bbi-review p{margin:6px 0}@media(max-width:650px){#bb-phrasal-app{padding:15px;border-radius:14px}.bbi-level,.bbi-locked,.bbi-quiz,.bbi-results{padding:17px}.bbi-sets,.bbi-options{grid-template-columns:1fr}.bbi-sentence{font-size:16px;padding:15px}}
/* Emphasise the tested idiom in both prompt and example sentence. */
.bbi-instruction strong u,.bbi-sentence strong u,.bbi-review strong u{font-weight:800;text-decoration:underline;text-decoration-color:#b30f85;text-underline-offset:3px;text-decoration-thickness:2px;}

/* Animated graffiti splash: correct responses only. */
.bb-phrasal-app{position:relative;isolation:isolate}.bbi-graffiti{position:absolute;z-index:50;inset:0;display:grid;place-items:center;pointer-events:none;overflow:hidden;animation:bbiFade .85s ease-out forwards}.bbi-splash-word{font-size:clamp(2rem,8vw,4.5rem);font-weight:1000;letter-spacing:-.055em;color:#b30f85;text-shadow:3px 3px 0 #fff,7px 7px 0 #0084d1;transform:rotate(-8deg);animation:bbiPop .75s cubic-bezier(.15,.8,.2,1) both}.bbi-graffiti i{position:absolute;left:50%;top:48%;width:11px;height:19px;border-radius:60% 30% 60% 40%;background:hsl(var(--h),85%,55%);transform:rotate(var(--a));animation:bbiBurst .7s ease-out both}@keyframes bbiBurst{from{opacity:1;transform:rotate(var(--a)) translateY(0) scale(.5)}to{opacity:0;transform:rotate(var(--a)) translateY(calc(-1 * var(--d))) scale(1.7)}}@keyframes bbiPop{0%{opacity:0;transform:scale(.3) rotate(-20deg)}40%{opacity:1;transform:scale(1.15) rotate(-7deg)}100%{opacity:0;transform:scale(1) rotate(-8deg)}}@keyframes bbiFade{0%,60%{opacity:1}100%{opacity:0}}@media(prefers-reduced-motion:reduce){.bbi-graffiti{animation:none;display:none}}

/* v1.4.2 — full-bleed learning environment; preserve contained quiz cards. */
#bb-phrasal-app.bb-phrasal-app{
  width:100vw;width:100dvw;max-width:none;
  position:relative;left:50%;margin-left:-50vw;
  margin-top:0;margin-bottom:0;
  padding:clamp(26px,4vw,64px) max(22px,calc((100vw - 1200px)/2));
  border-radius:0;
  background:
    radial-gradient(ellipse 480px 300px at 9% 5%,rgba(179,15,133,.13),transparent 75%),
    radial-gradient(ellipse 650px 350px at 94% 14%,rgba(0,132,209,.20),transparent 76%),
    linear-gradient(130deg,#e0f3ff 0%,#edf8ff 35%,#f8ecfb 76%,#e7f6ff 100%);
  box-shadow:none;min-height:72vh;
}
#bb-phrasal-app .bbih{
  max-width:850px;margin:0 auto 28px;padding:16px 0 4px;
}
#bb-phrasal-app .bbi-kicker{
  display:inline-block;border-radius:99px;padding:9px 16px;
  background:#ffffffb8;border:1px solid #ffffff;box-shadow:0 5px 20px #17304d0b;
  color:#80518a;font-size:11px;letter-spacing:1.7px;
}
#bb-phrasal-app .bbih h2{font-size:clamp(34px,4.8vw,58px);letter-spacing:-.04em;margin:18px 0 10px;}
#bb-phrasal-app .bbih p{font-size:clamp(15px,1.5vw,18px);line-height:1.6;}
#bb-phrasal-app .bbi-summary{gap:12px;margin:28px 0 34px;}
#bb-phrasal-app .bbi-summary span{
  background:#ffffffd9;border:1px solid #ffffff;
  padding:12px 20px;box-shadow:0 8px 22px #164e7910;
}
#bb-phrasal-app .bbi-level{
  position:relative;overflow:hidden;margin-bottom:22px;
  padding:clamp(22px,3vw,34px);
  border:1px solid #fff;background:linear-gradient(145deg,#ffffff 0%,#fbfdff 100%);
  border-radius:23px;box-shadow:0 13px 38px #143b6812;
}
#bb-phrasal-app .bbi-level::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(#b30f85,#0084d1);
}
#bb-phrasal-app .bbi-level h3{font-size:clamp(21px,2.5vw,27px);color:#17304d;letter-spacing:-.02em;}
#bb-phrasal-app .bbi-level p{margin:7px 0 0;}
#bb-phrasal-app .bbi-sets{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;}
#bb-phrasal-app .bbi-set{
  min-height:146px;justify-content:space-between;
  background:linear-gradient(160deg,#f5fbff,#fff8fd);
  border:1px solid #dce8f4;border-radius:16px;padding:18px 15px;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
#bb-phrasal-app .bbi-set:hover{
  transform:translateY(-4px);background:#fff;border-color:#b30f85;
  box-shadow:0 12px 25px #b30f8517;
}
#bb-phrasal-app .bbi-set:focus-visible{outline:3px solid #b30f85;outline-offset:3px;}
#bb-phrasal-app .bbi-set strong{font-size:16px;line-height:1.4;}
#bb-phrasal-app .bbi-num{color:#b30f85;}
#bb-phrasal-app .bbi-quiz,#bb-phrasal-app .bbi-results{
  max-width:940px;margin:0 auto;padding:clamp(22px,3.5vw,38px);
  border:1px solid white;border-radius:24px;box-shadow:0 16px 44px #143b6818;
}
#bb-phrasal-app .bbi-option{transition:border-color .15s ease,background .15s ease;}
#bb-phrasal-app .bbi-actions button:not(:disabled):hover,
#bb-phrasal-app .bbi-result-buttons button:hover{background:#006bad;}
@media(max-width:1050px){
 #bb-phrasal-app .bbi-sets{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:650px){
 #bb-phrasal-app.bb-phrasal-app{padding:24px 17px 38px;}
 #bb-phrasal-app .bbi-sets{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
 #bb-phrasal-app .bbi-set{min-height:135px;padding:14px 12px;}
 #bb-phrasal-app .bbi-set strong{font-size:14px;}
 #bb-phrasal-app .bbi-summary span{padding:10px 12px;font-size:12px;}
 #bb-phrasal-app .bbi-level{padding:19px 15px;}
 #bb-phrasal-app .bbi-options{grid-template-columns:1fr;}
}
@media(max-width:370px){#bb-phrasal-app .bbi-sets{grid-template-columns:1fr;}}

/* v1.4.3: One continuous page-wide background. Avoid viewport breakout
   inside the WordPress theme's constrained content wrapper. */
body:has(#bb-phrasal-app){
 background:linear-gradient(125deg,#e0f3ff 0%,#edf8ff 35%,#f8ecfb 76%,#e7f6ff 100%) !important;
}
body:has(#bb-phrasal-app) main,
body:has(#bb-phrasal-app) .site-main,
body:has(#bb-phrasal-app) .site-content,
body:has(#bb-phrasal-app) .content-area,
body:has(#bb-phrasal-app) .entry-content,
body:has(#bb-phrasal-app) .wp-block-post-content,
body:has(#bb-phrasal-app) article,
body:has(#bb-phrasal-app) .ast-container,
body:has(#bb-phrasal-app) .ast-plain-container,
body:has(#bb-phrasal-app) .inside-article,
body:has(#bb-phrasal-app) .elementor-widget-container:has(#bb-phrasal-app){
 background-color:transparent !important;
}
#bb-phrasal-app.bb-phrasal-app{
 width:100% !important;max-width:1200px !important;
 left:auto !important;margin:0 auto !important;
 position:relative !important;
 padding:clamp(24px,4vw,54px) clamp(15px,3vw,35px) !important;
 background:transparent !important;
 box-shadow:none !important;
 min-height:70vh;
}
#bb-phrasal-app::before{
 content:"";position:absolute;z-index:-1;
 top:0;bottom:0;left:50%;transform:translateX(-50%);
 width:100vw;pointer-events:none;
 background:linear-gradient(125deg,#e0f3ff 0%,#edf8ff 35%,#f8ecfb 76%,#e7f6ff 100%);
}
@media(max-width:650px){
 #bb-phrasal-app.bb-phrasal-app{padding:24px 14px 38px !important;}
}