/* ACTFL Builder (v0.26.24.0) — the Deck Builder's ACTFL test tool.
   The .ab-cq rules at the end draw the helper's phone screens; they are the
   /translate/ page's app-look rules, scoped so they never reach the rest of the app. */
.module-actfl-builder{max-width:1240px;margin:0 auto;padding:1rem 1rem 3rem;color:var(--text-primary,#1d1d1f)}
.ab-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:.5rem 0 .75rem;position:sticky;top:0;z-index:5;background:var(--bg-primary,#fff);padding:6px 0}
.ab-grow{flex:1}
.ab-select,.module-actfl-builder select,.module-actfl-builder input{font:inherit;font-size:.9rem;padding:5px 8px;border:1px solid var(--border-color,#d9dbe0);border-radius:6px;background:var(--card-bg,#fff);color:var(--text-primary,#1d1d1f);max-width:100%}
.ab-btn{font:inherit;font-size:.88rem;padding:5px 11px;border:1px solid var(--border-color,#d9dbe0);border-radius:6px;background:var(--card-bg,#fff);color:var(--text-primary,#1d1d1f);cursor:pointer;white-space:nowrap}
.ab-btn.sm{font-size:.82rem;padding:3px 9px}
.ab-btn.pri{background:var(--primary,#4F46E5);border-color:var(--primary,#4F46E5);color:#fff}
.ab-btn.ab-danger{color:var(--danger,#b3261e)}
.ab-seg{display:inline-flex;border:1px solid var(--border-color,#d9dbe0);border-radius:7px;overflow:hidden}
.ab-seg button{font:inherit;font-size:.85rem;border:0;background:var(--card-bg,#fff);color:var(--text-primary,#1d1d1f);padding:5px 12px;cursor:pointer}
.ab-seg button[aria-pressed="true"]{background:var(--primary,#4F46E5);color:#fff;font-weight:600}
.ab-status{font-size:.85rem;color:var(--text-secondary,#5f6368)}
.ab-status.ok{color:var(--success,#047857)}.ab-status.bad{color:var(--danger,#dc2626);font-weight:600}
.ab-tabs{display:flex;gap:2px;border-bottom:1px solid var(--border-color,#d9dbe0);margin-bottom:12px;overflow-x:auto}
.ab-tabs button{font:inherit;font-size:.92rem;background:none;border:0;border-bottom:3px solid transparent;padding:7px 14px;color:var(--text-secondary,#5f6368);cursor:pointer;white-space:nowrap}
.ab-tabs button[aria-selected="true"]{color:var(--text-primary,#1d1d1f);font-weight:600;border-bottom-color:var(--primary,#4F46E5)}
.ab-banner{font-size:.9rem;padding:8px 12px;border-radius:6px;background:var(--bg-secondary,#eef2ff);border-left:4px solid var(--primary,#4F46E5);margin-bottom:12px}
.ab-hidden{display:none!important}
.ab-hint{font-size:.85rem;color:var(--text-secondary,#5f6368);margin:0 0 10px}
.ab-empty{color:var(--text-secondary,#5f6368);padding:16px}
.ab-tset{border:1px solid var(--border-color,#d9dbe0);border-radius:8px;padding:6px 10px;margin-bottom:12px;display:flex;flex-wrap:wrap;gap:6px}
details.ab-tset{display:block}
.ab-tset summary{cursor:pointer;font-weight:600;font-size:.92rem}
.ab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin:10px 0}
.ab-grid label,.ab-meta label{display:flex;flex-direction:column;font-size:.75rem;color:var(--text-secondary,#5f6368);gap:2px}
.ab-grid .ab-wide{grid-column:1/-1}
.ab-split{display:grid;grid-template-columns:280px minmax(0,1fr);gap:14px;align-items:start}
.ab-split-phone{grid-template-columns:minmax(0,1fr) 260px}
.ab-listtools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px;font-size:.85rem}
.ab-chk{display:inline-flex;gap:5px;align-items:center;cursor:pointer}
.ab-qlist{border:1px solid var(--border-color,#d9dbe0);border-radius:8px;overflow:hidden;max-height:70vh;overflow-y:auto}
.ab-gh{background:var(--bg-secondary,#f3f3f6);padding:4px 10px;font-weight:600;font-size:.72rem;color:var(--text-secondary,#5f6368);text-transform:uppercase;letter-spacing:.03em}
.ab-q{display:flex;width:100%;gap:8px;align-items:center;padding:6px 10px;border:0;border-top:1px solid var(--border-color,#d9dbe0);background:var(--card-bg,#fff);color:inherit;font:inherit;font-size:.87rem;text-align:left;cursor:pointer}
.ab-q.on{background:var(--bg-secondary,#eef2ff);box-shadow:inset 3px 0 0 var(--primary,#4F46E5)}
.ab-q b{width:22px;color:var(--text-secondary,#5f6368);flex:none}
.ab-qt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-dot{width:8px;height:8px;border-radius:50%;background:var(--success,#1e7d43);flex:none}.ab-dot.r{background:var(--danger,#dc2626)}
.ab-chip{font-size:.75rem;padding:1px 8px;border-radius:9px;background:var(--bg-secondary,#f3f3f6);color:var(--text-secondary,#5f6368);white-space:nowrap}
.ab-editor{border:1px solid var(--border-color,#d9dbe0);border-radius:8px;padding:12px 14px;min-width:0}
.ab-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-bottom:10px}
.ab-qh{font-size:1rem;margin-right:6px;align-self:center}
.ab-pairs{display:grid;grid-template-columns:140px minmax(0,1fr) minmax(0,1fr);border:1px solid var(--border-color,#d9dbe0);border-radius:6px;overflow:hidden;font-size:.92rem}
.ab-pairs>div,.ab-lines>div{padding:7px 10px;border-top:1px solid var(--border-color,#d9dbe0);min-width:0;min-height:2.2em}
.ab-pairs>.h,.ab-lines>.h{background:var(--bg-secondary,#f3f3f6);font-weight:600;font-size:.75rem;color:var(--text-secondary,#5f6368);border-top:0;min-height:0}
.ab-pairs>.f{background:var(--bg-secondary,#f3f3f6);font-size:.82rem;color:var(--text-secondary,#5f6368)}
.ab-pairs>.f small{display:block;font-size:.72rem;opacity:.85}
.ab-lines{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid var(--border-color,#d9dbe0);border-radius:6px;overflow:hidden;font-size:.92rem}
.ab-locked{color:var(--text-secondary,#5f6368)}
.ab-navq{display:flex;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap}
.ab-navtop{margin:0 0 10px}
.ab-navtop .ab-hint{margin:0}
#actflBuilderBody [contenteditable=true]{outline:1px dashed rgba(79,70,229,.45);outline-offset:1px;border-radius:3px;cursor:text}
#actflBuilderBody [contenteditable=true]:focus{outline:2px solid var(--primary,#4F46E5);background:rgba(79,70,229,.06)}
#actflBuilderBody .ab-changed{background:rgba(245,158,11,.22)}
#actflBuilderBody .ab-missing{background:rgba(220,38,38,.12)}
#actflBuilderBody .ab-missing:empty::before{content:"Bisaya missing";color:var(--danger,#dc2626);font-style:italic;font-size:.85em}
#actflBuilderBody .ab-cq .ab-missing:empty::before{content:"…"}
.ab-pair{display:grid;grid-template-columns:repeat(2,minmax(0,395px));gap:20px;justify-content:start;align-items:start}
.ab-fig{margin:0;min-width:0}
.ab-colh{font-weight:700;font-size:.75rem;margin-bottom:6px;color:var(--text-secondary,#5f6368);text-transform:uppercase;letter-spacing:.04em}
.ab-fit{font-size:.82rem;font-weight:600;margin-top:6px;text-align:center}.ab-fit.ok{color:var(--success,#047857)}.ab-fit.bad{color:var(--danger,#dc2626)}
.ab-screen>h3{font-size:1.05rem;margin:1.6em 0 .6em;padding-top:.6em;border-top:2px solid var(--border-color,#d9dbe0)}
.ab-dev.ab-phone .ab-cq{height:auto!important;min-height:667px;position:relative}
.ab-dev.ab-phone .ab-cq::after{content:"";position:absolute;left:0;right:0;top:667px;border-top:2px dashed #dc2626;pointer-events:none}
.ab-cq .ab-fu{margin-top:8px}
@media (max-width:900px){
 .ab-split,.ab-split-phone{grid-template-columns:minmax(0,1fr)}
 .ab-split-phone aside{order:-1}
 .ab-split-phone .ab-qlist{max-height:30vh}
 .ab-pair{grid-template-columns:minmax(0,1fr);justify-items:center}
 .ab-fig{width:100%;max-width:395px}
 .ab-pairs{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .ab-pairs>.f{grid-column:1/-1}
 .ab-pairs>.h:first-child{display:none}
}
@media (max-width:560px){
 .ab-pairs,.ab-lines{grid-template-columns:minmax(0,1fr)}
 .ab-pairs>.h,.ab-lines>.h{display:none}
 .ab-pairs .ab-bis::before,.ab-lines .ab-bis::before{content:"Bisaya: ";font-size:.72rem;color:var(--text-secondary,#5f6368);font-weight:600}
}

/* ---- the helper's phone screens ---- */
.ab-dev{background:#fff;color:#111827;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.ab-dev.ab-desk{border-radius:10px;border:1px solid var(--line);border-top:22px solid #d9dbe1;min-height:420px}
.ab-dev.ab-phone{border-radius:30px;border:10px solid #202124;width:100%;max-width:395px}
.ab-dev.ab-phone .ab-cq{height:667px;overflow:hidden}
.ab-cq{container-type:inline-size;font-size:14px;line-height:1.4}
.ab-cq .appbar{display:flex;align-items:center;gap:10px;background:#4F46E5;color:#fff;padding:9px 14px;font-size:13px}
.ab-cq .logo{font-weight:800}
.ab-cq .abt{font-weight:600;opacity:.9}
.ab-cq .lang{background:rgba(255,255,255,.18);border-radius:6px;padding:1px 8px}
.ab-cq .grow{flex:1}
.ab-cq .scr{padding:12px 16px 16px;max-width:640px;margin:0 auto;position:relative}
.ab-cq .scr h1{text-align:center;font-size:18px;margin:4px 0 10px}
.ab-cq .btn{display:inline-block;border-radius:10px;padding:10px 16px;font-weight:600;font-size:14px;text-align:center;white-space:nowrap}
.ab-cq .btn.sm{padding:6px 12px;font-size:13px}
.ab-cq .btn.pri{background:#4F46E5;color:#fff}
.ab-cq .btn.sec{background:#F3F4F6;color:#111827;border:1px solid #E5E7EB}
.ab-cq .btn.wide{flex:1}
.ab-cq .train{background:#FFFBEB;border:1px solid #FCD34D;border-radius:10px;padding:8px 10px;font-size:13px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ab-cq .tcard{display:flex;align-items:center;gap:10px;border:1px solid #E5E7EB;border-radius:10px;padding:9px 12px;margin:8px 0}
.ab-cq .tc2{flex:1;min-width:0}
.ab-cq .meta{color:#6B7280;font-size:12.5px}
.ab-cq .tip{text-align:center;color:#92400e;font-size:12.5px;margin:8px 0 0}
.ab-cq .qtop{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#4B5563}
.ab-cq .who{font-weight:600;color:#111827;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-cq .lvl{background:#E0E7FF;color:#312e81;border-radius:999px;padding:0 8px;font-weight:600;white-space:nowrap}
.ab-cq .qn{white-space:nowrap}
.ab-cq .tchip{background:#4F46E5;color:#fff;border-radius:999px;padding:0 8px;font-weight:700;white-space:nowrap}
.ab-cq .prog{height:5px;background:#E5E7EB;border-radius:3px;overflow:hidden;margin:6px 0 10px}
.ab-cq .prog div{height:100%;background:#4F46E5}
.ab-cq .teach{background:#EEF2FF;border-left:4px solid #4F46E5;border-radius:6px;padding:5px 10px;font-size:13px}
.ab-cq .roleplay{margin-top:6px;background:#FDF2F8;border-left:4px solid #db2777;border-radius:6px;padding:5px 10px;font-size:13px}
.ab-cq .prompt{font-size:24px;font-weight:700;text-align:center;margin:10px 0 0;line-height:1.25}
.ab-cq .prompt.sm{font-size:20px;text-align:left;margin:2px 0 0}
.ab-cq .pen{text-align:center;color:#6B7280;font-style:italic;font-size:13px}
.ab-cq .ans{margin-top:8px;background:#F9FAFB;border:1px solid #E5E7EB;border-radius:8px;padding:5px 10px;font-size:13px}
.ab-cq .al{display:grid;grid-template-columns:72px 1fr;gap:6px;padding:2px 0}
.ab-cq .al b{font-size:12px}
.ab-cq .a5{color:#047857}
.ab-cq .a4{color:#15803d}
.ab-cq .a3{color:#a16207}
.ab-cq .sl{margin-top:12px}
.ab-cq .slhead{display:flex;align-items:center;gap:8px}
.ab-cq .slv{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font-size:20px;font-weight:800;color:#fff;flex:none}
.ab-cq .slt{font-weight:600;font-size:13.5px;flex:1}
.ab-cq .howto{font-size:12px;color:#4F46E5;white-space:nowrap}
.ab-cq .s5{background:#047857}
.ab-cq .s4{background:#22c55e}
.ab-cq .s3{background:#eab308;color:#1d1300}
.ab-cq .s2{background:#f97316}
.ab-cq .s1{background:#dc2626}
.ab-cq .rng{-webkit-appearance:none;appearance:none;width:100%;height:14px;border-radius:7px;margin:12px 0 2px;background:linear-gradient(90deg,#dc2626 0 20%,#f97316 20% 40%,#eab308 40% 60%,#22c55e 60% 80%,#047857 80% 100%);outline:none}
.ab-cq .rng::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:#fff;border:3px solid #111827;box-shadow:0 1px 4px rgba(0,0,0,.3);cursor:pointer}
.ab-cq .rng::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid #111827;cursor:pointer}
.ab-cq .ticks{display:flex;justify-content:space-between;padding:0 9px;font-size:11px;color:#6B7280}
.ab-cq .tags{display:flex;gap:5px;margin-top:8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.ab-cq .tag{border:1px solid #D1D5DB;border-radius:999px;padding:3px 8px;font-size:11.5px;white-space:nowrap;flex:none}
.ab-cq .tag.on{background:#4F46E5;color:#fff;border-color:#4F46E5}
.ab-cq .tag.note{border-style:dashed}
.ab-cq .nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.ab-cq .nav .btn{flex:1}
.ab-cq .skip{color:#6B7280;font-size:13px;text-decoration:underline;flex:none}
.ab-cq .steps{display:flex;justify-content:center;gap:6px;margin:2px 0 6px}
.ab-cq .steps span{width:28px;height:5px;border-radius:3px;background:#E5E7EB}
.ab-cq .steps .on{background:#4F46E5}
.ab-cq .exq{display:flex;gap:10px;align-items:center;background:#EEF2FF;border-radius:10px;padding:8px 10px;font-size:13px}
.ab-cq .pt{font-size:26px}
.ab-cq .bandbar{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;margin:10px 0 6px}
.ab-cq .bs{color:#fff;text-align:center;font-size:11px;font-weight:700;border-radius:4px;padding:2px 0}
.ab-cq .bs.s3{color:#1d1300}
.ab-cq .exs{display:flex;flex-direction:column;gap:6px}
.ab-cq .exr{display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;border:1px solid #E5E7EB;border-radius:10px;padding:6px 8px}
.ab-cq .pill{grid-row:1/3;color:#fff;font-weight:800;font-size:13px;border-radius:8px;height:36px;display:grid;place-items:center}
.ab-cq .pill.s3{color:#1d1300}
.ab-cq .bub{background:#F3F4F6;border-radius:12px 12px 12px 3px;padding:2px 10px;font-style:italic;justify-self:start;font-size:13.5px}
.ab-cq .why{font-size:12px;color:#4B5563;padding-left:4px}
.ab-cq .rules{display:flex;flex-direction:column;gap:10px}
.ab-cq .rule{display:flex;gap:12px;align-items:center;border:1px solid #E5E7EB;border-radius:12px;padding:12px;font-size:14px}
.ab-cq .ri{font-size:30px;width:44px;text-align:center;flex:none}
.ab-cq .heard{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:10px 0 0;font-size:13px}
.ab-cq .fb{margin-top:10px;background:#ECFDF5;color:#065f46;border-radius:8px;padding:7px 10px;font-size:13px}
.ab-cq .sel{border:1px solid #D1D5DB;border-radius:10px;padding:10px 12px;margin:4px 0 10px}
.ab-cq .tinfo{background:#F9FAFB;border:1px solid #E5E7EB;border-radius:10px;padding:8px 12px;font-size:13.5px}
.ab-cq .checklist{background:#FFFBEB;border-radius:10px;padding:8px 12px;margin:10px 0;font-size:13px}
.ab-cq .dim{background:rgba(17,24,39,.45);margin:-12px -16px -16px;padding:60px 16px;min-height:420px;display:grid;place-items:start center}
.ab-dev.ab-phone .dim{min-height:620px}
.ab-cq .dlg{background:#fff;border-radius:14px;padding:14px 16px;max-width:380px}
.ab-cq .dlg h3{margin:4px 0}
.ab-cq .dlg p{margin:6px 0;font-size:13.5px}
.ab-cq .muted{color:#6B7280}
.ab-cq .c{text-align:center}
.ab-cq .sm2{font-size:12.5px}
.ab-cq .opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.ab-cq .opt{border:1px solid #D1D5DB;border-radius:10px;padding:12px 8px;text-align:center;font-size:14px}
.ab-cq .opt.on{background:#4F46E5;color:#fff;border-color:#4F46E5}
.ab-cq .rtop{display:flex;gap:14px;align-items:center;justify-content:center;margin:6px 0 10px}
.ab-cq .gauge{width:84px;height:84px;border-radius:50%;border:8px solid #22c55e;display:grid;place-items:center;flex:none}
.ab-cq .gauge span{font-size:20px;font-weight:800}
.ab-cq .badge{display:inline-block;background:#d1fae5;color:#064e3b;font-weight:700;border-radius:8px;padding:4px 10px;font-size:14px;margin-bottom:3px}
.ab-cq table.lt{width:100%;border-collapse:collapse;font-size:13px;margin:4px 0 6px}
.ab-cq .lt td{padding:5px 6px;border-bottom:1px solid #E5E7EB}
.ab-cq .g{color:#047857;font-weight:600}
.ab-cq .r{color:#dc2626;font-weight:600}
.ab-cq .m{color:#9CA3AF}
.ab-cq .tabs{display:flex;gap:6px;margin-bottom:10px}
.ab-cq .tabs span{padding:5px 12px;border-radius:8px;background:#F3F4F6;font-size:13px}
.ab-cq .tabs .on{background:#4F46E5;color:#fff}
.ab-cq .rrow{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid #E5E7EB;border-radius:10px;padding:9px 10px;margin:8px 0;font-size:13px}
@container (max-width:480px){.ab-cq .nav .btn{padding:10px 8px}
.ab-cq .rrow{flex-direction:column;align-items:stretch}}
.ab-cq .sbs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:6px}
.ab-cq .sbt{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:56px;border:2px solid transparent;border-radius:10px;padding:4px 2px;font:inherit;cursor:pointer;color:#fff}
.ab-cq .sbt b{font-size:22px;line-height:1}
.ab-cq .sbt span{font-size:10.5px;font-weight:600}
.ab-cq .sbt.s3{color:#1d1300}
.ab-cq .sbt:not(.on){opacity:.5}
.ab-cq .sbt.on{border-color:#111827;box-shadow:0 0 0 2px #fff inset;opacity:1}
.ab-cq .sbm{text-align:center;font-size:13px;font-weight:600;margin-top:5px}
.ab-cq .slt{font-weight:700}
.ab-cq .lopts{display:flex;flex-direction:column;gap:5px;margin:8px 0}
.ab-cq .lopt{display:flex;gap:9px;align-items:flex-start;border:1px solid #D1D5DB;border-radius:10px;padding:6px 10px;font-size:13px}
.ab-cq .lopt.on{border:2px solid #4F46E5;background:#EEF2FF}
.ab-cq .rad{width:16px;height:16px;border-radius:50%;border:2px solid #9CA3AF;flex:none;margin-top:2px}
.ab-cq .lopt.on .rad{border:5px solid #4F46E5}
.ab-cq .ld{color:#374151;font-size:12.5px;line-height:1.3}
.ab-cq .lex{font-style:italic;font-size:12px;color:#4F46E5;line-height:1.3}
.ab-cq .lex .gloss{font-style:normal;color:#6B7280}
@container (max-width:480px){.ab-cq .lex .gloss{display:none}
.ab-cq .lopt{padding:5px 9px}
.ab-cq .scr h1{margin:2px 0 4px}}
.ab-cq .notes{border:1px solid #D1D5DB;border-radius:10px;padding:8px 10px;color:#9CA3AF;font-size:13px;min-height:52px}
.ab-cq .lopts.sm .lopt{padding:4px 9px}
.ab-cq .lopts.sm{gap:3px;margin:4px 0}
.ab-cq .lopts.sm .lopt{padding:3px 9px;line-height:1.25}
.ab-cq .lopts.sm .ld{font-size:12px}
.ab-cq .lopts.sm .lex{font-size:11.5px}
@container (max-width:480px){.ab-cq .lopts.sm .ld{font-size:11.5px}}