:root{--text: #2a2733;--text-h: #08060d;--bg: #fff;--border: #e5e4e7;--accent: #7a3bff;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif;color-scheme:light dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(prefers-color-scheme:dark){:root{--text: #d7d5db;--text-h: #f3f4f6;--bg: #16171d;--border: #2e303a;--accent: #c084fc}}*,*:before,*:after{box-sizing:border-box}body{margin:0}.app{width:100%;max-width:640px;margin:0 auto;padding:16px}.brand{font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 8px}h1{font-size:1.5rem;color:var(--text-h);margin:0 0 12px}h2{font-size:1.05rem;color:var(--text-h);margin:0 0 4px}form{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--border);border-radius:8px}.form-row{display:flex;flex-direction:column;gap:4px}.form-row label{font-weight:600}.form-row input,.form-row select{width:100%;min-height:44px;padding:8px 10px;font-size:1rem;border:1px solid var(--border);border-radius:6px;color:var(--text-h);background:var(--bg)}.form-error{color:#c0392b;font-weight:600;margin:0}@media(prefers-color-scheme:dark){.form-error{color:#ff8a75}}.form-actions{display:flex;flex-direction:column;gap:8px}.form-actions button{width:100%;min-height:44px;padding:10px;font-size:1rem;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text-h);cursor:pointer}.form-actions button[type=submit]{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.hijri-result{margin-top:20px;padding:16px;border:1px solid var(--border);border-radius:8px;display:flex;flex-direction:column;gap:12px}.hijri-result-row p{margin:0;word-break:break-word}.hijri-result-arabic{font-size:1.25rem}.hijri-result>button{align-self:flex-start;min-height:44px;padding:10px 16px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text-h);cursor:pointer}.method-explanation{margin-top:20px}.method-explanation summary{cursor:pointer;font-weight:600}.method-explanation p{max-width:65ch}@media(min-width:640px){.app{padding:32px 16px}.form-actions{flex-direction:row}.form-actions button{width:auto;flex:1}}
