:root { color-scheme: dark; --bg:#15161a; --panel:#202228; --text:#f4f5f7; --muted:#a9adb7; --line:#343741; --accent:#78a6ff; --good:#79d99d; }
* { box-sizing:border-box; }
html { font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif; background:var(--bg); color:var(--text); }
body { margin:0; }
a { color:var(--accent); }
.site-header,.site-main,.site-footer { width:min(920px,calc(100% - 32px)); margin-inline:auto; }
.site-header { min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
.brand { color:var(--text); font-size:20px; font-weight:800; text-decoration:none; }
nav { display:flex; flex-wrap:wrap; gap:10px 18px; }
.site-main { padding-block:44px; }
.hero h1 { margin:0; font-size:clamp(32px,7vw,52px); line-height:1.08; }
.hero p,.muted,.content-section,.tool-card p { color:var(--muted); }
.tool-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; margin-top:32px; }
.card,.tool-card,.content-section { padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--panel); }
.card h2,.tool-card h2,.content-section h2 { margin-top:0; }
.tool-card { display:grid; gap:18px; margin-block:32px; }
.field-grid,.result-grid { display:grid; grid-template-columns:minmax(130px,1fr) minmax(170px,2fr); align-items:center; gap:12px 18px; }
input,select,button,textarea { min-height:48px; border:1px solid var(--line); border-radius:10px; padding:10px 12px; background:var(--bg); color:var(--text); font:inherit; }
textarea { width:100%; resize:vertical; }
#photo-preview,#image-preview { display:block; width:min(100%,30rem); height:auto; margin:1rem auto; border:1px solid var(--line); background:#fff; }
button { cursor:pointer; font-weight:700; }
button.primary { border-color:var(--accent); background:var(--accent); color:#09101d; }
button:disabled { opacity:.45; cursor:not-allowed; }
.result-primary { padding:18px; border-radius:12px; background:#173022; color:var(--good); font-size:clamp(20px,5vw,28px); font-weight:800; }
.result-grid { margin:0; }
.result-grid dt { color:var(--muted); }
.result-grid dd { margin:0; font-weight:700; }
.tool-result { display:grid; gap:16px; }
.result-text { min-height:150px; }
.error-text { color:#ff8f8f; }
.breadcrumbs { margin-bottom:24px; color:var(--muted); font-size:14px; }
.related-grid { display:flex; flex-wrap:wrap; gap:12px 20px; }
.preset-row,.action-row { display:flex; flex-wrap:wrap; gap:10px; }
.preview-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:10px; }
.preview-grid img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:10px; }
.progress { width:100%; }
.content-section { margin-top:20px; }
.content-section li+li { margin-top:8px; }
.content-section details { padding-block:12px; border-bottom:1px solid var(--line); }
.site-footer { padding-block:28px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
@media(max-width:560px){.site-header{align-items:flex-start;flex-direction:column;padding-block:16px}.field-grid,.result-grid{grid-template-columns:1fr}}