.tool-page { max-width: 76rem; margin: 0 auto; }
.tool-back { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; margin-bottom: .7rem; }
.tool-back svg { width: 1rem; transform: rotate(180deg); }
.tool-heading-icon { display: grid; place-items: center; flex-shrink: 0; width: 4.5rem; height: 4.5rem; border-radius: 1.5rem; color: #176a59; background: #e8f2ee; }
.tool-heading-icon svg { width: 2rem; height: 2rem; }
.tool-local-note { display: flex; align-items: flex-start; gap: .55rem; margin: 0 0 1.75rem; font-size: .83rem; color: #52635d; line-height: 1.7; }
.tool-local-note svg { width: 1.1rem; height: 1.1rem; flex-shrink: 0; margin-top: .18rem; }
.tool-error { margin: 1rem 0; color: #963b2e; border: 1px solid #d79c94; background: #fff4f1; }
.tool-workspace { display: grid; grid-template-columns: minmax(18rem, .86fr) minmax(22rem, 1.14fr); gap: 1.5rem; align-items: start; }
.tool-page .panel { background: #fff; padding: 1.75rem; border-radius: 1.25rem; border: 1px solid #e3e6e3; box-shadow: 0 .2rem 1rem #172e2003; }
.tool-input h2, .tool-output h2 { font-size: 1.2rem; margin: 0 0 1rem; letter-spacing: -.015em; }
.tool-input .local-controls { border: 0; padding: 0; margin: 0; min-width: 0; }
.tool-input label, .timer-settings label { display: block; font-size: .88rem; font-weight: 550; margin: 1rem 0 .45rem; color: #353b39; }
.tool-input input, .tool-input select, .tool-input textarea, .timer-settings input, .timeline-task input, .timeline-task textarea, .document-draft {
  display: block; width: 100%; min-height: 2.9rem; padding: .75rem .85rem; border: 1px solid #cbd1ce; border-radius: .65rem; background: #fff; color: #222925; font: inherit; font-size: .92rem; line-height: 1.55; transition: border-color 150ms ease, box-shadow 150ms ease;
}
.tool-input textarea, .timeline-task textarea, .document-draft { resize: vertical; }
.tool-input input:focus, .tool-input select:focus, .tool-input textarea:focus, .timer-settings input:focus, .timeline-task input:focus, .timeline-task textarea:focus, .document-draft:focus { outline: 3px solid #258b7440; outline-offset: 2px; border-color: #287861; }
.tool-input .field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.tool-input .primary { margin-top: 1.15rem; }
.tool-page .button { min-height: 2.75rem; touch-action: manipulation; transition: background-color 130ms ease, transform 130ms ease, box-shadow 130ms ease; }
.tool-page button:active:not(:disabled), .teacher-tool-link:active { transform: scale(.975); }
.tool-page button:disabled { opacity: .48; cursor: not-allowed; }
.tool-page .actions { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin-top: 1.35rem; }
.tool-page [hidden], [hidden].prompt-item { display: none !important; }
.tool-page .required { color: #737d77; font-size: .73rem; font-weight: 400; margin-left: .3rem; }
.tool-page .small-text { font-size: .8rem; line-height: 1.75; }
.tool-page .tool-output { min-height: 15rem; }
.tool-page .tool-output .section-heading { align-items: center; margin-bottom: 1rem; gap: 1rem; }
.tool-page .tool-output .section-heading h2 { margin: 0; }
.tool-page .table-scroll { overflow: auto; margin-top: 1.25rem; }
.tool-table { border-collapse: collapse; width: 100%; font-size: .83rem; line-height: 1.65; }
.tool-table th, .tool-table td { padding: .85rem .7rem; text-align: left; border-bottom: 1px solid #e7eae8; vertical-align: top; }
.tool-table thead th { font-weight: 550; color: #59675f; background: #f4f7f5; }
.tool-table tbody th { font-weight: 550; }
.tool-table td { overflow-wrap: anywhere; }
.timeline-task { display: grid; grid-template-columns: 1.5rem 8.7rem 1fr; gap: .6rem; align-items: start; padding: .85rem 0; border-bottom: 1px solid #e7ebe8; }
.timeline-number { font-size: .75rem; color: #6e7a73; padding-top: .9rem; font-variant-numeric: tabular-nums; }
.timeline-task input { padding: .7rem .45rem; font-size: .79rem; }
.timeline-task textarea { font-size: .85rem; padding: .7rem; min-height: 4.1rem; }
.timeline-task label { margin: 0; min-width: 0; }
.budget-main-total { padding: 1.65rem 0; border-bottom: 1px solid #e7ebe8; }
.budget-main-total span { display: block; font-size: .9rem; color: #57695d; }
.budget-main-total strong { font-size: clamp(1.8rem, 3vw, 2.5rem); color: #176a59; display: block; margin-top: .35rem; font-weight: 600; letter-spacing: -.04em; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.budget-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 1.4rem 0; }
.budget-summary span { display: block; font-size: .78rem; color: #6a746d; }
.budget-summary strong { display: block; font-size: 1rem; margin-top: .45rem; font-weight: 600; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.document-draft { font-size: .9rem; line-height: 1.9; border-color: #dce1dd; padding: 1.3rem; min-height: 30rem; background: #fdfefc; }
.notice-output { position: sticky; top: 6rem; }
.notice-mode-switch { display: inline-flex; gap: .2rem; padding: .3rem; margin: 0 0 1.1rem; background: #f4f4f5; border: 1px solid #e8e9ea; border-radius: 1rem; }
.notice-mode-button { border: 0; border-radius: .75rem; padding: .65rem 1rem; background: transparent; color: #545659; font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; transition: background 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease; }
.notice-mode-button.is-active { color: #262729; background: #fff; box-shadow: 0 .12rem .45rem #38393b18; }
.notice-mode-button:active { transform: scale(.97); }
.notice-mode-button:focus-visible { outline: 3px solid #333536; outline-offset: 2px; }
.notice-ai-output { position: sticky; top: 6rem; }
.notice-ai-pages { display: grid; gap: 1rem; max-height: min(70vh, 45rem); overflow: auto; margin-top: 1rem; padding: .6rem; border: 1px solid #e3e4e5; border-radius: .75rem; background: #f9f9fa; }
.notice-ai-pages figure { margin: 0; }
.notice-ai-pages img { display: block; width: 100%; height: auto; background: #fff; box-shadow: 0 .2rem .7rem #38393b1a; }
.notice-ai-pages figcaption { padding: .4rem 0 .1rem; text-align: center; font-size: .8rem; color: #5e6063; }
.notice-ai-editor { margin-top: 1.1rem; border-top: 1px solid #e8e8e9; padding-top: .8rem; }
.notice-ai-editor summary { cursor: pointer; font-weight: 600; color: #252628; }
.notice-ai-editor label { display: block; margin-top: 1rem; font-size: .82rem; color: #5e6063; }
.notice-ai-editor textarea { display: block; width: 100%; margin-top: .35rem; padding: .65rem; border: 1px solid #d4d5d7; border-radius: .55rem; font: inherit; font-size: .88rem; resize: vertical; }
.notice-ai-editor button { margin-top: 1rem; }
.notice-template-options { display: grid; gap: .2rem; margin-top: .65rem; }
.notice-template-options label { display: flex; align-items: center; gap: .5rem; margin: .2rem 0; cursor: pointer; }
.notice-template-options input { width: auto; min-height: 0; margin: 0; accent-color: #2e2f31; }
.notice-reference-choice { display: flex; align-items: flex-start; gap: .55rem; margin: 1rem 0; font-size: .86rem; line-height: 1.5; cursor: pointer; }
.notice-reference-choice input { width: auto; min-height: 0; margin: .18rem 0 0; accent-color: #2e2f31; }
#notice-ai-fields h3 { margin: 1.5rem 0 .6rem; font-size: 1rem; }
.notice-extra-details { margin-top: 1rem; padding-top: .85rem; border-top: 1px solid #ebeced; }
.notice-extra-details summary { cursor: pointer; color: #252628; font-size: .88rem; font-weight: 600; }
.notice-extra-details[open] summary { margin-bottom: .4rem; }
.groups-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.group-result { border: 1px solid #dfe8e1; background: #f5f9f6; padding: 1rem; border-radius: .85rem; }
.group-result h3 { display: flex; align-items: center; justify-content: space-between; gap: .5rem; font-size: .93rem; margin: 0 0 .8rem; }
.group-result h3 span { font-weight: 400; white-space: nowrap; }
.group-members { display: flex; gap: .4rem; flex-wrap: wrap; margin: 0; }
.group-members span { display: grid; place-items: center; min-width: 2.1rem; min-height: 2.1rem; padding: .15rem; border-radius: .55rem; background: #fff; border: 1px solid #e3eae5; font-size: .95rem; font-variant-numeric: tabular-nums; }
.timer-shell { text-align: center; min-height: 33rem; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.timer-settings { display: flex; justify-content: center; gap: 1rem; text-align: left; width: 15rem; max-width: 100%; }
.timer-settings > div { min-width: 0; flex: 1; }
.timer-settings label { margin-top: 0; }
.timer-settings input { font-variant-numeric: tabular-nums; text-align: center; }
.timer-status { margin-top: 2rem; color: #576c5e; font-size: 1rem; }
.timer-display { font-size: clamp(4.8rem, 13vw, 9rem); font-weight: 550; line-height: 1.25; font-variant-numeric: tabular-nums; letter-spacing: -.055em; color: #173e2e; }
.timer-progress { width: min(26rem, 80%); height: .35rem; border-radius: 1rem; background: #e9efeb; overflow: hidden; margin: 1rem 0 1.25rem; }
.timer-progress > div { height: 100%; background: #39856b; transform-origin: left; }
.timer-actions { justify-content: center; }
.timer-footnote { margin-top: 1.5rem; max-width: 32rem; }
.timer-finished .timer-display { color: #9c4a14; }
.timer-finished .timer-status { color: #9c4a14; font-weight: 600; }
.timer-shell:fullscreen, .timer-expanded { background: #f9fcf9; border-radius: 0; width: 100%; height: 100%; padding: 2rem; overflow: auto; }
.timer-expanded { position: fixed; inset: 0; z-index: 200; }
.timer-shell:fullscreen .timer-display, .timer-expanded .timer-display { font-size: clamp(5rem, 20vw, 15rem); }
.rubric-editor > .section-heading { margin-bottom: .5rem; }
.rubric-editor > .section-heading h2 { margin-bottom: .4rem; }
.rubric-rows { margin-top: 1.5rem; }
.rubric-row { margin: 1.2rem 0; padding: 1rem 1.25rem 1.25rem; border: 1px solid #dce5df; border-radius: 1rem; background: #fafcfb; min-width: 0; }
.rubric-row legend { padding: 0 .35rem; font-size: .79rem; color: #597161; }
.rubric-row-heading { display: grid; grid-template-columns: 1fr 7rem auto; gap: 1rem; align-items: end; }
.rubric-row-heading label { margin: 0; }
.rubric-row-heading input, .rubric-descriptions textarea { margin-top: .45rem; }
.rubric-descriptions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.rubric-descriptions label { font-size: .8rem; }
.rubric-descriptions textarea { font-size: .85rem; min-height: 7.5rem; }
.weight-invalid { color: #934b20 !important; background: #fff2e7 !important; }
.rubric-output { margin-top: 1.5rem; scroll-margin-top: 6rem; }
.rubric-table { min-width: 48rem; table-layout: fixed; }
.rubric-table th:first-child { width: 14%; }
.rubric-table th:last-child { width: 6%; }
.rubric-comment { margin-top: 2rem; overflow-wrap: anywhere; }
.prompt-filter { display: grid; grid-template-columns: minmax(15rem, 1fr) 13rem auto; gap: 1rem; align-items: end; }
.prompt-filter label { margin-top: 0; }
.prompt-filter #prompt-count { align-self: center; margin-top: 1.5rem; }
.prompt-library { display: grid; gap: 1rem; margin-top: 1.5rem; }
.prompt-item h2 { font-size: 1.15rem; margin: .6rem 0 0; }
.prompt-item .section-heading { align-items: center; gap: 1rem; margin-bottom: .9rem; }
.prompt-item .prompt-copy { flex-shrink: 0; }
.prompt-body { white-space: pre-wrap; overflow-wrap: anywhere; padding: 1.2rem 1.35rem; margin: 1rem 0 0; border-radius: .7rem; background: #f5f7f5; color: #3e4b43; font: inherit; font-size: .89rem; line-height: 1.9; }
.prompt-required { color: #476553; }
.teacher-tools-index { max-width: 72rem; margin: 0 auto; }
.teacher-tools-index .page-heading { margin-bottom: .75rem; }
.tools-index-note { display: flex; align-items: flex-start; gap: .5rem; color: var(--muted, #67696d); font-size: .82rem; line-height: 1.7; margin-bottom: 2rem; }
.tools-index-note svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: .2rem; }
.tools-index-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 1.8rem; align-items: start; }
.tools-index-group > h2 { margin: 0 0 .75rem .1rem; font-size: 1.05rem; font-weight: 650; color: #3e4042; }
.tools-group-list { background: #fff; border-radius: 1.25rem; box-shadow: var(--shadow, 0 0 0 1px #3b3c3e08); overflow: hidden; }
.teacher-tool-link { display: flex; align-items: center; gap: .9rem; padding: 1.1rem 1.2rem; color: inherit; text-decoration: none; min-height: 5.65rem; background: #fff; position: relative; transition: background-color 130ms ease, transform 160ms ease; }
.teacher-tool-link + .teacher-tool-link:before { content: ''; position: absolute; top: 0; left: 4.85rem; right: 0; border-top: 1px solid #ededee; }
.teacher-tool-link:hover { background: #f9f9fa; }
.teacher-tool-link:focus-visible { outline: 3px solid #333536; outline-offset: -3px; border-radius: .75rem; }
.teacher-tool-link .tool-icon { width: 2.75rem; height: 2.75rem; flex-shrink: 0; display: grid; place-items: center; border-radius: .85rem; color: #fff; background: #3b3d3f; box-shadow: inset 0 1px 1px #ffffff50, 0 2px 4px #3b3c3e12; }
.teacher-tool-link .tool-icon svg { width: 1.25rem; height: 1.25rem; }
.teacher-tool-link.tool-timer .tool-icon { background: #e49440; }
.teacher-tool-link.tool-groups .tool-icon { background: #4e9d89; }
.teacher-tool-link.tool-budget .tool-icon { background: #9da0a3; }
.teacher-tool-link.tool-notice .tool-icon { background: #393a3c; }
.teacher-tool-link.tool-rubric .tool-icon { background: #b97995; }
.teacher-tool-link.tool-prompts .tool-icon { background: #9da0a3; }
.teacher-tool-link > div { flex: 1; min-width: 0; }
.teacher-tool-link h3 { font-size: .96rem; font-weight: 600; line-height: 1.5; margin: 0 0 .2rem; }
.teacher-tool-link p { color: var(--muted, #67696d); font-size: .78rem; line-height: 1.7; margin: 0; }
.tool-entry { display: grid; place-items: center; color: #a1a3a6; flex-shrink: 0; }
.tool-entry svg { width: 1rem; height: 1rem; }
.tools-group-note { font-size: .76rem; line-height: 1.7; color: var(--muted, #67696d); margin: .75rem .2rem 0; }
.tool-privacy { margin: 2rem 0 0; font-size: .76rem; }
.print-only { display: none; }
.largeText .tool-workspace, .largeText .tools-index-groups, .largeText .prompt-filter { grid-template-columns: minmax(0, 1fr); }
.largeText .notice-output { position: static; }
.largeText .rubric-descriptions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.largeText .teacher-tool-link { flex-wrap: wrap; }
.reduceMotion .tool-page button:active, .reduceMotion .teacher-tool-link:active { transform: none; }
.highContrast .tool-page .muted, .highContrast .tool-local-note, .highContrast .tool-page .small-text { color: #26392b; }
.highContrast .tool-input input, .highContrast .tool-input select, .highContrast .tool-input textarea, .highContrast .tool-page .panel { border-color: #64746a; }
@media (max-width: 64rem) {
  .tool-workspace { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; }
  .tool-page .panel { padding: 1.25rem; }
  .notice-ai-output { position: static; }
  .timeline-task { grid-template-columns: 1.3rem 1fr; }
  .timeline-task-field { grid-column: 2; }
  .rubric-descriptions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .budget-summary { grid-template-columns: 1fr; gap: .75rem; }
  .budget-summary > div { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
  .budget-summary strong { margin: 0; }
}
@media (max-width: 46rem) {
  .tool-workspace { grid-template-columns: minmax(0, 1fr); }
  .tool-heading-icon { width: 3.5rem; height: 3.5rem; border-radius: 1.1rem; }
  .notice-output { position: static; }
  .tool-page .panel { border-radius: 1rem; padding: 1.15rem; }
  .tools-index-groups { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
  .teacher-tool-link { padding: 1rem 1.1rem; }
  .prompt-filter { grid-template-columns: minmax(0, 1fr); }
  .prompt-filter #prompt-count { margin-top: 0; }
  .rubric-row-heading { grid-template-columns: 1fr 5.5rem; gap: .65rem; }
  .rubric-row-heading button { grid-column: 1 / -1; justify-self: end; }
  .rubric-row { padding: .8rem; }
  .rubric-descriptions { gap: .5rem; }
  .timer-shell { min-height: 30rem; }
  .timer-actions { max-width: 23rem; }
}
@media (max-width: 28rem) {
  .tool-input .field-grid { grid-template-columns: 1fr; }
  .rubric-descriptions { grid-template-columns: minmax(0, 1fr); }
  .group-result { padding: .75rem; }
  .tool-heading-icon { display: none; }
}
@media (prefers-reduced-motion: reduce) { .tool-page *, .teacher-tool-link { transition: none !important; scroll-behavior: auto !important; } .tool-page button:active, .teacher-tool-link:active { transform: none; } }
@media (prefers-contrast: more) { .tool-page .muted, .tool-local-note, .tool-page .small-text { color: #26392b; } .tool-input input, .tool-input select, .tool-input textarea, .tool-page .panel, .teacher-tool-link { border-color: #64746a; } }
@media print {
  .tool-back, .tool-local-note, .tool-input, .tool-error, .tool-heading-icon, .no-print, .tool-page .actions, .timer-settings, .timer-footnote, .prompt-filter, .prompt-copy { display: none !important; }
  .tool-workspace { display: block; }
  .tool-page .panel { box-shadow: none; border: 0; padding: 0; border-radius: 0; min-height: 0; }
  .tool-page .page-heading { margin: 0 0 1rem; }
  .tool-page .page-heading h1 { font-size: 1.4rem; }
  .tool-page .page-heading .eyebrow, .tool-page .page-heading p:not(.eyebrow) { display: none; }
  .print-only { display: block; }
  .printable-document { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 10pt; line-height: 1.8; }
  .notice-output { position: static; }
  .timeline-task { grid-template-columns: 1.5rem 6.2rem 1fr; break-inside: avoid; }
  .timeline-task label { display: none; }
  .timeline-number { padding: 0; }
  .tool-page .table-scroll { overflow: visible; }
  .tool-table { font-size: 9pt; }
  .tool-table tr, .group-result { break-inside: avoid; }
  .tool-table thead { display: table-header-group; }
  .rubric-table { min-width: 0; font-size: 8pt; }
  .rubric-table th, .rubric-table td { padding: .55rem .35rem; }
  .rubric-output > p { font-size: 9pt; }
  .groups-results { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .prompt-item { break-inside: avoid; margin-bottom: 1.5rem; }
  .prompt-body { background: none; padding: .5rem 0; }
}
.trial-lead{margin-top:1.4rem;display:grid;gap:.8rem;border:2px solid #141414}
.trial-lead-form{display:grid;gap:.6rem}
.trial-lead-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 1rem}
@media (max-width:640px){.trial-lead-grid{grid-template-columns:1fr}}
.trial-lead-form input:not([type=checkbox]),.trial-lead-form textarea{width:100%}
.trial-lead-consent input{flex:none;width:auto;margin-top:.2rem}
.trial-lead-consent{display:flex;gap:.5rem;align-items:flex-start;font-size:.82rem;font-weight:400}

/* ---------- tools index (cards) ---------- */
.ti{--t1:#ff6b6b;--t2:#ffb547;--t3:#f5c400;--t4:#33c47a;--t5:#36a8f0;--t6:#7d6bff;--t7:#ff5fbf;--t8:#1fbfb1}
:root[data-theme=dark] .ti.ti{--t1:#ff7b7b;--t2:#ffbe5c;--t3:#ffd84d;--t4:#5cd896;--t5:#5cc2ff;--t6:#998cff;--t7:#ff86cf;--t8:#41dccd}
.ti-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,22rem);gap:1.5rem;align-items:end;margin-bottom:.4rem}
.ti-platform{position:relative;display:grid;gap:.35rem;padding:1.2rem 1.3rem;border-radius:1.4rem;background:var(--ink);color:var(--bg);overflow:hidden;isolation:isolate;transition:transform .3s cubic-bezier(.2,.9,.25,1.2)}
.ti-platform:hover{transform:translateY(-3px) rotate(-.4deg);color:var(--bg)}
.ti-platform small{font-weight:800;letter-spacing:.12em;opacity:.65;font-size:.72rem}
.ti-platform b{font-size:1.2rem}
.ti-platform span{font-size:.86rem;opacity:.8;line-height:1.5}
.ti-platform em{font-style:normal;font-weight:700;display:inline-flex;align-items:center;gap:.3rem;margin-top:.3rem}
.ti-platform em .icon{width:1rem;height:1rem;transition:transform .25s}
.ti-platform:hover em .icon{transform:translateX(4px)}
.ti-platform-dots{position:absolute;right:1.2rem;bottom:1.15rem;display:flex;gap:.28rem;z-index:-1}
.ti-platform-dots i{width:.6rem;height:.6rem;border-radius:50%;background:var(--bg);opacity:calc(.2 + var(--i) * .13);animation:ti-dot 2.4s ease-in-out infinite;animation-delay:calc(var(--i) * .12s)}
@keyframes ti-dot{0%,100%{transform:translateY(0)}50%{transform:translateY(-.35rem)}}
.ti-section{margin-top:2.2rem}
.ti-section-head{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;margin-bottom:.9rem}
.ti-section-head h2{font-size:1.35rem;letter-spacing:-.02em}
.ti-section-head span{color:var(--muted);font-size:.88rem}
.ti-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15.5rem),1fr));gap:1rem}
.ti-card{--c:var(--t5);position:relative;display:grid;align-content:start;gap:.45rem;padding:1.25rem 1.25rem 1.1rem;border-radius:1.4rem;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;isolation:isolate;animation:ti-in .55s cubic-bezier(.2,.9,.25,1.1) both;animation-delay:calc(var(--i) * 60ms);transition:transform .3s cubic-bezier(.2,.9,.25,1.2),box-shadow .3s}
.ti-card::before{content:"";position:absolute;width:11rem;height:11rem;right:-4rem;top:-4.5rem;border-radius:50%;background:var(--c);opacity:.12;z-index:-1;transition:transform .5s cubic-bezier(.2,.9,.25,1.1),opacity .3s}
.ti-card:hover{transform:translateY(-4px);color:inherit;box-shadow:0 18px 40px color-mix(in srgb,var(--c) 22%,transparent),0 0 0 1px color-mix(in srgb,var(--c) 30%,transparent)}
.ti-card:hover::before{transform:scale(1.35);opacity:.2}
.ti-card:active{transform:scale(.97)}
.ti-icon{display:grid;place-items:center;width:3.1rem;height:3.1rem;border-radius:1rem;background:var(--c);color:#1b1b1d;margin-bottom:.35rem;transition:transform .45s cubic-bezier(.2,.9,.25,1.4)}
.ti-icon .icon{width:1.5rem;height:1.5rem;stroke-width:2}
.ti-card:hover .ti-icon{transform:rotate(-10deg) scale(1.1)}
.ti-card h3{font-size:1.08rem;letter-spacing:-.01em}
.ti-card p{color:var(--muted);font-size:.88rem;line-height:1.55}
.ti-go{display:inline-flex;align-items:center;gap:.3rem;margin-top:.4rem;font-weight:700;font-size:.85rem;color:var(--ink)}
.ti-go .icon{width:.95rem;height:.95rem;transition:transform .25s}
.ti-card:hover .ti-go .icon{transform:translateX(4px)}
@keyframes ti-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.ti-card.tool-name-wheel{--c:var(--t1)}.ti-card.tool-quiz-roulette{--c:var(--t2)}.ti-card.tool-scoreboard{--c:var(--t3)}.ti-card.tool-noise-meter{--c:var(--t4)}
.ti-card.tool-groups{--c:var(--t5)}.ti-card.tool-timer{--c:var(--t6)}.ti-card.tool-comic{--c:var(--t7)}.ti-card.tool-notice{--c:var(--t8)}
.ti-card.tool-rubric{--c:var(--t2)}.ti-card.tool-prompts{--c:var(--t6)}
.ti-card .ti-icon{background:var(--c)!important;color:#1b1b1d!important;--theme:keep}
@media (max-width:760px){.ti-hero{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.ti-card,.ti-platform-dots i{animation:none}}

/* ---------- groups: colourful animated reveal ---------- */
.groups-stage{--c:var(--g1);--g1:#ff6b6b;--g2:#ffb547;--g3:#f5c400;--g4:#33c47a;--g5:#36a8f0;--g6:#7d6bff;--g7:#ff5fbf;--g8:#1fbfb1}
.group-result{position:relative;overflow:hidden;background:color-mix(in srgb,var(--c) 10%,var(--surface,#fff))!important;border:0!important;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--c) 45%,transparent);animation:grp-in .5s cubic-bezier(.2,.9,.25,1.2) both;animation-delay:calc(var(--i) * 70ms)}
.group-result h3{justify-content:flex-start!important}
.group-result h3 span{margin-left:auto}
.group-emoji{font-size:1.3rem;line-height:1;margin-right:.1rem}
.group-members span{background:var(--surface,#fff)!important;border:0!important;box-shadow:0 1px 3px #0000001a,inset 0 -2px 0 color-mix(in srgb,var(--c) 50%,transparent);font-weight:750;animation:grp-chip .45s cubic-bezier(.2,.9,.25,1.4) both;animation-delay:var(--d)}
@keyframes grp-in{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
@keyframes grp-chip{from{opacity:0;transform:translateY(-40px) scale(.4) rotate(-20deg)}to{opacity:1;transform:none}}
.groups-stage:fullscreen{padding:2.5rem;overflow:auto;background:var(--bg)}
.groups-stage:fullscreen .groups-results{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
.groups-stage:fullscreen .group-members span{min-width:3.2rem;min-height:3.2rem;font-size:1.4rem}
.groups-stage:fullscreen .group-result h3{font-size:1.4rem}
@media (prefers-reduced-motion:reduce){.group-result,.group-members span{animation:none}}

/* ---------- timer: presets, ring face, last-ten-seconds heartbeat ---------- */
.timer-shell{--p:1;position:relative;overflow:hidden;isolation:isolate}
.timer-quick{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;margin-bottom:1.2rem}
.timer-quick button{border:0;border-radius:999px;padding:.45rem .9rem;font:inherit;font-weight:650;font-size:.88rem;background:var(--bg);color:var(--ink);cursor:pointer;transition:transform .18s cubic-bezier(.2,.9,.25,1.3),background-color .2s,color .2s}
.timer-quick button:hover{transform:translateY(-2px)}
.timer-quick button.is-on{background:var(--ink);color:var(--surface)}
.timer-face{position:relative;display:grid;place-items:center;margin-top:1rem}
.timer-ring{display:none;width:min(24rem,72vw);height:auto;transform:rotate(-90deg)}
.timer-ring circle{fill:none;stroke-width:3.2}
.timer-ring-track{stroke:var(--line)}
.timer-ring-bar{stroke:#7d6bff;stroke-linecap:round;stroke-dasharray:289.03;stroke-dashoffset:calc(289.03 * (1 - var(--p)));transition:stroke-dashoffset .12s linear,stroke .4s}
.timer-shell[data-face=ring] .timer-ring{display:block}
.timer-shell[data-face=ring] .timer-display{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(3.4rem,9vw,5.6rem)}
.timer-shell[data-face=ring] .timer-progress{display:none}
.timer-shell:fullscreen[data-face=ring] .timer-ring,.timer-expanded[data-face=ring] .timer-ring{width:min(70vh,80vw)}
.timer-shell:fullscreen[data-face=ring] .timer-display,.timer-expanded[data-face=ring] .timer-display{font-size:clamp(5rem,14vh,11rem)}
.timer-final .timer-ring-bar{stroke:#ff5d5d}
.timer-final .timer-display{color:#e5484d}
.timer-beat{animation:timer-beat .5s cubic-bezier(.2,.9,.25,1.4)}
@keyframes timer-beat{0%{transform:scale(1)}30%{transform:scale(1.14)}100%{transform:scale(1)}}
.timer-flash::after{content:"";position:absolute;inset:0;background:#ff5d5d;z-index:-1;animation:timer-flash 1.6s ease-out both}
@keyframes timer-flash{0%,30%,60%{opacity:.35}15%,45%{opacity:0}100%{opacity:0}}
.timer-finished .timer-ring-bar{stroke:#ff5d5d}
@media (prefers-reduced-motion:reduce){.timer-beat,.timer-flash::after{animation:none}}

/* ---------- rubric try-scoring, prompt copy feedback ---------- */
.rubric-try{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.6rem 1rem;padding:1rem 1.1rem;margin:.8rem 0 1rem;border-radius:1.1rem;background:var(--bg)}
.rubric-try b{display:block;font-size:1rem}
.rubric-try span{font-size:.85rem;color:var(--muted)}
.rubric-try-score{text-align:right}
.rubric-try-score strong{font-size:2.4rem;font-weight:850;letter-spacing:-.03em;font-variant-numeric:tabular-nums;display:inline-block}
.rubric-try-score small{color:var(--muted);font-weight:700;margin-left:.2rem}
.rubric-try-bar{grid-column:1/-1;height:.55rem;border-radius:999px;background:var(--line);overflow:hidden}
.rubric-try-bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#ffb547,#33c47a);transition:width .5s cubic-bezier(.2,.9,.25,1.1)}
.rubric-try .button{grid-column:1/-1;justify-self:start}
.rubric-pick{cursor:pointer;transition:background-color .2s,box-shadow .2s,transform .2s}
.rubric-pick:hover{background:color-mix(in srgb,#33c47a 10%,transparent)}
.rubric-pick.is-picked{background:color-mix(in srgb,#33c47a 22%,transparent);box-shadow:inset 0 0 0 2px #33c47a;font-weight:650}
.rubric-points{font-weight:800;font-variant-numeric:tabular-nums;text-align:center}
.prompt-copy.is-copied{background:#33c47a!important;color:#fff!important;animation:cr-bump .45s cubic-bezier(.2,.9,.25,1.3)}
@keyframes cr-bump{0%{transform:scale(1)}35%{transform:scale(1.15)}100%{transform:scale(1)}}
.is-bump{animation:cr-bump .45s cubic-bezier(.2,.9,.25,1.3)}
@media print{.rubric-pick.is-picked{box-shadow:none;background:none}}