.opn-gate,.opn-page{display:grid;grid-gap:var(--space-3);gap:var(--space-3)}.opn-gate{text-align:center;justify-items:center}.opn-gate p{line-height:1.55}.opn-gate p,.opn-safety ul{margin:0;color:var(--color-ivory-dim)}.opn-safety ul{padding-left:1.1em;display:grid;grid-gap:var(--space-1);gap:var(--space-1);font-size:.92rem;line-height:1.5}.opn-masjid-name{margin:0;font-family:var(--font-display);font-size:1.2rem}.opn-file,.opn-select{width:100%}.opn-file{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);border:1px dashed var(--color-gold-deep);background:color-mix(in oklch,var(--color-gold) 8%,transparent);cursor:pointer;transition:border-color var(--duration-normal) var(--ease-calm),background var(--duration-normal) var(--ease-calm)}.opn-file:hover{background:color-mix(in oklch,var(--color-gold) 14%,transparent)}.opn-file-icon{font-size:1.6rem;flex-shrink:0}.opn-file span>b{display:block;font-size:1rem;color:var(--color-ivory)}.opn-file span>small{display:block;margin-top:.15em;color:var(--color-ivory-faint);font-size:.8rem}.opn-file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.opn-note-label{display:block;margin:var(--space-3) 0 var(--space-1);font-size:.85rem;color:var(--color-ivory-faint)}.opn-note{width:100%;min-height:88px;resize:vertical;font-family:var(--font-ui);line-height:1.45}.opn-note-count{margin:var(--space-1) 0 0;text-align:right;font-size:.75rem;color:var(--color-ivory-faint)}.opn-status{margin:var(--space-3) 0 0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:.88rem;line-height:1.5}.opn-status[data-kind=ok]{color:color-mix(in oklch,var(--color-green) 80%,var(--color-ivory));background:color-mix(in oklch,var(--color-green) 14%,transparent);border:1px solid color-mix(in oklch,var(--color-green) 32%,transparent)}.opn-status[data-kind=err]{color:color-mix(in oklch,#c96a4a 80%,var(--color-ivory));background:color-mix(in oklch,#c96a4a 12%,transparent);border:1px solid color-mix(in oklch,#c96a4a 30%,transparent)}.opn-submit{width:100%;margin-top:var(--space-3)}.opn-submit:disabled{opacity:.55;cursor:not-allowed}.opn-mode-tabs{display:grid;grid-template-columns:1fr 1fr;grid-gap:var(--space-2);gap:var(--space-2);margin-bottom:var(--space-3)}.opn-mode-tab{min-height:44px;padding:.55em 1em;border-radius:var(--radius-md);border:1px solid var(--color-night-border);background:var(--color-night-raised);color:var(--color-ivory-dim);font-size:.92rem;font-weight:600;transition:border-color var(--duration-normal) var(--ease-calm),color var(--duration-normal) var(--ease-calm),background var(--duration-normal) var(--ease-calm)}.opn-mode-tab.is-active{border-color:var(--color-gold-deep);background:color-mix(in oklch,var(--color-gold) 12%,var(--color-night-raised));color:var(--color-gold)}.opn-ready-chip{margin:0 0 var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:.85rem;color:color-mix(in oklch,var(--color-green) 78%,var(--color-ivory));background:color-mix(in oklch,var(--color-green) 14%,transparent);border:1px solid color-mix(in oklch,var(--color-green) 30%,transparent)}.opn-record-intro{margin:0 0 var(--space-3);color:var(--color-ivory-dim);font-size:.9rem;line-height:1.55;text-align:center}.rec{display:grid;justify-items:center;grid-gap:var(--space-3);gap:var(--space-3);padding:var(--space-2) 0 var(--space-3);text-align:center}.rec-button{width:108px;height:108px;border-radius:50%;border:none;display:grid;place-items:center;background:linear-gradient(160deg,var(--color-gold,oklch(62% .125 82)),var(--color-gold-deep,oklch(52% .13 78)));box-shadow:0 14px 32px oklch(52% .13 78/.3);cursor:pointer;transition:transform var(--duration-fast) var(--ease-calm),box-shadow var(--duration-normal) var(--ease-calm)}.rec-button:active{transform:scale(.96)}.rec-button:disabled{opacity:.6;cursor:wait}.rec-button-icon{font-size:2.4rem;line-height:1}.rec-button-active{background:linear-gradient(160deg,var(--color-live),color-mix(in oklch,var(--color-live) 55%,black));box-shadow:0 0 0 0 color-mix(in oklch,var(--color-live) 45%,transparent),0 14px 32px color-mix(in oklch,var(--color-live) 35%,transparent);animation:rec-pulse 1.8s var(--ease-calm) infinite}@keyframes rec-pulse{0%{box-shadow:0 0 0 0 color-mix(in oklch,var(--color-live) 45%,transparent),0 14px 32px color-mix(in oklch,var(--color-live) 35%,transparent)}70%{box-shadow:0 0 0 18px color-mix(in oklch,var(--color-live) 0%,transparent),0 14px 32px color-mix(in oklch,var(--color-live) 35%,transparent)}to{box-shadow:0 0 0 0 color-mix(in oklch,var(--color-live) 0%,transparent),0 14px 32px color-mix(in oklch,var(--color-live) 35%,transparent)}}@media (prefers-reduced-motion:reduce){.rec-button-active{animation:none;box-shadow:0 0 0 4px color-mix(in oklch,var(--color-live) 45%,transparent),0 14px 32px color-mix(in oklch,var(--color-live) 35%,transparent)}}.rec-timer{margin:0;font-family:var(--font-display);font-size:1.6rem;color:var(--color-ivory);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.rec-meter{display:flex;align-items:flex-end;gap:4px;height:32px}.rec-meter-bar{width:6px;height:100%;border-radius:3px;background:var(--color-night-border);opacity:.35;transform:scaleY(.28);transform-origin:bottom;transition:transform var(--duration-fast) var(--ease-calm),opacity var(--duration-fast) var(--ease-calm),background var(--duration-fast) var(--ease-calm)}.rec-meter-bar.is-active{opacity:1;transform:scaleY(1);background:var(--color-live)}.rec-meter-bar:first-child,.rec-meter-bar:nth-child(10){max-height:45%}.rec-meter-bar:nth-child(2),.rec-meter-bar:nth-child(9){max-height:65%}.rec-meter-bar:nth-child(3),.rec-meter-bar:nth-child(8){max-height:85%}.rec-meter-bar:nth-child(4),.rec-meter-bar:nth-child(5),.rec-meter-bar:nth-child(6),.rec-meter-bar:nth-child(7){max-height:100%}@media (prefers-reduced-motion:reduce){.rec-meter-bar{transition:none}}.rec-silence-hint{margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:.85rem;color:color-mix(in oklch,var(--color-gold-deep) 80%,var(--color-ivory));background:color-mix(in oklch,var(--color-gold) 14%,transparent);border:1px solid color-mix(in oklch,var(--color-gold) 30%,transparent)}.rec-hint{margin:0;color:var(--color-ivory-faint);font-size:.88rem;line-height:1.5}.rec-fallback,.rec-review{display:grid;grid-gap:var(--space-3);gap:var(--space-3);justify-items:center;text-align:center;padding:var(--space-2) 0}.rec-confirmed-msg{margin:0;color:color-mix(in oklch,var(--color-green) 78%,var(--color-ivory));font-size:.92rem;line-height:1.5}.rec-audio{width:100%}.rec-review-actions{display:flex;gap:var(--space-2);width:100%}.rec-review-actions .btn{flex:1 1}