.tg-page { --tg-teal:#216d72; --tg-coral:#ad4d35; }
.tg-page .fg-heading { border-bottom:3px solid var(--tg-teal); padding-bottom:14px; }
.tg-page .km-number-entry { width:min(100%,25rem); min-width:0; }
.tg-page .km-number-entry input { width:100%; min-width:0; max-width:100%; box-sizing:border-box; }
.tg-page .km-question,.tg-page .km-field-answers { min-width:0; }
.tg-page .km-big-word { font-size:30px; overflow-wrap:anywhere; }
.tg-place { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); width:100%; max-width:540px; gap:5px; margin:auto; }
.tg-place > div { min-width:0; display:grid; text-align:center; gap:8px; background:#eef5f2; padding:12px 3px; border-bottom:3px solid #93b8b2; }
.tg-place small { font-size:12px; overflow-wrap:anywhere; min-height:32px; }
.tg-place strong { font-size:28px; }
.tg-place span { font-size:12px; overflow-wrap:anywhere; }
.tg-place .tg-highlight { background:#fbe4d9; border-color:var(--tg-coral); outline:2px solid var(--tg-coral); }
.tg-array { display:grid; grid-template-columns:repeat(var(--columns),minmax(0,1fr)); gap:2px; width:min(100%,360px); margin:16px auto; }
.tg-array > span { aspect-ratio:1; min-width:0; display:grid; place-items:center; background:#e7f2ee; border:1px solid #82aaa4; }
.tg-array img { width:80%; height:80%; object-fit:contain; }
.tg-empty-model { text-align:center; font-size:24px; }
.tg-sequence { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; list-style:none; padding:0; width:100%; }
.tg-sequence li { background:#e5f0ed; padding:12px 3px; text-align:center; font-weight:700; font-size:23px; }
.tg-fractions,.tg-fraction-pair { width:100%; display:grid; gap:18px; }
.tg-fraction-pair h3 { font-size:17px; margin:0 0 10px; }
.tg-fraction-bar { display:grid; grid-template-columns:repeat(var(--parts),minmax(0,1fr)); width:100%; height:64px; border:2px solid #335b60; }
.tg-fraction-bar span { border-right:1px solid #335b60; background:#fff; }
.tg-fraction-bar span:last-child { border-right:0; }
.tg-fraction-bar .tg-shaded { background:repeating-linear-gradient(135deg,#b4d9ca 0 8px,#69a88f 8px 10px); }
.tg-diagram { display:block; width:100%; max-width:400px; height:auto; aspect-ratio:360/260; margin:auto; overflow:visible; }
.tg-diagram path { fill:none; stroke:#285f68; stroke-width:3; }
.tg-diagram rect,.tg-diagram polygon,.tg-diagram circle { stroke:#285f68; stroke-width:2; }
.tg-diagram text { font:16px Georgia,serif; text-anchor:middle; fill:#263e44; }
.tg-diagram .tg-scale-label { font-size:14px; }
.tg-diagram .tg-surface { fill:#c4e1d3; }
.tg-diagram .tg-extra-surface { fill:#f4c7ae; }
.tg-diagram .tg-opening { fill:#fff; }
.tg-diagram .tg-liquid,.tg-diagram .tg-mark { fill:#b94f36; }
.tg-diagram .tg-turn { stroke:#b94f36; }
.tg-clock { --clock-radius:112px; width:260px; height:260px; position:relative; flex-shrink:0; margin:12px auto; border:4px solid #35696e; border-radius:50%; background:radial-gradient(circle,#fff 62%,#e9f3ee 100%); }
.tg-clock-tick { position:absolute; top:50%; left:calc(50% - 1px); width:2px; height:5px; background:#66838b; transform-origin:50% 0; transform:rotate(var(--turn)) translateY(calc(-1 * var(--clock-radius))); }
.tg-clock-tick.tg-major { height:9px; background:#294b51; }
.tg-clock-number { position:absolute; transform:translate(-50%,-50%); font-weight:700; font-size:18px; }
.tg-hand { position:absolute; bottom:50%; transform-origin:50% 100%; border-radius:3px; }
.tg-hour { height:59px; width:6px; left:calc(50% - 3px); background:#24464e; }
.tg-minute { height:91px; width:4px; left:calc(50% - 2px); background:var(--tg-coral); }
.tg-clock-pin { position:absolute; top:calc(50% - 5px); left:calc(50% - 5px); width:10px; height:10px; background:#24464e; border-radius:50%; }
.tg-table { border-collapse:collapse; width:100%; max-width:400px; }
.tg-table caption { padding:12px; font-weight:700; }
.tg-table th,.tg-table td { border:1px solid #8eaaa9; padding:12px; text-align:left; }
.tg-table thead { background:#e7f1ee; }
.tg-data { width:100%; }
.tg-data-row { display:grid; grid-template-columns:75px minmax(0,1fr); gap:10px; align-items:center; margin:16px 0; }
.tg-data-track { position:relative; height:32px; border:1px solid #93b1ab; }
.tg-data-track::after { content:''; position:absolute; inset:0; background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),#527d76 calc(10% - 1px) 10%); }
.tg-data-track span { display:block; height:100%; background:#7bb9a4; }
.tg-data-axis { margin-left:85px; display:flex; justify-content:space-between; font-size:12px; }
.tg-plot { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; text-align:center; }
.tg-plot-stack { height:200px; display:flex; flex-direction:column-reverse; align-items:center; border-bottom:2px solid #557982; }
.tg-plot-stack span { line-height:24px; font-size:26px; font-weight:700; color:#256c70; }
.tg-modes { display:flex; margin:18px 0; width:fit-content; border:1px solid #86a6a5; border-radius:6px; overflow:hidden; }
.tg-modes button { display:flex; align-items:center; gap:8px; padding:12px 18px; background:#fff; border:0; }
.tg-modes button[aria-pressed="true"] { background:#216d72; color:#fff; }
.tg-work-controls { display:flex; flex-wrap:wrap; gap:20px; align-items:center; margin:24px 0; }
.tg-work-controls label { display:grid; gap:8px; }
.tg-work-controls select { min-height:44px; padding:8px 16px; border:1px solid #86a6a5; border-radius:5px; background:#fff; }
.tg-stepper { display:flex; align-items:center; gap:12px; }
.tg-stepper span { min-width:76px; text-align:center; }
.tg-stepper strong { display:block; font-size:26px; }
.tg-stepper button { width:44px; height:44px; display:grid; place-items:center; background:#fff; border:1px solid #86a6a5; border-radius:6px; }
.tg-stepper button:disabled { opacity:.4; }
.tg-work-result { font-size:26px; text-align:center; }
.tg-inverse { text-align:center; font-size:20px; }
.tg-workshop .tg-fractions { max-width:600px; margin:auto; }
@media(max-width:760px){.tg-clock{--clock-radius:100px;width:236px;height:236px}.tg-hour{height:53px}.tg-minute{height:82px}.tg-page .km-big-word{font-size:25px}.tg-work-controls{justify-content:center}.tg-place small{font-size:11px}.tg-diagram text{font-size:16px}}