.app{min-height:100vh;padding:18px 12px 28px}.shell{gap:14px;width:100%;display:grid}.panel{border:1px solid var(--border);box-shadow:var(--shadow-lg);background:#111823;border-radius:22px}.header{padding:8px 6px 10px}.header__row{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.header__brand{align-items:center;gap:12px;display:flex}.header__brandmark{border-radius:12px;flex:none;width:46px;height:46px;box-shadow:0 10px 24px #00000052}.header__eyebrow,.output__eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--text-soft);margin:0 0 4px;font-size:.72rem;font-weight:700}.header h1,.output h2{margin:0;font-family:Iowan Old Style,Palatino Linotype,serif;line-height:1.05}.header h1{color:var(--text-primary);font-size:clamp(1.75rem,3.4vw,2.75rem)}.header__lede{color:var(--text-secondary);margin:4px 0 0}.header__link{min-height:38px;color:var(--text-primary);white-space:nowrap;background:#0b111a;border:1px solid #2b3b50;border-radius:999px;align-items:center;padding:0 14px;text-decoration:none;transition:transform .15s,border-color .15s,background .15s;display:inline-flex}.header__link:hover{background:#4dc6b214;border-color:#4dc6b261;transform:translateY(-1px)}.toolbar{grid-template-columns:minmax(0,1fr) auto;gap:10px 14px;padding:14px 16px;display:grid}.field{gap:8px;display:grid}.field__label{color:var(--text-secondary);justify-content:space-between;gap:12px;font-size:.94rem;display:flex}.field__label span:first-child{color:var(--text-primary);font-weight:700}.field__control{display:flex}.field input{width:100%;height:48px;color:var(--text-primary);background:#060b13d1;border:1px solid #273446;border-radius:14px;outline:none;padding:0 14px;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:#4dc6b2b3;box-shadow:0 0 0 4px #4dc6b21f}.toolbar__actionsWrap{place-self:center end;position:relative}.toolbar__actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.toolbar__action{position:relative}.toolbar__feedback{color:var(--text-primary);white-space:nowrap;opacity:0;pointer-events:none;background:#101c27fa;border:1px solid #4dc6b247;border-radius:999px;padding:6px 10px;font-size:.84rem;line-height:1;transition:opacity .14s,transform .14s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px)}.toolbar__feedback--visible{opacity:1;transform:translate(-50%)}.toolbar__feedback--error{border-color:#ff845e57}.toolbar__status{min-height:1.2rem;color:var(--text-secondary);grid-column:1/-1;margin:0;font-size:.94rem}.button{min-height:40px;color:var(--text-primary);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:999px;padding:0 14px;transition:transform .15s,border-color .15s,background .15s}.button:disabled{opacity:.45;cursor:not-allowed}.button:not(:disabled):hover{transform:translateY(-1px)}.button--secondary{background:#0b111a;border-color:#2b3b50}.button--primary{background:#4dc6b224;border-color:#4dc6b261}.outputs{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.output{gap:10px;padding:14px 16px 16px;display:grid}.output__header{justify-content:space-between;align-items:center;gap:12px;display:flex}.output h2{color:var(--text-primary);font-size:1.4rem}.output__meta{color:var(--text-soft);flex-wrap:wrap;gap:8px;font-size:.84rem;display:flex}.code-block{color:#e8f4ff;background:#0a1018;border:1px solid #233041;border-radius:18px;min-height:270px;margin:0;padding:16px;font-family:JetBrains Mono,SFMono-Regular,Consolas,monospace;font-size:.8rem;line-height:1.34;overflow:auto}.code-block--soft{color:#d8e6f7}@media (width<=900px){.toolbar,.outputs{grid-template-columns:1fr}.toolbar__actionsWrap{justify-self:start}.toolbar__actions{justify-content:flex-start}}@media (width<=640px){.app{padding-inline:10px}.header,.toolbar,.output{padding-inline:14px}.header__brand{align-items:flex-start}.header__row{flex-direction:column}.output__header{flex-direction:column;align-items:flex-start}.code-block{min-height:220px;padding:14px}}*,:before,:after{box-sizing:border-box}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-page:#05080e;--border:#7690ad33;--text-primary:#ebf2fb;--text-secondary:#a7b6c9;--text-soft:#74849a;--shadow-lg:0 28px 70px #0000005c;--selection:#4dc6b238;font-family:Avenir Next,Segoe UI,sans-serif;font-weight:400;line-height:1.5}html{background:var(--bg-page);min-height:100%}body{min-height:100vh;color:var(--text-primary);background:var(--bg-page);margin:0}button,input,textarea{font:inherit}::selection{background:var(--selection)}#root{min-height:100vh}