/* Nexa "sticker notebook" look — loaded after each page's own styles.
   Bold cobalt + highlighter palette, ink outlines with hard offset shadows that press in,
   a clean heavy display face, and small celebrations for right answers. */
:root{
  --desk:#e3e8ff;            /* periwinkle desk */
  --paper:#fffdf8;
  --card:#ffffff;
  --rule:#dfe6f6;
  --margin:#ff9eb5;
  --ink:#16182a;
  --pencil:#5d6178;
  --blue:#3047ff;            /* cobalt pen */
  --blue-soft:rgba(48,71,255,.09);
  --hi:#ffe45c;              /* highlighter */
  --pink:#ff6fae;
  --sticky:#fff3a8;
  --edge:#cfd5ea;
  --ok:#0f9d58; --ok-soft:#dcf7e8;
  --mid:#e08a00; --mid-soft:#fff1d6;
  --bad:#e5383b; --bad-soft:#ffe3e3;
  --line:#16182a;            /* sticker outline */
  --drop:#16182a;            /* hard shadow */
  --shadow:0 1px 2px rgba(22,24,42,.06), 0 8px 24px rgba(22,24,42,.08);
  --f-hand:"Bricolage Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --f-script:"Caveat", "Segoe Print", "Bradley Hand", cursive;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --desk:#10121c; --paper:#1b1e2b; --card:#222637; --rule:#2a3045; --margin:#7a3150;
  --ink:#eef0ff; --pencil:#a3a8c3; --blue:#8b9bff; --blue-soft:rgba(139,155,255,.13);
  --hi:#ffe45c; --pink:#ff7db8; --sticky:#3b3720; --edge:#353b55;
  --ok:#3ddc84; --ok-soft:rgba(61,220,132,.14); --mid:#ffb43d; --mid-soft:rgba(255,180,61,.14);
  --bad:#ff6b6b; --bad-soft:rgba(255,107,107,.14);
  --line:#4d5579; --drop:#05060c; --shadow:0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.3); color-scheme:dark}}
:root[data-theme="dark"]{
  --desk:#10121c; --paper:#1b1e2b; --card:#222637; --rule:#2a3045; --margin:#7a3150;
  --ink:#eef0ff; --pencil:#a3a8c3; --blue:#8b9bff; --blue-soft:rgba(139,155,255,.13);
  --hi:#ffe45c; --pink:#ff7db8; --sticky:#3b3720; --edge:#353b55;
  --ok:#3ddc84; --ok-soft:rgba(61,220,132,.14); --mid:#ffb43d; --mid-soft:rgba(255,180,61,.14);
  --bad:#ff6b6b; --bad-soft:rgba(255,107,107,.14);
  --line:#4d5579; --drop:#05060c; --shadow:0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.3); color-scheme:dark}

body{background-color:var(--desk);background-image:radial-gradient(color-mix(in srgb, var(--blue) 18%, transparent) 1px, transparent 1.2px);background-size:22px 22px}

/* ---------- shared "sticker" controls ---------- */
.tbtn,.qbtn,.send,.addbtn,.opt,.plan,.nitem,.google,.chip,.btn,.dfoot button,.src .nb{
  border:2px solid var(--line)!important;box-shadow:3px 3px 0 var(--drop);border-radius:10px;
  transition:transform .08s ease, box-shadow .08s ease, background-color .15s ease, color .15s ease}
.tbtn:hover:not(:disabled),.qbtn:hover,.send:hover:not(:disabled),.addbtn:hover,.opt:hover:not(:disabled),.plan:hover:not(:disabled),.nitem:hover,.google:hover,.chip:hover,.btn:hover,.dfoot button:hover,.src .nb:hover{
  transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--drop)}
.tbtn:active,.qbtn:active,.send:active,.addbtn:active,.opt:active:not(:disabled),.plan:active,.nitem:active,.google:active,.chip:active,.btn:active,.dfoot button:active{
  transform:translate(2px,2px);box-shadow:1px 1px 0 var(--drop)}
.tbtn,.qbtn{font-weight:700;font-family:var(--f-hand);letter-spacing:-.01em}
.tbtn{font-size:14px;padding:6px 12px;background:var(--card);color:var(--ink)}
.tbtn:hover{color:var(--ink)}
.tbtn.cta,.tbtn.primary,.qbtn.hero,.send,.btn.primary{background:var(--blue)!important;color:#fff!important}
.tbtn.cta:hover,.tbtn.primary:hover,.qbtn.hero:hover,.btn.primary:hover{filter:none;color:#fff}
.tbtn[aria-pressed=true]{background:var(--hi);color:#16182a}
.tbtn.warn{background:var(--bad-soft);color:var(--bad)}
.qbtn{font-size:14px;padding:5px 14px;border-radius:999px;background:var(--card)}
.qbtn.hero{background:var(--pink)!important;color:#16182a!important}
.send{font:800 16px var(--f-hand);letter-spacing:.01em;border-radius:12px}
.send.stop{background:var(--bad)!important}
.addbtn{border-radius:12px;background:var(--hi);color:#16182a;font-weight:800}
.linkbtn{color:var(--pencil)}
input[type=text],input[type=email],input[type=password],input[type=number],textarea,select{
  border:2px solid var(--line)!important;border-radius:10px!important;background:var(--card)}
input:focus,textarea:focus,select:focus{outline:none;box-shadow:0 0 0 3px color-mix(in srgb, var(--blue) 35%, transparent)}

/* ---------- app frame ---------- */
.brand h1{font:800 30px/1 var(--f-hand);letter-spacing:-.03em}
.brand p{font-weight:700}
.reactor{background:var(--blue);border:2px solid var(--line);box-shadow:3px 3px 0 var(--drop);border-radius:6px 10px 10px 6px}
.reactor::after{background:var(--hi)}
.box{border:2px solid var(--line);border-radius:14px;box-shadow:4px 4px 0 var(--drop);padding:16px 18px}
.box::before{background:var(--hi);opacity:.85;height:16px;top:-8px;border:0}
.rail .box:nth-of-type(2n)::before{background:var(--pink)}
.label{font:800 19px/1.2 var(--f-hand);letter-spacing:-.02em}
.drop{border:2px dashed color-mix(in srgb, var(--blue) 55%, var(--edge));border-radius:12px;background:var(--blue-soft)}
.drop strong{font:800 17px var(--f-hand)}
.drop:hover,.drop.over{background:color-mix(in srgb, var(--blue) 16%, transparent)}
.src .tag{border-radius:6px;border-width:2px;font-weight:600}
.stat{background:var(--paper);border:2px solid var(--line);border-radius:12px;padding:8px 2px}
.stat b{font:800 28px/1.1 var(--f-hand)}
.stat.ok{background:var(--ok-soft)}.stat.mid{background:var(--mid-soft)}.stat.bad{background:var(--bad-soft)}.stat.acc{background:var(--blue-soft)}
.score{gap:8px}
.meter{height:10px;border:2px solid var(--line);border-radius:999px;background:var(--paper)}
.chip{background:var(--hi);color:#16182a;font-weight:700;border-radius:999px!important;padding:3px 10px;box-shadow:2px 2px 0 var(--drop)}
.badge{border:2px solid var(--line);border-radius:999px;padding:1px 8px;color:var(--ink);background:var(--paper)}
.badge.pro{background:var(--pink);color:#16182a;border-color:var(--line)}
.usage .urow i{height:8px;border-radius:999px;border:1.5px solid var(--line)}

.main{border:2px solid var(--line);border-radius:16px;box-shadow:6px 6px 0 var(--drop)}
.bar{border-bottom:2px solid var(--line)}
.tabs{background:var(--desk);border:2px solid var(--line);border-radius:999px;padding:3px;gap:2px}
.tab{font:800 15px var(--f-hand);border:0;border-radius:999px;padding:5px 14px;color:var(--pencil);box-shadow:none}
.tab[aria-selected=true]{background:var(--ink);color:var(--paper);box-shadow:none}
.status{font-weight:700}
.quick{border-top:2px solid var(--line)}
.msg.me{background:var(--sticky);border:2px solid var(--line);border-radius:14px 14px 4px 14px;box-shadow:3px 3px 0 var(--drop);transform:none;font:500 16px/1.5 var(--f-body)}
.msg.ai .who{font:800 15px var(--f-hand);color:#fff;background:var(--blue);border:2px solid var(--line);border-radius:50%;width:30px;height:30px;left:-48px}
.body h3,.body h4{font:800 20px/28px var(--f-hand);letter-spacing:-.01em}
.body strong{background:linear-gradient(transparent 52%, var(--hi) 52%)}
.thinking{font:600 17px var(--f-hand)}

/* ---------- verdict stamps ---------- */
.verdict{font:700 26px/1 var(--f-script);border:2.5px solid currentColor;border-radius:10px;padding:2px 12px 4px;transform:rotate(-4deg);
  animation:stampIn .35s cubic-bezier(.2,1.6,.4,1) both}
.verdict.correct{background:var(--ok-soft)}.verdict.partial{background:var(--mid-soft)}.verdict.incorrect{background:var(--bad-soft)}
@keyframes stampIn{0%{transform:rotate(-12deg) scale(1.8);opacity:0}100%{transform:rotate(-4deg) scale(1);opacity:1}}

/* ---------- quiz ---------- */
.qtitle{font:800 30px/56px var(--f-hand);letter-spacing:-.02em}
.qhead b{font:800 18px var(--f-hand)}
.qprog{height:12px;border:2px solid var(--line);border-radius:999px;background:var(--paper)}
.qprog i{transition:width .3s ease}
.qkind{display:inline-block;background:var(--hi);color:#16182a;border:2px solid var(--line);border-radius:999px;padding:1px 10px;font-weight:600;line-height:1.5}
.qtext{font:800 25px/1.3 var(--f-hand);letter-spacing:-.015em}
.opt{background:var(--card);padding:12px 14px;font-size:16px}
.opt .k{font:800 15px/1 var(--f-hand);display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--blue-soft);color:var(--blue);border:2px solid var(--line)}
.opt.right{background:var(--ok-soft);box-shadow:3px 3px 0 var(--ok)!important;border-color:var(--ok)!important}
.opt.right .k{background:var(--ok);color:#fff;border-color:var(--ok)}
.opt.wrong{background:var(--bad-soft);box-shadow:3px 3px 0 var(--bad)!important;border-color:var(--bad)!important;animation:shake .4s ease}
.opt.wrong .k{background:var(--bad);color:#fff;border-color:var(--bad)}
.opt.dim{opacity:.45;box-shadow:none}
.tfrow .opt{font:800 20px var(--f-hand);justify-items:center}
@keyframes shake{0%,100%{translate:0}20%{translate:-6px}40%{translate:6px}60%{translate:-4px}80%{translate:3px}}
.fb{border:2px solid var(--line);border-radius:14px;box-shadow:4px 4px 0 var(--drop)}
.fb h4{font:800 17px/1.3 var(--f-hand)}
.fb .answer{background:linear-gradient(transparent 50%, var(--hi) 50%);display:inline;padding:0 .15em}
.given{background:var(--sticky);border:2px solid var(--line);border-radius:12px;font:500 16px/1.5 var(--f-body)}
.bigscore{font:800 84px/1 var(--f-hand);letter-spacing:-.04em}
.resume{border:2px solid var(--line);border-radius:12px;box-shadow:3px 3px 0 var(--drop)}
.missed li{border:2px solid var(--line);border-left:8px solid var(--bad);border-radius:10px}
.missed li.partial{border-left-color:var(--mid)}
.nview h2{font:800 30px/56px var(--f-hand);letter-spacing:-.02em}
.nitem{background:var(--card)}
.nitem[aria-current=true]{background:var(--hi);color:#16182a;box-shadow:3px 3px 0 var(--drop)}
.nitem[aria-current=true] span{color:#16182a}
.nlist{background:var(--paper)}

/* ---------- sign-in & upgrade ---------- */
.overlay.solid{background-color:var(--desk)}
.sheet{border:2px solid var(--line);border-radius:18px;box-shadow:8px 8px 0 var(--drop)}
.sheet h2{font:800 30px/1.1 var(--f-hand);letter-spacing:-.025em}
.authbrand b{font:800 28px var(--f-hand);letter-spacing:-.03em}
.plan{background:var(--card);border-radius:14px}
.plan.best{background:var(--hi);color:#16182a;box-shadow:4px 4px 0 var(--drop)}
.plan.best span:last-child,.plan.best .price small{color:#3b3d52}
.plan b{font:800 18px var(--f-hand)}
.plan .price{font:800 32px/1.1 var(--f-hand);letter-spacing:-.03em}
.plan.best .price{color:#16182a}
.toast{border:2px solid var(--line);border-radius:12px;box-shadow:4px 4px 0 var(--drop);font-weight:600}
.toast.cheer{background:var(--hi);color:#16182a}

/* ---------- celebrations ---------- */
.confetti{position:fixed;inset:0;pointer-events:none;z-index:80}

@media (prefers-reduced-motion:reduce){
  .verdict,.opt.wrong{animation:none}
  .tbtn,.qbtn,.send,.addbtn,.opt,.plan,.nitem,.google,.chip,.btn{transition:none}
}

/* ---------- right-answer moment ---------- */
.opt{position:relative}
.opt.just-right{padding-right:56px}
.opt.just-right{animation:rightPop .55s cubic-bezier(.2,1.5,.4,1) both, rightGlow 1s ease-out .05s both}
@keyframes rightPop{0%{transform:scale(1)}35%{transform:scale(1.045) rotate(-.6deg)}65%{transform:scale(.99)}100%{transform:scale(1)}}
@keyframes rightGlow{0%{box-shadow:3px 3px 0 var(--ok),0 0 0 0 color-mix(in srgb, var(--ok) 55%, transparent)}100%{box-shadow:3px 3px 0 var(--ok),0 0 0 18px transparent}}
.tick{position:absolute;right:14px;top:50%;width:30px;height:30px;margin-top:-15px;border-radius:50%;background:var(--ok);border:2px solid var(--line);
  display:grid;place-items:center;animation:tickIn .35s cubic-bezier(.2,1.6,.4,1) .1s both}
.tick svg{width:18px;height:18px}
.tick path{fill:none;stroke:#fff;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;animation:tickDraw .35s ease-out .3s forwards}
@keyframes tickIn{0%{transform:scale(0) rotate(-30deg)}100%{transform:scale(1) rotate(0)}}
@keyframes tickDraw{to{stroke-dashoffset:0}}
.cheer-word{position:fixed;z-index:81;pointer-events:none;font:800 26px/1 var(--f-hand);letter-spacing:-.02em;color:#16182a;background:var(--hi);
  border:2px solid var(--line);border-radius:12px;padding:6px 12px;box-shadow:3px 3px 0 var(--drop);white-space:nowrap;
  animation:wordUp 1.3s cubic-bezier(.2,.9,.3,1) forwards}
@keyframes wordUp{0%{opacity:0;transform:translate(-50%,10px) scale(.6) rotate(-6deg)}15%{opacity:1;transform:translate(-50%,-14px) scale(1.08) rotate(-3deg)}
  70%{opacity:1;transform:translate(-50%,-44px) scale(1) rotate(-3deg)}100%{opacity:0;transform:translate(-50%,-70px) scale(.95) rotate(-3deg)}}
@media (prefers-reduced-motion:reduce){
  .opt.just-right,.tick,.tick path,.cheer-word{animation:none}
  .tick path{stroke-dashoffset:0}
  .cheer-word{display:none}
}

/* ---- Today, Cards, sharing ---- */
.bar{row-gap:6px}
.tabs{flex-wrap:wrap}
@media (max-width:520px){.tab{padding:5px 10px;font-size:14px}}
#dueCount{font-weight:800;color:var(--pink)}
.tab[aria-selected=true] #dueCount{color:var(--hi)}
.tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;line-height:1.5;margin-top:6px}
.tcard{background:var(--card);border:2px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:4px 4px 0 var(--drop)}
.tcard .label{margin-top:0}
.streakbig{display:flex;align-items:baseline;gap:8px}
.streakbig b{font:800 54px/1 var(--f-hand);color:var(--blue);letter-spacing:-.03em}
.streakbig span{font:700 17px var(--f-hand);color:var(--pencil)}
.goalmeter{height:14px;border:2px solid var(--line);border-radius:999px;background:var(--desk);overflow:hidden;margin:10px 0 4px}
.goalmeter i{display:block;height:100%;background:var(--hi);border-right:2px solid var(--line);transition:width .5s cubic-bezier(.2,1.2,.4,1)}
.goaltxt{margin:0 0 10px;font-size:14px;color:var(--pencil)}
.weekbars{display:flex;gap:6px;align-items:flex-end;height:52px;margin-bottom:10px}
.wk{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:3px;font-size:11px;color:var(--pencil)}
.wk i{display:block;width:100%;border-radius:4px 4px 2px 2px;background:var(--rule);min-height:4px}
.wk i.hit{background:var(--ok)}
.wk.now i{outline:2px solid var(--line)}
.wk span{line-height:1}
.goalpick{max-width:140px}
.bignum{font:700 20px var(--f-hand);margin:2px 0 6px}
.bignum b{font:800 44px/1 var(--f-hand);color:var(--blue);margin-right:6px}
.exams{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.exam{display:flex;gap:14px;background:var(--card);border:2px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:4px 4px 0 var(--drop);line-height:1.5}
.exam.past{opacity:.6;box-shadow:none}
.exdays{flex:none;width:76px;text-align:center;background:var(--hi);color:#16182a;border:2px solid var(--line);border-radius:10px;padding:6px 4px;align-self:flex-start}
.exdays b{display:block;font:800 34px/1 var(--f-hand)}
.exdays span{font:700 12px var(--f-hand)}
.exbody{min-width:0;flex:1}
.exname{font:800 20px var(--f-hand)}
.exmeta{font-size:13px;color:var(--pencil)}
.explan{margin:6px 0 0;font-size:15px}
.explanbody{margin-top:10px;border-top:2px dashed var(--edge);padding-top:8px;font-size:15px}
.explanbody p{margin:4px 0}
.addexam summary{list-style:none;cursor:pointer}
.addexam summary::-webkit-details-marker{display:none}
.flash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;min-height:230px;padding:26px 22px;text-align:center;cursor:pointer;
  background:var(--card);border:2px solid var(--line);border-radius:16px;box-shadow:6px 6px 0 var(--drop);color:var(--ink);margin:6px 0 20px}
.flash.flipped{background:var(--sticky)}
.flash .fside{font:800 12px var(--f-hand);letter-spacing:.1em;text-transform:uppercase;color:var(--pencil)}
.flash .ftext{font:700 clamp(22px,4vw,30px)/1.3 var(--f-hand);text-wrap:balance;white-space:pre-wrap}
.flash .fhint,.flash .fq{font-size:13px;color:var(--pencil)}
.flash:not(.flipped){animation:cardIn .25s ease-out}
.flash.flipped{animation:cardFlip .3s ease-out}
@keyframes cardIn{from{transform:translateY(8px);opacity:.4}}
@keyframes cardFlip{from{transform:rotateX(70deg);opacity:.4}}
@media (prefers-reduced-motion:reduce){.flash,.flash.flipped,.goalmeter i{animation:none;transition:none}}
.decks{display:flex;flex-direction:column;gap:10px}
.deck{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:var(--card);border:2px solid var(--line);border-radius:12px;padding:10px 14px;line-height:1.4}
.deck b{display:block;font:800 18px var(--f-hand)}.deck span{font-size:13px;color:var(--pencil)}
.sharebox{margin-top:20px;background:var(--sticky);border:2px solid var(--line);border-radius:12px;padding:12px 14px;line-height:1.5}
.sharerow{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.sharerow input{flex:1;min-width:180px;background:var(--card);border:2px solid var(--line);border-radius:8px;padding:6px 10px}
.note.okmsg{color:var(--ok);font-weight:700}
/* classes, tour, contact, camera */
.addrow{display:flex;gap:8px;margin-top:8px}.addrow .tbtn{flex:1}
.clslist{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.clsitem{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;text-align:left;cursor:pointer;color:var(--ink);font:inherit;
  background:var(--card);border:2px solid var(--line);border-radius:12px;padding:10px 14px;box-shadow:3px 3px 0 var(--drop)}
.clsitem b{font:800 19px var(--f-hand)}.clsitem span{font-size:13px;color:var(--pencil)}
.clscode{font:800 20px var(--f-hand);letter-spacing:.12em;background:var(--hi);color:#16182a;border-radius:6px;padding:0 8px}
.board{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.board li{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--card);border:2px solid var(--line);border-radius:10px;padding:7px 12px}
.board li.me{background:var(--sticky)}
.board .rk{font:800 22px var(--f-hand);width:28px;text-align:center}
.board .nm{flex:1;min-width:110px;font-weight:700}.board .nm em{font:700 11px var(--f-hand);text-transform:uppercase;letter-spacing:.08em;color:var(--pencil);margin-left:4px}
.board .sc{font-size:14px;color:var(--pencil)}.board .sc b{color:var(--ink);font-size:17px}
.clsq{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.clsqrow{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:var(--card);border:2px solid var(--line);border-radius:12px;padding:9px 14px}
.clsqrow b{display:block;font:800 17px var(--f-hand)}.clsqrow span{font-size:13px;color:var(--pencil)}
.clsqrow .tbtn{margin-left:6px}
.mback{position:fixed;inset:0;z-index:100;background:rgba(20,22,30,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.modal{width:min(440px,100%);background:var(--card);color:var(--ink);border:2px solid var(--line);border-radius:16px;box-shadow:8px 8px 0 var(--drop);padding:22px 22px 18px;line-height:1.5}
.modal h2{font:800 26px var(--f-hand);margin:0 0 6px}.modal p{margin:6px 0 14px}
.modal textarea{width:100%;background:var(--paper);color:var(--ink);border:2px solid var(--line);border-radius:10px;padding:8px 10px;font:inherit}
.tourdots{display:flex;gap:6px;margin-bottom:10px}.tourdots i{width:9px;height:9px;border-radius:50%;background:var(--edge)}.tourdots i.on{background:var(--blue)}
.recap{grid-column:1/-1}
/* progress, mock exam, schedule, teach it back */
.mbars{display:flex;flex-direction:column;gap:7px;margin-top:10px}
.mrow{display:grid;grid-template-columns:minmax(90px,1.1fr) 2fr auto;gap:10px;align-items:center;font-size:14px}
.mn{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mn em{font-style:normal;font-size:12px}.mn em.up{color:var(--ok)}.mn em.dn{color:var(--bad)}
.mb{height:12px;border-radius:7px;background:var(--rule);border:1.5px solid var(--line);overflow:hidden}
.mb i{display:block;height:100%;border-radius:6px;background:var(--bad)}.mb i.mid{background:var(--mid)}.mb i.hit{background:var(--ok)}
.mp{font-weight:800;min-width:48px;text-align:right}.mp small{display:block;font-weight:400;font-size:11px;color:var(--pencil)}
.mastery{grid-column:1/-1}
.examclock{font:800 16px var(--f-hand);background:var(--hi);color:#16182a;border-radius:6px;padding:0 8px}.examclock.low{background:var(--bad);color:#fff}
.srcq{font-size:13.5px;color:var(--pencil);border-left:3px solid var(--edge);padding-left:10px;margin:8px 0}
.sched{margin-top:8px;font-size:14px}.sched summary{cursor:pointer;font-weight:700}
.sched ol{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.sched li{display:grid;grid-template-columns:86px 1fr;gap:8px;padding:5px 8px;border-radius:8px}.sched li.now{background:var(--sticky)}.sched li b{font:800 13px var(--f-hand)}
.tbres{margin-top:12px;border-top:2px dashed var(--edge);padding-top:8px}.tbres h4{margin:10px 0 2px;font:800 14px var(--f-hand)}.tbres p{margin:2px 0}
.modal .field{display:block}.modal input{width:100%;background:var(--paper);color:var(--ink);border:2px solid var(--line);border-radius:10px;padding:7px 10px;font:inherit}
.srcq.unsure{border-left-color:var(--bad);color:var(--bad)}
.guestbar{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;padding:8px 16px;background:var(--blue);color:#fff;font-size:14px;text-align:center}
.guestbar .tbtn{background:#fff;color:var(--blue);border-color:#fff}

/* Sprout the mascot */
#sprout{position:fixed;right:8px;bottom:6px;width:104px;z-index:55;pointer-events:none;user-select:none}
#sprout[hidden]{display:none}
@media (max-width:700px){#sprout{width:70px;right:4px;bottom:2px}}
@media print{#sprout{display:none}}
#sprout svg{display:block;width:100%;height:auto;overflow:visible}
#sprout .m,#sprout .x,#sprout .armsup{display:none}
#sprout[data-mood=happy] .m-happy,#sprout[data-mood=joy] .m-joy,#sprout[data-mood=think] .m-think,#sprout[data-mood=sad] .m-sad,
#sprout[data-mood=joy] .x-joy,#sprout[data-mood=think] .x-think,#sprout[data-mood=sad] .x-sad,#sprout[data-mood=joy] .armsup{display:inline}
#sprout[data-mood=joy] .armsdown{display:none}
#sprout .sbub{position:absolute;right:62%;bottom:78%;background:#fff;color:#6b4f5e;border:2px solid #6b4f5e;border-radius:14px 14px 4px 14px;padding:3px 9px;font:700 13px/1.2 var(--f-hand,system-ui);white-space:nowrap;box-shadow:2px 2px 0 rgba(0,0,0,.08)}
@media (max-width:700px){#sprout .sbub{font-size:12px;padding:2px 7px}}
#sprout svg *{transform-box:fill-box}
#sprout .wrap{animation:spBob 3.2s ease-in-out infinite;transform-origin:50% 100%;transform-box:view-box}
#sprout .leaf{transform-origin:50% 100%;animation:spLeaf 3.6s ease-in-out infinite}
#sprout .eyes{transform-origin:50% 50%;animation:spBlink 4.6s infinite}
#sprout .tw1{transform-origin:50% 50%;animation:spTwinkle 1s ease-in-out infinite}
#sprout .tw2{transform-origin:50% 50%;animation:spTwinkle 1s .4s ease-in-out infinite}
#sprout .b1{animation:spBub 1.4s infinite}#sprout .b2{animation:spBub 1.4s .25s infinite}#sprout .b3{animation:spBub 1.4s .5s infinite}
#sprout .drop{animation:spDrop 1.6s ease-in infinite}
#sprout .al{transform-origin:70% 80%;animation:spWaveL .5s ease-in-out infinite alternate}
#sprout .ar{transform-origin:30% 80%;animation:spWaveR .5s ease-in-out infinite alternate}
#sprout[data-mood=joy] .wrap{animation:spJump .55s ease-out 3}
#sprout[data-mood=think] .body{transform-origin:50% 100%;animation:spTilt 2.4s ease-in-out infinite}
#sprout[data-mood=sad] .wrap{animation:spDroop 2.2s ease-out 1 forwards}
@keyframes spBob{0%,100%{transform:translateY(0) scale(1,1)}50%{transform:translateY(-4px) scale(1.015,.985)}}
@keyframes spLeaf{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(8deg)}}
@keyframes spBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes spTwinkle{0%,100%{transform:scale(.6) rotate(0);opacity:.6}50%{transform:scale(1.15) rotate(20deg);opacity:1}}
@keyframes spBub{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes spDrop{0%{transform:translateY(0);opacity:0}20%{opacity:1}100%{transform:translateY(22px);opacity:0}}
@keyframes spWaveL{from{transform:rotate(-14deg)}to{transform:rotate(12deg)}}
@keyframes spWaveR{from{transform:rotate(14deg)}to{transform:rotate(-12deg)}}
@keyframes spJump{0%{transform:translateY(0) scale(1.08,.9)}45%{transform:translateY(-22px) scale(.95,1.07)}100%{transform:translateY(0) scale(1,1)}}
@keyframes spTilt{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes spDroop{0%{transform:translateX(0)}15%{transform:translateX(-4px)}30%{transform:translateX(4px)}45%{transform:translateX(-2px)}60%,100%{transform:translateY(3px) scale(1.03,.96)}}
@media (prefers-reduced-motion:reduce){#sprout *{animation:none!important}}
.field.check{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}.field.check input{width:auto}