/* Goal100 Challenge (challenge/) · pilot, Nov 13, 2026. Uses the site tokens from assets/site.css (fonts, colors, cards, buttons).
   The puzzle picture is always drawn on white "paper" (fixed colors), so it looks the same on the page, on a smart board and on a share picture. */
.gc-wrap{padding-bottom:40px}
.gc-app{padding-top:14px}
.gc-loading{padding:40px 0;color:var(--ink2);font-weight:700}
.gc-note{background:var(--teal-soft);border:2px solid var(--teal);border-radius:16px;padding:12px 14px;margin:14px 0}

/* top line: name, date, stars */
.gc-top{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:flex-end;justify-content:space-between;margin:0 0 10px}
.gc-top h1{font-size:clamp(1.6rem,4.2vw,2.4rem)}
.gc-date{color:var(--ink2);font-weight:700;font-size:.98rem;margin-top:2px}
.gc-stats{display:flex;flex-wrap:wrap;gap:8px}
.gc-stat{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:4px 12px;border-radius:999px;background:var(--card);border:2px solid var(--line);font-weight:700;font-size:.95rem}
.gc-stat b{font:800 1.15rem var(--display);color:var(--brand)}
.gc-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.gc-tabs .gc-btn[aria-current="page"]{background:var(--brand-soft);border-color:var(--brand)}

/* buttons (same shape as the Game Room) */
.gc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px 18px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:800 1rem var(--body);cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent}
.gc-btn:hover{border-color:var(--brand)}
.gc-btn[disabled]{opacity:.45;cursor:not-allowed}
.gc-main{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-size:1.08rem;min-height:54px;padding:10px 24px;box-shadow:0 4px 0 rgba(20,19,80,.4)}
.gc-gold{background:var(--gold);border-color:var(--gold);color:#1B1300}
.gc-small{min-height:44px;padding:4px 14px;font-size:.92rem}

/* the puzzle card */
.gc-card{background:var(--card);border:2px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:16px;overflow:hidden}
.gc-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.gc-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border-radius:999px;font-weight:700;font-size:.84rem;background:var(--bg2);color:var(--ink);border:1.5px solid var(--line)}
.gc-chip.t{background:var(--brand-soft);border-color:transparent;color:var(--ink)}
.gc-chip.s{background:var(--teal-soft);border-color:transparent}
.gc-chip.today{background:var(--gold);color:#1B1300;border-color:transparent}
.gc-stage{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);grid-template-areas:"pic side" "chips side";grid-template-rows:auto 1fr;gap:12px 22px;align-items:start}
.gc-stage>.gc-pic{grid-area:pic}.gc-stage>.gc-side{grid-area:side}.gc-stage>.gc-chips{grid-area:chips;margin:0}
.gc-pic{background:#FFFFFF;border:2px solid var(--line);border-radius:20px;overflow:hidden;line-height:0;position:relative}
.gc-pic svg{display:block;width:100%;height:auto}
.gc-side{display:flex;flex-direction:column;gap:12px;min-width:0}
.gc-dare{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#1B1300;font:800 1.02rem var(--display);letter-spacing:.02em;padding:5px 14px;border-radius:999px;transform:rotate(-1.5deg)}
.gc-q{font:800 clamp(1.3rem,2.6vw,1.75rem)/1.2 var(--display);text-wrap:balance;margin:0}
.gc-qrow{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.gc-listen{flex:none;width:44px;height:44px;border-radius:50%;border:2px solid var(--line);background:var(--card);font-size:1.15rem;cursor:pointer;color:var(--ink)}
.gc-listen:hover{border-color:var(--brand)}

/* answer tiles */
.gc-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gc-tiles.long{grid-template-columns:1fr}
.gc-tile{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 14px;border-radius:18px;border:2.5px solid var(--line);background:var(--bg);color:var(--ink);font:800 1.2rem var(--display);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s ease,border-color .12s ease,background .12s ease}
.gc-tiles.long .gc-tile{font:700 1.02rem/1.3 var(--body);min-height:56px}
.gc-tile:hover{border-color:var(--brand);transform:translateY(-1px)}
.gc-tile .k{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:var(--brand-ink);font:800 1.05rem var(--display)}
.gc-tile:nth-child(2) .k{background:var(--gold);color:#1B1300}
.gc-tile:nth-child(3) .k{background:var(--teal);color:var(--brand-ink)}
.gc-tile:nth-child(4) .k{background:#C2255C;color:#fff}
.gc-tile.no{opacity:.62;border-style:dashed;cursor:default;transform:none}
.gc-tile.no .v{text-decoration:line-through;text-decoration-thickness:2px}
.gc-tile.yes{background:var(--good-soft);border-color:var(--good);cursor:default;transform:none}
.gc-tile .tag{margin-left:auto;font:700 .8rem var(--body);color:var(--ink2);white-space:nowrap}
.gc-tile.yes .tag{color:var(--good)}
.gc-tile[disabled]{cursor:default}

/* number pad */
.gc-num{display:flex;flex-direction:column;gap:10px}
.gc-entry{display:flex;align-items:center;gap:10px;min-height:60px;padding:6px 16px;border-radius:18px;border:2.5px solid var(--brand);background:var(--bg);font:800 2rem var(--display);color:var(--ink)}
.gc-entry .lab{font:700 1rem var(--body);color:var(--ink2)}
.gc-entry .val{margin-left:auto;min-width:1ch}
.gc-entry .val:empty::before{content:"?";color:var(--ink2);opacity:.6}
.gc-keys{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.gc-key{min-height:50px;border-radius:14px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:800 1.3rem var(--display);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.gc-key:hover{border-color:var(--brand)}
.gc-key.go{grid-column:span 6;background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-size:1.1rem;min-height:54px}

/* brain sprint (optional timer) */
.gc-sprint{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.gc-clock{display:none;align-items:center;gap:10px;flex:1;min-width:150px}
.gc-clock.on{display:flex}
.gc-clock .bar{flex:1;height:12px;border-radius:999px;background:var(--bg2);overflow:hidden;border:1.5px solid var(--line)}
.gc-clock .bar i{display:block;height:100%;width:100%;background:var(--gold);transform-origin:left;transition:transform 1s linear}
.gc-clock .n{font:800 1.5rem var(--display);min-width:3.2ch;text-align:right;color:var(--ink)}

/* feedback (kind): "Not yet" and a hint first */
.gc-fb{min-height:0}
.gc-fb .box{border-radius:16px;padding:12px 14px;border:2px solid var(--line);background:var(--bg)}
.gc-fb .box.ny{background:var(--warn-soft);border-color:var(--gold)}
.gc-fb .box.ok{background:var(--good-soft);border-color:var(--good)}
.gc-fb .box b{font:800 1.15rem var(--display)}
.gc-fb .box p{margin-top:4px}
.gc-fb .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.gc-stars{font-size:1.5rem;letter-spacing:2px}
.gc-stars .off{filter:grayscale(1);opacity:.35}

/* explanation: the steps light up on the same picture */
.gc-steps{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;counter-reset:gs}
.gc-steps li{counter-increment:gs;display:none;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:14px;border:2px solid var(--line);background:var(--bg)}
.gc-steps li .n{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--bg2);color:var(--ink);font:800 .95rem var(--display)}
.gc-steps li.on{display:flex}
.gc-steps li.now{border-color:var(--brand);background:var(--brand-soft)}
.gc-steps li.now .n{background:var(--brand);color:var(--brand-ink)}
.gc-stepbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.gc-stepbar .cnt{font-weight:700;color:var(--ink2);margin-left:auto}
.gc-answer{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;border-radius:16px;padding:10px 14px;background:var(--good-soft);border:2px solid var(--good)}
.gc-answer b{font:800 1.35rem var(--display)}
.gc-below{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;margin-top:16px}
.gc-box.d3{grid-column:1/-1}
.gc-box.d3 .gc-3d{max-width:680px}
.gc-box{border-radius:18px;padding:14px 16px;border:2px solid var(--line);background:var(--bg)}
.gc-box h3{font-size:1.12rem;margin-bottom:6px}
.gc-box.trap{background:var(--gold-soft);border-color:var(--gold)}
.gc-box ul{gap:4px}
.gc-box .small{font-size:.9rem;color:var(--ink2)}
.gc-box a{word-break:break-word}

/* picture layers */
.pz-s{display:none}
.pz-s.on{display:inline}
@keyframes pz-draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
@keyframes pz-in{from{opacity:0}to{opacity:1}}
.pz-s.now{animation:pz-in .5s ease both}
.pz-s.now .pz-d{animation:pz-draw .9s ease both}
@keyframes pz-cw{to{transform:rotate(360deg)}}
@keyframes pz-ccw{to{transform:rotate(-360deg)}}
.pz-run .pz-cw{animation:pz-cw 5s linear infinite}
.pz-run .pz-ccw{animation:pz-ccw 5s linear infinite}

/* 3D view */
.gc-3d{position:relative;border-radius:16px;overflow:hidden;border:2px solid var(--line);background:#F3F2FC;line-height:0;margin-top:8px}
.gc-3d canvas{display:block;width:100%;height:auto;touch-action:pan-y;cursor:grab}
.gc-3d .msg{line-height:1.5;padding:18px;color:var(--ink2)}
.gc-3drow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}

/* actions under the card */
.gc-actions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 0}

/* share picture */
.gc-share{margin-top:16px}
.gc-share .in{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:18px;align-items:start}
.gc-share img{display:block;width:100%;height:auto;border-radius:14px;border:2px solid var(--line);background:#1E1D6B}
.gc-seg{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0;margin:0 0 10px}
.gc-seg legend{font-weight:800;margin-bottom:6px;padding:0}
.gc-seg label{display:inline-flex;flex-direction:row;align-items:center;gap:8px;min-height:44px;padding:4px 14px;border:2px solid var(--line);border-radius:999px;background:var(--bg);font-weight:700;cursor:pointer}
.gc-seg input{accent-color:var(--brand);width:18px;height:18px;min-height:0;margin:0;flex:none;display:inline-block;padding:0}
.gc-seg label:has(input:checked){border-color:var(--brand);background:var(--brand-soft)}
.gc-grown{margin-top:10px;font-weight:700}
.gc-say{margin-top:8px;font-weight:700;color:var(--good);min-height:1.4em}

/* archive */
.gc-filters{display:flex;flex-direction:column;gap:10px;margin:6px 0 16px}
.gc-frow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.gc-frow .lab{font-weight:800;min-width:64px}
.gc-f{min-height:44px;padding:4px 14px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:700 .95rem var(--body);cursor:pointer}
.gc-f[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.gc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.gc-item{display:flex;flex-direction:column;background:var(--card);border:2px solid var(--line);border-radius:20px;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow)}
.gc-item:hover,.gc-item:focus-visible{border-color:var(--brand)}
.gc-item .p{background:#fff;line-height:0;border-bottom:2px solid var(--line)}
.gc-item .p svg{display:block;width:100%;height:auto}
.gc-item .b{display:flex;flex-direction:column;gap:6px;padding:10px 12px 12px}
.gc-item .q{font:700 1rem/1.3 var(--body);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gc-item .m{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.gc-item .gc-chip{font-size:.76rem;padding:2px 8px}
.gc-item .st{margin-left:auto;font-size:.95rem;white-space:nowrap}
.gc-count{font-weight:700;color:var(--ink2);margin-bottom:10px}

/* static panel under the game */
.gc-panel{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:18px;margin:22px 0 0;box-shadow:var(--shadow)}
.gc-panel h2{font-size:clamp(1.3rem,3vw,1.8rem);margin-bottom:10px}
.gc-how-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.gc-how-grid>div{background:var(--bg);border-radius:16px;padding:14px}
.gc-how-i{font-size:1.8rem;line-height:1}
.gc-how-grid h3{margin:4px 0}
.gc-private{background:var(--teal-soft);border:2px solid var(--teal);border-radius:16px;padding:10px 14px;margin-top:14px}
.gc-more{margin-top:12px}
.gc-more a{display:inline-block;padding:6px 0}

/* phones */
@media (max-width:820px){
  .gc-stage{grid-template-columns:minmax(0,1fr);grid-template-areas:"pic" "side" "chips";grid-template-rows:auto;gap:12px}
  .gc-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .gc-tabs .gc-btn{padding:4px 6px;font-size:.9rem;line-height:1.15;text-align:center;gap:5px}
  .gc-top h1{font-size:1.6rem}
  .gc-date{font-size:.92rem}
  .gc-stat{min-height:34px;font-size:.88rem;padding:2px 10px}
  .gc-app{padding-top:4px}
  .gc-card{padding:12px;border-radius:22px}
  .gc-share .in{grid-template-columns:1fr}
  .gc-share img{max-width:300px}
  .gc-top{align-items:flex-start}
  .gc-keys{gap:6px}
  .gc-key{min-height:48px}
}
@media (max-width:420px){
  .gc-tile{font-size:1.08rem;padding:8px 10px;gap:9px;min-height:60px}
  .gc-tile .k{width:30px;height:30px;font-size:.95rem}
  .gc-tile .tag{display:none}
  .gc-actions .gc-btn{flex:1 1 100%}
  .gc-stat{font-size:.88rem;padding:4px 10px}
}
/* a phone held sideways: picture and answers side by side again */
@media (max-width:940px) and (orientation:landscape) and (max-height:520px){
  .gc-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"pic side" "chips side";gap:10px 14px}
  .gc-top h1{font-size:1.5rem}
}

/* ---------- smart-board mode (?board=1): big picture, big timer, Reveal ---------- */
html.gc-board .note,html.gc-board header.top,html.gc-board footer.foot,html.gc-board .gc-panel,html.gc-board .skip,html.gc-board .g100-crumbs,html.gc-board .g100-top,html.gc-board .g100-homelogo,html.gc-board .g100mb-fab,html.gc-board #g100f-btn{display:none!important}
html.gc-board body{background:var(--bg)}
html.gc-board .gc-wrap{max-width:none;padding:0 max(14px,env(safe-area-inset-left,0px)) 0 max(14px,env(safe-area-inset-right,0px))}
html.gc-board .gc-app{padding:10px 0 0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.gb{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}
.gb-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.gb-head .name{font:800 clamp(1.1rem,1.6vw,1.6rem) var(--display);color:var(--brand)}
.gb-head .gc-chips{margin:0}
.gb-head .sp{margin-left:auto}
.gb-main{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(12px,1.6vw,28px);align-items:center;flex:1;min-height:0}
.gb-pic{background:#fff;border:3px solid var(--line);border-radius:24px;overflow:hidden;line-height:0;max-height:calc(100dvh - 222px - var(--gbx,0px));aspect-ratio:4/3;justify-self:center;width:min(100%,calc((100dvh - 222px - var(--gbx,0px)) * 4 / 3))}
.gb-pic svg{display:block;width:100%;height:100%}
.gb-side{display:flex;flex-direction:column;gap:clamp(6px,min(1.2vw,1.6vh),18px);min-width:0}
.gb-side .gc-dare{font-size:clamp(1rem,1.5vw,1.6rem)}
.gb-q{font:800 clamp(1.3rem,min(2.5vw,4.2vh),2.9rem)/1.15 var(--display);margin:0;text-wrap:balance}
.gb-q.lq{font-size:clamp(1.1rem,min(2vw,3.4vh),2.3rem)}
.gb-ch{display:grid;grid-template-columns:1fr 1fr;gap:clamp(6px,.8vw,14px);margin:0;padding:0;list-style:none}
.gb-ch.long{grid-template-columns:1fr}
.gb-ch li{display:flex;align-items:center;gap:12px;padding:clamp(6px,.8vw,14px) clamp(10px,1vw,18px);border-radius:18px;border:3px solid var(--line);background:var(--card);font:800 clamp(1.05rem,1.8vw,2.1rem)/1.15 var(--display)}
.gb-ch.long li{font-size:clamp(.92rem,min(1.4vw,2.5vh),1.6rem)}
.gb-ch li .k{flex:none;width:clamp(30px,2.6vw,48px);height:clamp(30px,2.6vw,48px);border-radius:50%;display:grid;place-items:center;background:var(--brand);color:var(--brand-ink);font-size:clamp(.95rem,1.4vw,1.5rem)}
.gb-ch li:nth-child(2) .k{background:var(--gold);color:#1B1300}.gb-ch li:nth-child(3) .k{background:var(--teal);color:var(--brand-ink)}.gb-ch li:nth-child(4) .k{background:#C2255C;color:#fff}
.gb-ch li.yes{background:var(--good-soft);border-color:var(--good)}
.gb-ch li.dim{opacity:.4}
.gb-numq{font:800 clamp(1.1rem,1.8vw,2rem) var(--display);color:var(--ink2)}
.gb-ans{font:800 clamp(1.4rem,2.6vw,3rem) var(--display);padding:8px 18px;border-radius:18px;background:var(--good-soft);border:3px solid var(--good);align-self:flex-start}
.gb-step{font:700 clamp(1rem,min(1.7vw,2.9vh),2rem)/1.3 var(--body);padding:12px 16px;border-radius:18px;background:var(--brand-soft);border:3px solid var(--brand)}
.gb-step .n{font:800 .8em var(--display);color:var(--brand);display:block}
.gb-trap{font:700 clamp(.9rem,min(1.3vw,2.3vh),1.5rem)/1.35 var(--body);padding:10px 14px;border-radius:16px;background:var(--gold-soft);border:2px solid var(--gold)}
.gb-timer{font:800 clamp(2.4rem,min(5vw,7.5vh),6rem)/1 var(--display);color:var(--brand);font-variant-numeric:tabular-nums}
.gb-timer.end{color:var(--gold-deep)}
.gb-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;padding:8px 0 max(10px,env(safe-area-inset-bottom,0px))}
.gb-bar .gc-btn{min-height:52px}
.gb-keys{font-size:.85rem;color:var(--ink2);text-align:center;padding-bottom:6px}
@media (max-width:760px),(max-height:520px){
  .gb-main{grid-template-columns:1fr;align-items:start}
  .gb-pic{max-height:none;width:100%}
  .gb-keys{display:none}
}
@media (max-height:520px) and (orientation:landscape){
  .gb-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .gb-pic{width:min(100%,calc((100dvh - 130px) * 4 / 3));max-height:calc(100dvh - 130px)}
}
@media print{ .gc-actions,.gc-sprint,.gc-tabs,.gc-share,.gb-bar{display:none!important} }

/* ---------- added with challenge.js (Nov 13) ---------- */
.gc-top .eyebrow{display:inline-block;margin-bottom:2px}
.gc-tile.solo{justify-content:center}
.gc-tile.solo .k{width:44px;height:44px;font-size:1.35rem}
.gc-tile.solo .v{display:none}
.gc-tile.solo .tag{margin-left:0}
.gc-tile .v{min-width:0;overflow-wrap:anywhere}
.gc-tiles.three:not(.long){grid-template-columns:repeat(3,1fr)}
.gc-key.del{grid-column:span 2}
.gc-entry .u{font-size:1.5rem;color:var(--ink2)}
.gc-sprint .opt{font-size:.9rem;color:var(--ink2);font-weight:700}
.gc-fb .hint{display:block;margin-top:4px}
.gc-yes{font:800 1.15rem var(--display);color:var(--good);margin:0}
.gc-yes:focus{outline:none}
.gc-answer .lab{font-weight:700;color:var(--ink2)}
.gc-answer .gc-stars{margin-left:auto;font-size:1.3rem}
.gc-steps li span{min-width:0}
.gc-was{margin-top:12px;font-weight:700;color:var(--ink2)}
.gc-was .gc-stars{font-size:1.05rem;letter-spacing:1px}
.gc-src,.gc-go{padding-left:1.1em}
.gc-src li{font-size:.95rem}
.gc-go a{display:inline-block;padding:4px 0}
.gc-share canvas{display:block;width:100%;height:auto;border-radius:14px;border:2px solid var(--line);background:#1E1D6B}
.gc-share h2:focus,.gc-top h1:focus,.gb-q:focus{outline:none}
.gc-share .small{font-size:.9rem;color:var(--ink2);margin-top:6px}
.gc-share .in>div>p:first-child{margin-bottom:12px}
.gc-item .new{font:700 .8rem var(--body);color:var(--teal);border:1.5px solid var(--teal);border-radius:999px;padding:1px 8px}
.gc-item .gc-stars{font-size:.9rem;letter-spacing:0}
.gc-chip.n{background:var(--card);font-weight:800}
.gc-3drow .small{font-size:.9rem;color:var(--ink2)}
.gb-q.sm{font-size:clamp(1rem,min(1.6vw,2.8vh),1.9rem)}
.gb-ch.sm li{font-size:clamp(.95rem,1.4vw,1.6rem);padding:clamp(4px,.5vw,10px) clamp(8px,.9vw,16px)}
.gb-timer.idle{opacity:.45}
.gb-ch .v{min-width:0}
@media (max-width:820px){ .gc-share canvas{max-width:300px} }
.gb-timer.off{visibility:hidden}
.gc-foot{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.gc-foot .gc-tabs{margin:0}
@media (max-width:820px){ main.gc-wrap{padding-top:14px} .gc-app{padding-top:0;margin-top:-10px} .gc-top{margin-bottom:8px} .gc-top .eyebrow{font-size:.72rem} }
.gc-go a,.gc-src a,.gc-more a{display:inline-flex;align-items:center;min-height:44px;padding:0}
.gc-src a{word-break:break-all}
.gc-go,.gc-src{gap:0}
.gc-tile .v{line-height:1.2}
.gc-seg label{width:auto;margin:0}
.gb-ch li.solo{justify-content:center}
.gb-ch li.solo .v{display:none}
.gb-ch li.yes.solo .v{display:inline}

/* =====================================================================================
   Daily hooks (Nov 13, 2026): my grade, streak shields, badges, levels, more puzzles,
   Random 5, class teams, teacher pages, printables, family game. Same tokens as above.
   ===================================================================================== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gc-tabs .gc-btn span+span{white-space:nowrap}
a.gc-stat,button.gc-stat{color:var(--ink);text-decoration:none;cursor:pointer;font-family:var(--body);min-height:44px}
a.gc-stat:hover,button.gc-stat:hover{border-color:var(--brand)}
.gc-stat.snd[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand)}
.gc-shd{font-size:.95rem;margin-left:2px}
.gc-gradechip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:2px 12px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font-weight:800;text-decoration:none;vertical-align:middle}
.gc-gradechip .ch{font-weight:700;font-size:.85em;color:var(--brand);text-decoration:underline}
.gc-gradechip:hover{border-color:var(--brand)}
.gc-wel{background:var(--teal-soft);border:2px solid var(--teal);border-radius:16px;padding:10px 14px;margin:0 0 12px;font-weight:700}
.gc-chip.boss{background:#3B2A7A;color:#FFE39A;border-color:transparent}
.gc-card.boss{border-color:var(--gold);box-shadow:0 0 0 4px var(--gold-soft),var(--shadow)}
.gc-watch{font:800 1.5rem var(--display);font-variant-numeric:tabular-nums;color:var(--ink);min-width:3.4ch}
.gc-earned{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.gc-earned li{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:14px;background:var(--bg);border:2px solid var(--line);font-weight:700}
.gc-earned li.new{background:var(--gold-soft);border-color:var(--gold)}
.gc-earned li span{min-width:0}
.gc-earned a{display:inline-flex;align-items:center;min-height:44px}
.gc-bdg{flex:none;width:48px;height:48px}
.gc-sp-next{display:flex}
.gc-sp-next .gc-btn{flex:1}
.gc-learn{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:800}
.gc-say-list{margin:6px 0 0;padding-left:1.15em;display:flex;flex-direction:column;gap:5px}
.gc-say-list li{font-weight:600}
.gc-box.talk{background:var(--teal-soft);border-color:var(--teal)}
.gc-tom{margin-top:16px;border-radius:22px;padding:16px 18px;background:var(--brand-soft);border:2px solid var(--brand)}
.gc-tom h3{font-size:1.25rem;margin-bottom:4px}
.gc-tom .small{font-size:.92rem;color:var(--ink2);margin-top:4px}
.gc-tom .row,.gc-mid .row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.gc-mid .row{justify-content:center}

/* my grade */
.gc-grades{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:8px 0 16px}
.gc-grade{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;padding:14px 10px;border-radius:22px;border:3px solid var(--line);background:var(--card);color:var(--ink);font:800 1.15rem var(--display);cursor:pointer;box-shadow:var(--shadow);-webkit-tap-highlight-color:transparent}
.gc-grade .i{font-size:2.4rem;line-height:1}
.gc-grade:hover{border-color:var(--brand)}
.gc-grade[aria-pressed="true"]{border-color:var(--brand);background:var(--brand-soft)}

/* Random 5 and end cards */
.gc-mid{text-align:center;max-width:680px;margin-left:auto;margin-right:auto}
.gc-mid p{margin:8px auto;max-width:52ch}
.gc-big{font-size:3.4rem;line-height:1}
.gc-pb{font-weight:700}
.gc-sp-stars{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center}
.gc-sp-stars .gc-stars{font-size:1.15rem;letter-spacing:0}
.gc-dots{display:inline-flex;gap:5px;margin-left:8px;vertical-align:middle}
.gc-dots i{width:12px;height:12px;border-radius:50%;background:var(--bg2);border:2px solid var(--line)}
.gc-dots i.d{background:var(--good);border-color:var(--good)}
.gc-dots i.n{background:var(--gold);border-color:var(--gold-deep)}
.gc-mid .gc-earned{text-align:left;margin:12px auto;max-width:440px}

/* more puzzles */
.gc-arc-top{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;margin-bottom:10px}
.gc-arc-top .gc-count{margin:0}
.gc-morerow{display:flex;justify-content:center;margin-top:16px}
.gc-morerow .small{font-weight:700;color:var(--ink2)}
.gc-item.ghost .p{aspect-ratio:4/3;background:var(--bg2)}
.gc-item.ghost .q{background:var(--bg2);border-radius:8px}

/* smart board: teams, the week's days, class talk */
.gb-teams{display:flex;gap:10px;align-items:center}
.gb-team{display:flex;align-items:center;gap:6px;padding:4px 6px 4px 12px;border-radius:999px;border:3px solid var(--brand);background:var(--card)}
.gb-team.b{border-color:var(--gold)}
.gb-team .nm{font:800 clamp(.95rem,1.2vw,1.3rem) var(--display)}
.gb-team .sc{font:800 clamp(1.6rem,min(2.6vw,4.6vh),3rem)/1 var(--display);min-width:1.6ch;text-align:center;font-variant-numeric:tabular-nums;color:var(--ink)}
.gb-team button{min-width:52px;min-height:52px;border-radius:999px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font:800 1.3rem var(--display);cursor:pointer;touch-action:manipulation}
.gb-team button.pl{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);min-width:64px}
.gb-team.b button.pl{background:var(--gold);border-color:var(--gold);color:#1B1300}
@keyframes gb-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
.gb-team .sc.pop{animation:gb-pop .35s ease}
.gb.teams .gb-head .gc-chips,.gb.wk .gb-head .gc-chips{display:none}
@media (min-width:1700px){ .gb.teams:not(.wk) .gb-head .gc-chips,.gb.wk:not(.teams) .gb-head .gc-chips{display:flex} }
@media (max-width:1500px){ .gb-bar .gc-btn{padding:8px 14px;font-size:.95rem} .gb-bar .gc-btn .tx{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} .gb-band select{max-width:170px} }
.gb-keys{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gb-days{display:flex;flex-wrap:wrap;gap:6px}
.gb-day{display:inline-flex;align-items:center;min-height:44px;padding:2px 12px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font-weight:800;text-decoration:none;font-size:clamp(.85rem,1vw,1.1rem)}
.gb-day[aria-current="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.gb-talk{font:700 clamp(.95rem,min(1.45vw,2.5vh),1.7rem)/1.3 var(--body);padding:12px 16px;border-radius:18px;background:var(--teal-soft);border:3px solid var(--teal)}
.gb-talk b{font-family:var(--display);display:block;margin-bottom:4px}
.gb-talk ul{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:.25em}
.gb-band select{min-height:52px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:800 1rem var(--body);padding:0 14px;max-width:210px}

/* trophy shelf */
.gc-level h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.gc-level .lvn{font:800 1rem var(--display);background:var(--brand);color:var(--brand-ink);border-radius:999px;padding:2px 14px}
.gc-xp{height:18px;border-radius:999px;background:var(--bg2);border:2px solid var(--line);overflow:hidden}
.gc-xp i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),#F6BE5E);border-radius:999px}
.gc-xpl{margin-top:8px}
.gc-level .small,.gc-shelf-say{font-size:.92rem;color:var(--ink2)}
.gc-ladder{margin-top:10px}
.gc-ladder summary{cursor:pointer;font-weight:800;min-height:44px;display:flex;align-items:center}
.gc-ladder ol{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column-reverse;gap:5px}
.gc-ladder li{display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:12px;border:2px solid var(--line);background:var(--bg)}
.gc-ladder li .n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--bg2);font:800 .95rem var(--display)}
.gc-ladder li .nm{font-weight:800}
.gc-ladder li .x{margin-left:auto;font-size:.88rem;color:var(--ink2);font-weight:700;text-align:right}
.gc-ladder li.done{opacity:.8}
.gc-ladder li.here{border-color:var(--brand);background:var(--brand-soft)}
.gc-ladder li.here .n{background:var(--brand);color:var(--brand-ink)}
.gc-cnt{font:800 .95rem var(--display);background:var(--gold-soft);border:2px solid var(--gold);border-radius:999px;padding:1px 12px;margin-left:8px;vertical-align:middle;color:var(--ink)}
.gc-shelf{border-radius:18px;overflow:hidden;border:2px solid var(--line);background:#EFEAFB;line-height:0}
.gc-shelf canvas{display:block;width:100%;height:auto;touch-action:pan-y;cursor:pointer}
.gc-shelf-say{margin:8px 0 12px;min-height:2.8em;font-weight:700;color:var(--ink)}
.gc-badges{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.gc-badges li{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:16px;border:2px solid var(--line);background:var(--bg)}
.gc-badges li.got{border-color:var(--gold);background:var(--gold-soft)}
.gc-badges .gc-bdg{width:60px;height:60px}
.gc-badges .t{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:.92rem}
.gc-badges .t b{font:800 1.05rem var(--display)}
.gc-badges .pr{font-weight:700;display:flex;align-items:center;gap:8px;color:var(--ink2)}
.gc-badges li.got .pr{color:var(--good)}
.gc-badges .bar{flex:1;max-width:120px;height:9px;border-radius:999px;background:var(--bg2);border:1.5px solid var(--line);overflow:hidden}
.gc-badges .bar i{display:block;height:100%;background:var(--brand)}
.gc-rules{padding-left:1.15em;display:flex;flex-direction:column;gap:5px;margin-top:8px}

/* teachers */
.gc-wknav{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:12px}
.gc-wknav h2{margin:0;text-align:center;font-size:clamp(1.1rem,2.6vw,1.6rem)}
.gc-wknav .gc-btn{min-width:48px}
.gc-cta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.gc-days{list-style:none;margin:0 0 10px;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.gc-days li{display:flex;flex-direction:column;gap:6px;border:2px solid var(--line);border-radius:16px;background:var(--bg);padding:8px;min-width:0}
.gc-days li.ghost{min-height:150px}
.gc-days .pic{display:block;background:#fff;border-radius:10px;overflow:hidden;line-height:0;border:1.5px solid var(--line)}
.gc-days .pic svg{display:block;width:100%;height:auto}
.gc-days .d{font:800 .98rem var(--display);display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.gc-days .q{font-size:.88rem;line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.gc-days .m{display:flex;flex-wrap:wrap;gap:4px}
.gc-days .gc-chip{font-size:.72rem;padding:1px 7px}
.gc-week .small{font-size:.9rem;color:var(--ink2)}
.gc-prints{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.gc-print{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:18px;border:2px solid var(--line);background:var(--bg);color:var(--ink);text-decoration:none}
.gc-print:hover{border-color:var(--brand)}
.gc-print .i{font-size:1.8rem;line-height:1}
.gc-print b{font:800 1.08rem var(--display);color:var(--brand)}
.gc-print span{font-size:.92rem}

/* family game */
.gc-fam{max-width:680px}
.gf-names{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin:4px 0 14px}
.gf-name{display:flex;flex-direction:column;gap:4px;font-weight:800;margin:0}
.gf-name input{min-height:48px;border-radius:14px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font:700 1.05rem var(--body);padding:6px 12px;width:100%}
.gf-pass h1{font-size:clamp(1.6rem,5vw,2.4rem)}
.gf-pass h1 b{color:var(--brand)}
.gf-pass .eyebrow{display:block}
.gf-who,.gf-score{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.gf-who li,.gf-score li{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:14px;border:2px solid var(--line);background:var(--bg);font-weight:700}
.gf-who li.ok{border-color:var(--good);background:var(--good-soft)}
.gf-who .r,.gf-score span{margin-left:auto;font-weight:800}
.gf-who li.ok .r{color:var(--good)}
.gf-score{max-width:420px;margin:12px auto;text-align:left;counter-reset:none}
.gf-score li:first-child{border-color:var(--gold);background:var(--gold-soft)}

/* printables: pages are real paper sizes; on screen they are scaled to fit */
.gp-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 14px}
.gp-tools .small{font-size:.9rem;color:var(--ink2);flex:1 1 260px}
.gp-wrap{display:flex;flex-direction:column;gap:18px}
.gp-fit{width:100%;overflow:hidden}
.gp-page{width:7.6in;min-height:10.05in;box-sizing:border-box;background:#fff;color:#16163A;font:10.5pt/1.3 var(--body);transform-origin:0 0;border:1px solid #C9C8E6;padding:.22in;display:flex;flex-direction:column;gap:.09in}
.gp-page.land{width:10.1in;min-height:7.55in}
.gp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:.2in;border-bottom:2.5pt solid #2B2A8C;padding-bottom:.05in}
.gp-head .gp-ttl{font:800 17pt/1.1 var(--display);color:#2B2A8C;display:block}
.gp-head span{font-weight:700;color:#55577A;font-size:9.5pt}
.gp-name{font-weight:700;white-space:nowrap;font-size:10pt}
.gp-name i,.gp-row .ln i{display:inline-block;border-bottom:1pt solid #16163A;width:1.9in;height:.9em}
.gp-name i.s,.gp-row .ln i.s{width:.8in}
.gp-row{display:flex;gap:.16in;align-items:flex-start;border:1pt solid #C9C8E6;border-radius:.1in;padding:.07in;flex:1;break-inside:avoid}
.gp-pic{flex:none;width:2.12in;border:1pt solid #C9C8E6;border-radius:.06in;overflow:hidden;line-height:0}
.gp-pic svg,.gp-cal .cp svg{display:block;width:100%;height:auto}
.gp-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:.04in}
.gp-txt h3{font:800 11.5pt/1.15 var(--display);color:#2B2A8C;margin:0}
.gp-txt h3 span{font:700 8.5pt var(--body);color:#55577A;margin-left:.08in}
.gp-txt .q{font-weight:700;font-size:10.5pt;margin:0}
.gp-txt .ch{font-size:9.5pt;margin:0}
.gp-txt .ln{margin:auto 0 0;font-size:9.5pt;padding-top:.08in}
.gp-row .ln i{width:2.3in}
.gp-foot{margin-top:auto;display:flex;justify-content:space-between;gap:.2in;font-size:7.5pt;color:#55577A;border-top:1pt solid #C9C8E6;padding-top:.04in}
.gp-key{break-inside:avoid;border-bottom:1pt solid #C9C8E6;padding-bottom:.05in}
.gp-key h3{font:800 11pt/1.2 var(--display);color:#2B2A8C;margin:0}
.gp-key h3 b{color:#0E7C66}
.gp-key h3 span{font:700 8pt var(--body);color:#55577A;margin-left:.08in}
.gp-key .q{font-size:8.5pt;color:#55577A;margin:0}
.gp-key ol{margin:.02in 0 0;padding-left:1.3em;font-size:9pt}
.gp-key .tr{font-size:8.5pt;margin:.02in 0 0}
.gp-starters{font-size:8.5pt;background:#DDF3EE;border-radius:.06in;padding:.05in .08in}
.gp-cal{display:table!important;width:100%!important;border-collapse:collapse;table-layout:fixed;flex:1}
.gp-cal thead{position:static!important;display:table-header-group!important;width:auto!important;height:auto!important}
.gp-cal tbody{display:table-row-group!important}
.gp-cal tr{display:table-row!important}
.gp-cal td,.gp-cal th{display:table-cell!important}
.gp-cal td::before{content:none!important}
.gp-cal th{font:800 9.5pt var(--display);color:#fff;background:#2B2A8C;padding:.03in;border:1pt solid #2B2A8C}
.gp-cal td{border:1pt solid #9A9BB5;vertical-align:top;padding:.04in;height:1.2in;position:relative}
.gp-cal td.out{background:#F3F2FC}
.gp-cal td.boss{background:#FDF0D8}
.gp-cal .dn{font:800 10.5pt/1 var(--display);color:#2B2A8C;position:absolute;left:.05in;top:.05in}
.gp-cal .cp{display:block;width:1.06in;margin:0 0 .02in auto;border:.75pt solid #C9C8E6;line-height:0;background:#fff}
.gp-cal .q{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:6.9pt;line-height:1.18;font-weight:700}
.gp-ans{display:block;columns:2;column-gap:.3in;margin:0;padding-left:0;list-style:none;font-size:8.3pt;line-height:1.25}
.gp-ans li{break-inside:avoid;margin-bottom:.045in}
.gp-ans .tr{color:#55577A}
@page{size:letter;margin:.45in}
@page gpland{size:letter landscape;margin:.45in}
@media print{
  html.gc-printing body{background:#fff!important}
  html.gc-printing .note,html.gc-printing header.top,html.gc-printing footer.foot,html.gc-printing .gc-panel.gc-how,html.gc-printing .skip,html.gc-printing .g100-crumbs,html.gc-printing .g100-top,html.gc-printing .g100-homelogo,html.gc-printing .g100mb-fab,html.gc-printing #g100f-btn,html.gc-printing .gp-tools,html.gc-printing .gc-top,html.gc-printing body>*:not(main){display:none!important}
  html.gc-printing main.gc-wrap{max-width:none!important;padding:0!important;margin:0!important}
  html.gc-printing .gc-app{padding:0!important;margin:0!important}
  html.gc-printing .gp-wrap{display:block}
  html.gc-printing .gp-fit{height:auto!important;overflow:visible}
  html.gc-printing .gp-page{transform:none!important;border:0;padding:0;break-after:page;min-height:9.7in;width:auto}
  html.gc-printing .gp-page.land{page:gpland;min-height:7.2in}
  html.gc-printing .gp-page.land.key{min-height:0}
  html.gc-printing .gp-page.key:not(.land){min-height:0}
  html.gc-printing .gp-fit:last-child .gp-page{break-after:auto}
  .gc-tom,.gc-foot,.gc-stats{display:none!important}
}

/* phones */
@media (max-width:820px){
  .gc-tabs{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .gc-tabs .gc-btn{flex-direction:column;gap:1px;padding:4px 2px;font-size:.74rem;min-height:52px;border-radius:14px}
  .gc-tabs .gc-btn span[aria-hidden]{font-size:1.15rem;line-height:1}
  .gc-tabs .gc-btn span+span{white-space:normal;overflow-wrap:anywhere}
  .gc-stats{gap:6px}
  .gc-filters{gap:6px}
  .gc-frow{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:2px 0 6px;margin-right:-16px;padding-right:16px}
  .gc-frow .lab{min-width:0;flex:none;font-size:.9rem;position:sticky;left:0;background:var(--bg);padding-right:6px;align-self:stretch;display:flex;align-items:center;z-index:1}
  .gc-frow .gc-f{flex:none;white-space:nowrap}
  a.gc-stat,button.gc-stat{min-height:44px}
  .gc-days{grid-template-columns:1fr}
  .gc-days li{display:grid;grid-template-columns:104px minmax(0,1fr);gap:4px 10px;align-items:start}
  .gc-days li .pic{grid-row:1 / span 3}
  .gc-days li.ghost{min-height:90px}
  .gc-grades{grid-template-columns:1fr 1fr}
  .gc-grade{min-height:104px}
  .gc-badges{grid-template-columns:1fr}
  .gc-cta .gc-btn{flex:1 1 100%}
  .gb-teams{flex-wrap:wrap;justify-content:center;width:100%}
  .gc-date .gc-gradechip{margin-top:4px}
}
@media (max-width:380px){ .gc-tabs .gc-btn{font-size:.68rem} }
@media (prefers-reduced-motion:reduce){ .gb-team .sc.pop{animation:none} }

.gc-alsook{font-size:.95rem;font-weight:700;color:var(--ink2);margin:0}
#gc-stepwrap{display:flex;flex-direction:column;gap:10px}
.gb-bar .gc-btn{min-width:52px}
.gc-earned li>span:first-child{flex:none}

/* "Watch it solved" + "Turn it in 3D" buttons (challenge/solve.js is fetched only when one is tapped) */
.gc-solvebar{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
.gc-solvebar .gc-btn{flex:1 1 0;min-width:140px}
.gc-btn.gc-solve{background:var(--brand);border-color:var(--brand);color:var(--brand-ink,#fff)}
.gc-btn.gc-solve3{background:var(--gold);border-color:var(--gold);color:#1B1300}
.gb-bar .gc-btn.gc-solve{background:var(--brand);border-color:var(--brand);color:var(--brand-ink,#fff)}
@media print{ .gc-solvebar{display:none!important} }
