.tv-ora-app{--paper:#FBEEF4;      
  --card:#FFFFFF;
  --ink:#33335C;        
  --perc:#2E6FE0;       
  --perc-soft:#E3ECFC;
  --ora:#E2453C;        
  --ora-soft:#FBE3E1;
  --rim:#FFC93C;        
  --ok:#2F9E5B;
  --ok-soft:#E0F4E8;
  --warn:#C8541A;
  --warn-soft:#FDEBDD;
  --brand:#A3195B;      
  --shadow:0 6px 0 rgba(51,51,92,.12);
  --radius:22px;}
.tv-ora-app, .tv-ora-app *{box-sizing:border-box}
.tv-ora-app, .tv-ora-app{margin:0;padding:0}
.tv-ora-app{font-family:"Source Sans 3","Source Sans Variable",system-ui,sans-serif;
  background:var(--paper);
  background-image:radial-gradient(#f3d4e2 1.6px, transparent 1.6px);
  background-size:34px 34px;
  color:var(--ink);
  min-height:100vh;
  display:flex;flex-direction:column;align-items:center;
  padding:14px;}
.tv-ora-app .app{width:100%;max-width:980px}
.tv-ora-app header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.tv-ora-app h1{font-size:clamp(1.3rem,4vw,1.9rem);font-weight:800;margin:0;letter-spacing:.3px}
.tv-ora-app h1 .tick{color:var(--brand)}
.tv-ora-app h1 .tock{color:var(--brand)}
.tv-ora-app .gear{border:none;background:var(--card);box-shadow:var(--shadow);border-radius:14px;
  font-size:1.25rem;padding:8px 14px;cursor:pointer;font-family:inherit}
.tv-ora-app .gear:focus-visible, .tv-ora-app button:focus-visible{outline:3px solid var(--perc);outline-offset:2px}
.tv-ora-app .taskcard{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:14px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.tv-ora-app .task-label{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:#9b9bbb}
.tv-ora-app .task-text{font-size:clamp(1.15rem,3.6vw,1.6rem);font-weight:800;flex:1;min-width:200px}
.tv-ora-app .task-text em{font-style:normal;color:var(--brand);background:#F5DCE8;
  border-radius:8px;padding:0 6px}
.tv-ora-app .speak, .tv-ora-app .progress{border:none;font-family:inherit}
.tv-ora-app .speak{background:var(--perc-soft);color:var(--perc);border-radius:14px;font-size:1.3rem;
  padding:8px 14px;cursor:pointer}
.tv-ora-app .speak:active{transform:scale(.94)}
.tv-ora-app .progress{background:var(--ok-soft);color:var(--ok);font-weight:800;border-radius:14px;
  padding:8px 14px;font-size:1rem}
.tv-ora-app .stage{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:14px}
@media (max-width:760px){.tv-ora-app .stage{grid-template-columns:1fr}}
.tv-ora-app .clockwrap{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:10px;display:flex;align-items:center;justify-content:center}
.tv-ora-app svg.clock{width:100%;max-width:480px;height:auto;display:block;touch-action:none;user-select:none}
.tv-ora-app .hand-grab{cursor:grab}
.tv-ora-app .hand-grab.dragging{cursor:grabbing}
.tv-ora-app .panel{display:flex;flex-direction:column;gap:12px}
.tv-ora-app .box{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px}
.tv-ora-app .box h2{margin:0 0 8px;font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;color:#9b9bbb}
.tv-ora-app .knobs{display:flex;align-items:center;justify-content:space-around;gap:8px}
.tv-ora-app .knobcol{display:flex;flex-direction:column;align-items:center;gap:6px}
.tv-ora-app .knob{width:86px;height:86px;border-radius:50%;position:relative;cursor:grab;touch-action:none;
  border:5px solid;box-shadow:inset 0 -5px 0 rgba(0,0,0,.12), 0 4px 0 rgba(51,51,92,.15);user-select:none}
.tv-ora-app .knob.dragging{cursor:grabbing}
.tv-ora-app .knob .notch{position:absolute;left:50%;top:7px;width:9px;height:24px;border-radius:6px;
  transform:translateX(-50%);}
.tv-ora-app .knob-perc{background:var(--perc-soft);border-color:var(--perc)}
.tv-ora-app .knob-perc .notch{background:var(--perc)}
.tv-ora-app .knob-ora{background:var(--ora-soft);border-color:var(--ora)}
.tv-ora-app .knob-ora .notch{background:var(--ora)}
.tv-ora-app .knoblabel{font-weight:800;font-size:.85rem}
.tv-ora-app .knoblabel.p{color:var(--perc)}
.tv-ora-app .knoblabel.o{color:var(--ora)}
.tv-ora-app .steppers{display:flex;gap:6px}
.tv-ora-app .step{border:none;border-radius:10px;font-family:inherit;font-weight:800;font-size:1.05rem;
  width:38px;height:34px;cursor:pointer;box-shadow:0 3px 0 rgba(51,51,92,.15)}
.tv-ora-app .step.p{background:var(--perc-soft);color:var(--perc)}
.tv-ora-app .step.o{background:var(--ora-soft);color:var(--ora)}
.tv-ora-app .step:active{transform:translateY(2px);box-shadow:none}
.tv-ora-app .sync{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.75rem;font-weight:700;color:#9b9bbb}
.tv-ora-app .sync button{border:2px dashed #c9c9e0;background:#fafaff;border-radius:50%;width:46px;height:46px;
  font-size:1.25rem;cursor:pointer}
.tv-ora-app .sync button.on{border-style:solid;border-color:var(--ok);background:var(--ok-soft)}
.tv-ora-app .actions{display:flex;flex-wrap:wrap;gap:8px}
.tv-ora-app .btn{border:none;font-family:inherit;font-weight:800;font-size:1.05rem;border-radius:16px;
  padding:12px 18px;cursor:pointer;box-shadow:0 4px 0 rgba(51,51,92,.18);flex:1;min-width:120px}
.tv-ora-app .btn:active{transform:translateY(3px);box-shadow:none}
.tv-ora-app .btn-check{background:var(--ok);color:#fff}
.tv-ora-app .btn-show{background:#fff;color:var(--ink);border:2px solid #d9d9ea}
.tv-ora-app .btn-next{background:var(--rim);color:#6b4d00}
.tv-ora-app .btn[disabled]{opacity:.45;cursor:not-allowed}
.tv-ora-app .feedback{min-height:54px;border-radius:16px;padding:10px 14px;font-weight:700;font-size:1rem;display:none}
.tv-ora-app .feedback.show{display:block}
.tv-ora-app .feedback.good{background:var(--ok-soft);color:var(--ok)}
.tv-ora-app .feedback.partial{background:var(--warn-soft);color:var(--warn)}
.tv-ora-app .feedback.bad{background:var(--ora-soft);color:var(--ora)}
.tv-ora-app .settings{display:none;margin-bottom:12px}
.tv-ora-app .settings.open{display:block}
.tv-ora-app .settings .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.tv-ora-app .field label{display:block;font-size:.75rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:#9b9bbb;margin-bottom:4px}
.tv-ora-app .field select{width:100%;font-family:inherit;font-size:1rem;font-weight:700;color:var(--ink);
  border:2px solid #e3e3f0;border-radius:12px;padding:8px;background:#fff}
.tv-ora-app .confetti{position:fixed;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:50}
.tv-ora-app .confetti span{position:absolute;top:-40px;font-size:1.6rem;animation:fall 1.6s ease-in forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(340deg);opacity:.7}}
@media (prefers-reduced-motion: reduce){.tv-ora-app .confetti span{display:none}
.tv-ora-app #hourHandG, .tv-ora-app #minHandG{transition:none !important}}
.tv-ora-app .finish{position:fixed;inset:0;background:rgba(51,51,92,.45);display:none;
  align-items:center;justify-content:center;z-index:60;padding:16px}
.tv-ora-app .finish.show{display:flex}
.tv-ora-app .finish .card{background:#fff;border-radius:26px;padding:28px 32px;text-align:center;max-width:380px;width:100%;
  box-shadow:0 10px 0 rgba(0,0,0,.15)}
.tv-ora-app .finish .stars{font-size:3rem;letter-spacing:.1em;margin:6px 0 2px}
.tv-ora-app .finish p{margin:6px 0 16px;font-weight:700}
.tv-ora-app .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.tv-ora-app footer{margin-top:14px;font-size:.75rem;color:var(--brand);text-align:center;font-weight:600}