.field label{margin-bottom:var(--space-2);font-weight:650;display:block}.field :is(textarea,input){width:100%;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-card);color:var(--ink);font:inherit;border:0;display:block}.panel .field :is(textarea,input){background:var(--paper);box-shadow:none}.field input[hidden]{display:none}.field :is(textarea,input):focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--radius-md)}.field textarea{resize:vertical;min-height:18rem;line-height:1.6}.actions{gap:var(--space-2);margin:var(--space-3) 0 0;flex-wrap:wrap;display:flex}.actions .button{cursor:pointer;color:var(--ink)}.panel{padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-card)}.choices{border:0;min-width:0;margin:0;padding:0}.choices legend{margin-bottom:var(--space-2);padding:0;font-weight:650}.pills{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.pill{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border:1px solid var(--rule);border-radius:var(--radius-pill);background:var(--surface);cursor:pointer;transition:border-color var(--motion-quick) ease, background-color var(--motion-quick) ease, color var(--motion-quick) ease;font-weight:650;display:inline-flex;position:relative}.pill:hover{border-color:var(--ink)}.pill:has(input[type=radio]:checked){border-color:var(--ink);background:var(--ink);color:var(--paper)}.pill:has(:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.pill input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--ink);margin:0}.pill:has(input:disabled){opacity:.45;cursor:not-allowed}.convert{gap:var(--space-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.convert-controls{gap:var(--space-4);grid-column:1/-1;display:grid}.convert .field textarea{min-height:16rem}.convert textarea[readonly]{background:var(--wash)}.convert-note{margin:var(--space-3) 0 0;font-size:var(--text-sm);font-weight:600}.convert-note:empty{display:none}.panes{--pane:clamp(16rem, calc(100svh - 9.5rem), 44rem);--split:.5;grid-template-columns:calc((100% - var(--space-5)) * var(--split)) var(--space-5) minmax(0, 1fr);display:grid}.pane-split{margin-top:calc(2rem + var(--space-2));height:var(--pane);cursor:col-resize;touch-action:none;outline:none;position:relative}.pane-split:after{content:"";width:var(--hairline);background:var(--rule);transition:background-color var(--motion-quick) ease, width var(--motion-quick) ease;position:absolute;inset:0 auto 0 50%;translate:-50%}.pane-split i{border-radius:var(--radius-pill);background:var(--focus);opacity:0;width:6px;height:2.25rem;transition:opacity var(--motion-quick) ease;position:absolute;top:50%;left:50%;translate:-50% -50%}.pane-split:is(:hover,:focus-visible,.is-dragging):after{background:var(--focus);width:2px}.pane-split:is(:hover,:focus-visible,.is-dragging) i{opacity:1}.pane-split:focus-visible i{outline:2px solid var(--focus);outline-offset:3px}.is-col-resizing,.is-col-resizing *{cursor:col-resize!important;user-select:none!important}.panes .field textarea{height:var(--pane);min-height:10rem;font-family:var(--font-code);font-size:var(--text-sm)}.panes .field label,.pane-head{justify-content:space-between;align-items:center;gap:var(--space-3);min-height:2rem;margin:0 0 var(--space-2);display:flex}.pane-label{margin:0;font-weight:650}.pane-view{height:var(--pane);overflow:auto}.pane-view:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.pane-view:empty:before{content:attr(data-hint);color:var(--muted)}.drop{justify-items:center;gap:var(--space-2);padding:var(--space-7) var(--space-5);border:2px dashed var(--rule);border-radius:var(--radius-xl);background:var(--surface);text-align:center;cursor:pointer;transition:border-color var(--motion-quick) ease, background var(--motion-quick) ease;display:grid}.drop:hover,.drop.is-over{border-color:var(--ink)}.drop.is-over{background:var(--wash)}.drop:has(:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.drop .icon{width:2rem;height:2rem;color:var(--muted)}.drop-big{font-size:var(--text-md);font-weight:650}.drop .pick{text-underline-offset:.2em;text-decoration:underline}.drop-small{color:var(--muted);font-size:var(--text-sm)}.preview-start:not([hidden]){gap:var(--space-3);display:grid}.preview-start .actions{justify-content:center;margin:0}.preview-drop{align-content:center;min-height:clamp(12rem,100svh - 28rem,26rem)}.panes :is(.field textarea,.pane-view).is-over{outline:2px solid var(--focus);outline-offset:2px}.preview-bar{justify-content:space-between;align-items:center;gap:var(--space-3);margin:0 0 var(--space-4);flex-wrap:wrap;display:flex}.preview-bar .button{cursor:pointer;color:var(--ink)}.preview-work:not([data-mode=both]) .panes{grid-template-columns:minmax(0,1fr)}.preview-work:not([data-mode=both]) .pane-split,.preview-work[data-mode=preview] .panes>.field,.preview-work[data-mode=text] .panes>:last-child{display:none}@media (width<=719px){.convert{grid-template-columns:minmax(0,1fr)}.convert .field textarea{min-height:10rem}.panes{gap:var(--space-5);grid-template-columns:minmax(0,1fr)}.pane-split{display:none}.panes .field textarea{height:14rem}.pane-view{height:auto;min-height:8rem}.preview-drop{min-height:clamp(12rem,100svh - 30rem,26rem)}.preview-bar{gap:var(--space-2)}.preview-work .switch label{padding-inline:var(--space-2)}}
