.reader-layout{display:grid;min-height:720px;grid-template-columns:minmax(340px,.84fr) minmax(0,1.36fr)}.reader-controls{min-width:0;padding:clamp(22px,3vw,31px);border-right:1px solid var(--dev-line);background:#fffcf8}.reader-file-button{display:flex;min-height:45px;margin-bottom:18px;align-items:center;justify-content:center;gap:8px;border:1.5px dashed var(--developer-border);border-radius:11px;color:var(--developer-accent);background:var(--developer-tint);font-size:.82rem;font-weight:780;cursor:pointer}.reader-file-button:hover{border-style:solid}.reader-file-button:focus-within{outline:3px solid color-mix(in oklab,var(--developer-accent) 16%,transparent);outline-offset:2px}.reader-file-button svg{width:18px}.reader-file-button input{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.reader-field{display:grid;margin-bottom:17px;gap:8px}.reader-field>span{color:var(--dev-ink);font-size:.8125rem;font-weight:760}.reader-field>span small{margin-left:4px;color:var(--dev-muted);font-size:.7rem;font-weight:650}.reader-field input,.reader-field textarea{width:100%;padding:13px 14px;border:1.5px solid var(--dev-line);border-radius:11px;outline:none;color:#2b1f11;background:#fff;font-family:SFMono-Regular,Consolas,monospace;font-size:.78rem;line-height:1.6}.reader-field textarea{min-height:260px;resize:vertical}.reader-field input:focus-visible,.reader-field textarea:focus-visible{border-color:var(--developer-accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--developer-accent) 14%,transparent)}.reader-field--url input{font-family:inherit;font-size:.84rem}.reader-input-meta{display:grid;margin-top:-6px;gap:5px;color:var(--dev-muted);font-size:.72rem;line-height:1.48}.reader-input-meta span:first-child{font-variant-numeric:tabular-nums;font-weight:730}.reader-options{display:grid;margin-top:21px;grid-template-columns:1fr;gap:12px}.reader-options .dev-segmented>div{width:100%}.reader-options .dev-segmented label{min-width:0;flex:1;padding-inline:6px}.reader-run-button{width:100%;min-height:47px;margin-top:23px}.reader-spin{animation:reader-spin .85s linear infinite}.reader-result{display:grid;min-width:0;grid-template-rows:auto auto auto auto auto;align-content:start;background:#fbf7f1}.reader-result-heading{display:flex;min-height:52px;padding:0 18px;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--dev-line);color:var(--dev-muted);background:#fefbf7;font-size:.75rem;font-weight:760}.reader-result-heading>span:first-child{display:inline-flex;align-items:center;gap:7px;color:var(--dev-ink);font-size:.8125rem}.reader-result-heading svg{width:17px;color:var(--developer-accent)}.reader-error{margin:16px 18px 0}.reader-metrics{display:grid;padding:13px 15px;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;border-bottom:1px solid var(--dev-line);background:#fdf9f4}.reader-preview{min-height:480px;padding:clamp(22px,5vw,52px);overflow:auto;transition:color .18s,background .18s}.reader-preview>article{box-sizing:border-box;max-width:700px;min-height:100%;margin:0 auto;padding:clamp(28px,5vw,58px);border:1px solid oklch(.88 .018 76);border-radius:4px;background:#fff;box-shadow:0 18px 45px #392b1a14;font-family:Georgia,Times New Roman,serif;font-size:19px;line-height:1.74}.reader-preview--compact>article{max-width:640px;font-size:17px}.reader-preview--large>article{max-width:780px;font-size:22px}.reader-preview--warm{background:#eee6d6}.reader-preview--warm>article{border-color:#ded2bd;color:#342d23;background:#fff9eb}.reader-preview--night{background:#171717}.reader-preview--night>article{border-color:#3d3a35;color:#f4f0e7;background:#202020;box-shadow:none}.reader-preview article>header{margin-bottom:2.3rem;padding-bottom:1.4rem;border-bottom:1px solid currentColor;border-bottom-color:color-mix(in srgb,currentColor 14%,transparent)}.reader-preview article>header p{margin:0 0 .7rem;color:color-mix(in srgb,currentColor 66%,transparent);font-family:system-ui,sans-serif;font-size:.7em;font-weight:760;letter-spacing:.025em;text-transform:uppercase}.reader-preview article>header h2{margin:0;font-size:clamp(2rem,5vw,3.35rem);line-height:1.07;letter-spacing:-.035em}.reader-preview article>header span{display:block;margin-top:1rem;color:color-mix(in srgb,currentColor 72%,transparent);font-family:system-ui,sans-serif;font-size:.78em;line-height:1.55}.reader-article-content h1:first-child{display:none}.reader-article-content h2,.reader-article-content h3{margin:2.1em 0 .65em;line-height:1.2;letter-spacing:-.015em}.reader-article-content p{margin:0 0 1.15em}.reader-article-content a{color:inherit;text-decoration-thickness:.08em;text-underline-offset:.16em}.reader-article-content blockquote{margin:1.8em 0;padding-left:1.1em;border-left:4px solid var(--developer-border);font-style:italic}.reader-article-content table{width:100%;border-collapse:collapse;font-family:system-ui,sans-serif;font-size:.74em}.reader-article-content th,.reader-article-content td{padding:.6em;border:1px solid color-mix(in srgb,currentColor 20%,transparent);text-align:left}.reader-code-output,.reader-text-output,.reader-metadata-output{min-height:480px;margin:0;padding:clamp(22px,4vw,38px);overflow:auto;border:0;color:#2e2519;background:#fffdfa;font-size:.8rem;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.reader-code-output,.reader-metadata-output pre{font-family:SFMono-Regular,Consolas,monospace}.reader-text-output{max-width:none;font-family:Georgia,Times New Roman,serif;font-size:1rem;line-height:1.8;white-space:pre-wrap}.reader-metadata-output{display:grid;align-content:start;gap:22px}.reader-metadata-output dl{display:grid;margin:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.reader-metadata-output dl>div{min-width:0;padding:12px;border:1px solid var(--dev-line);border-radius:9px;background:#fff}.reader-metadata-output dt{margin-bottom:5px;color:var(--dev-muted);font-family:system-ui,sans-serif;font-size:.68rem;font-weight:760;text-transform:uppercase}.reader-metadata-output dd{margin:0;overflow-wrap:anywhere;font-family:system-ui,sans-serif;font-size:.84rem;font-weight:720}.reader-metadata-output pre{margin:0;padding:18px;overflow:auto;border:1px solid var(--dev-line);border-radius:10px;color:#362c20;background:#fbf7f2;font-size:.78rem;line-height:1.65;white-space:pre-wrap}.reader-result-actions{display:flex;padding:15px 17px;align-items:center;flex-wrap:wrap;gap:9px;border-top:1px solid var(--dev-line);background:#fefcf8}.reader-result-actions .dev-copy-button{min-height:38px}.reader-empty{display:grid;min-height:480px;place-content:center;justify-items:center;gap:9px;color:var(--dev-muted);text-align:center}.reader-empty svg{width:34px;height:34px;margin-bottom:5px;color:var(--developer-accent)}.reader-empty strong{color:var(--dev-ink);font-size:1rem}.reader-empty span{max-width:32ch;font-size:.8rem;line-height:1.5}@keyframes reader-spin{to{transform:rotate(360deg)}}@media(max-width:900px){.reader-layout{min-height:0;grid-template-columns:1fr}.reader-controls{border-right:0;border-bottom:1px solid var(--dev-line)}.reader-result{grid-template-rows:auto auto auto auto auto}}@media(max-width:560px){.reader-controls{padding:18px 15px}.reader-field textarea{min-height:220px}.reader-options{grid-template-columns:1fr}.reader-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.reader-preview{min-height:380px;padding:13px}.reader-preview>article{min-height:360px;padding:27px 21px;font-size:17px}.reader-preview--large>article{font-size:19px}.reader-preview article>header h2{font-size:2rem}.reader-code-output,.reader-text-output,.reader-metadata-output{min-height:390px;padding:19px 15px}.reader-metadata-output dl{grid-template-columns:1fr 1fr}.reader-result-actions{display:grid;grid-template-columns:1fr}.reader-result-actions>*{width:100%;justify-content:center}}@media(prefers-reduced-motion:reduce){.reader-spin{animation:none}}
