/* AI Writer page (builds on humanizer.css) */
.wr-tool { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 18px; align-items: start; }
.wr-brief { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.wr-brief fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.wr-brief legend { font-family: var(--display); font-weight: 800; font-size: 18px; margin-bottom: 8px; padding: 0; }
.wr-types { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px !important; }
.wr-types legend { grid-column: 1 / -1; }
.wr-type { text-align: left; border: 1.5px solid var(--line); background: #fff; border-radius: 14px; padding: 10px 12px; cursor: pointer; font: inherit; display: flex; flex-direction: column; gap: 2px; min-height: 64px; color: var(--ink); }
.wr-type b { font-size: 15px; } .wr-type span { font-size: 12.5px; color: var(--muted); }
.wr-type:hover { border-color: var(--ink); }
.wr-type.on { border-color: var(--ink); background: var(--yellow-t); box-shadow: 3px 3px 0 var(--ink); }
.wr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wr-grid label { display: flex; flex-direction: column; gap: 5px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); min-width: 0; }
.wr-grid label.full { grid-column: 1 / -1; }
.wr-grid em { color: var(--red); font-style: normal; }
.wr-grid input, .wr-grid textarea, .wr-lang select { font: inherit; font-weight: 400; font-size: 15px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; min-height: 44px; background: #fff; color: var(--ink); resize: vertical; }
.wr-grid input:focus, .wr-grid textarea:focus, .wr-lang select:focus { outline: 3px solid var(--green-t2); border-color: var(--green); }
.wr-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.wr-k { font-size: 13.5px; font-weight: 600; color: var(--ink-2); width: 56px; }
.wr-lang { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); margin-left: auto; }
.wr-lang select { min-height: 40px; padding: 6px 10px; }
.wr-preview { border: 1px solid var(--line); border-radius: 16px; background: #FBFCFB; display: flex; flex-direction: column; min-width: 0; position: sticky; top: 84px; max-height: calc(100vh - 110px); }
.wr-doc { padding: 18px 22px; overflow-y: auto; flex: 1; min-height: 360px; font-size: 15.5px; line-height: 1.65; color: #1F2924; overflow-wrap: anywhere; }
.wr-doc h1 { font-family: var(--display); font-size: 28px; letter-spacing: -0.02em; line-height: 1.15; margin: 0 0 12px; }
.wr-doc h2 { font-family: var(--display); font-size: 21px; margin: 22px 0 8px; } .wr-doc h3 { font-size: 17px; margin: 16px 0 6px; } .wr-doc h4 { font-size: 15px; margin: 14px 0 4px; }
.wr-doc p { margin: 0 0 12px; } .wr-doc ul, .wr-doc ol { margin: 0 0 12px; padding-left: 22px; } .wr-doc li { margin-bottom: 4px; }
.wr-doc mark.ph { background: var(--yellow-t2); border-radius: 4px; padding: 0 3px; color: #5C4300; font-weight: 600; }
.wr-gate { margin: 0 14px 12px; padding: 14px; border-radius: 14px; background: var(--ink); color: #fff; display: flex; flex-direction: column; gap: 8px; }
.wr-gate span { color: #DCE5DF; font-size: 14.5px; } .wr-gate div { display: flex; gap: 8px; flex-wrap: wrap; }
.wr-gate .btn-soft { background: #fff; color: var(--ink); }
.wr-preview .hz-pane-f { flex-wrap: wrap; }
@media (max-width: 960px) { .wr-tool { grid-template-columns: minmax(0, 1fr); } .wr-preview { position: static; max-height: none; } .wr-grid { grid-template-columns: minmax(0, 1fr); } .wr-lang { margin-left: 0; } }