/* Mesh Studio — admin panel. Quiet surfaces, one green accent for "publish / primary". */
:root{
  --canvas:#f1f3f0;--panel:#fff;--ink:#1c2126;--muted:#5f6871;--line:#d9ddd7;--line-strong:#bfc5bd;
  --accent:#0f6b54;--accent-ink:#fff;--accent-soft:#e1efe9;--danger:#b42318;--danger-soft:#fdecea;--warn-soft:#fff4d6;--info-soft:#e8f0fb;
  --side:#1f262b;--side-ink:#d9dfe3;--side-muted:#8d989f;
  --radius:8px;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--canvas);color:var(--ink);font:15px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent)}
h1{font-size:1.6rem;line-height:1.2;margin:0;letter-spacing:-.01em}
h2{font-size:1.15rem;margin:0 0 .75rem}
h3{font-size:1rem;margin:0}
code{font-family:var(--mono);font-size:.88em;background:#eef0ec;padding:.1em .35em;border-radius:4px}
:focus-visible{outline:3px solid #4c9dff;outline-offset:2px}
.muted{color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Shell */
.shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.side{background:var(--side);color:var(--side-ink);display:flex;flex-direction:column;padding:1.25rem 1rem;position:sticky;top:0;height:100vh;overflow:auto}
.side a{color:var(--side-ink);text-decoration:none}
.brand{font-weight:700;font-size:1.05rem;display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem}
.brand__mark{color:#5fd0a8;font-size:1.3rem}
.side__site{display:grid;gap:.15rem;padding:.75rem;border:1px solid #33404a;border-radius:var(--radius);margin-bottom:1rem}
.side__label{color:var(--side-muted);font-size:.8rem}
.side__host{color:#8fd6bd!important;font-size:.85rem;word-break:break-all}
.side__nav{display:grid;gap:2px}
.side__nav a{padding:.45rem .75rem;border-radius:6px;color:var(--side-ink)}
.side__nav a:hover{background:#2a343b}
.side__nav a.is-active{background:#33424b;color:#fff;box-shadow:inset 3px 0 0 #5fd0a8}
.side__foot{margin-top:auto;display:grid;gap:.35rem;font-size:.88rem;padding-top:1rem;border-top:1px solid #33404a}
.side__user{color:var(--side-muted);word-break:break-all}
.main{padding:1.75rem 2rem 4rem;min-width:0;max-width:1280px}
@media (max-width:860px){.shell{grid-template-columns:1fr}.side{position:static;height:auto}.main{padding:1.25rem}}

/* Generic */
.page-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.crumbs{margin:0 0 .25rem;font-size:.88rem;color:var(--muted)}
.section-title{margin-top:.5rem}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;margin-bottom:1.25rem}
.panel > summary{cursor:pointer;font-weight:600;list-style:none}
.panel > summary::-webkit-details-marker{display:none}
.panel > summary::before{content:"▸ ";color:var(--muted)}
.panel[open] > summary::before{content:"▾ "}
details.panel[open] > summary{margin-bottom:1rem}
.panel--danger{border-color:#f0c4bf}
.panel--sticky{position:sticky;top:1rem}
.stack{display:grid;gap:.9rem}
.stack--tight{gap:.4rem}
.wide{max-width:900px}.narrow{max-width:560px}
.row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.row--between{justify-content:space-between}
.inline{display:inline-flex;gap:.35rem;margin:0}
.cols{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.cols--3{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
label{display:grid;gap:.3rem;font-weight:500;font-size:.92rem}
label.check{display:flex;align-items:center;gap:.5rem;font-weight:400}
fieldset{border:0;padding:0;margin:0;display:grid;gap:.5rem}
legend{font-weight:600;margin-bottom:.4rem}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=url],input[type=tel],select,textarea{font:inherit;font-weight:400;width:100%;padding:.5rem .65rem;border:1px solid var(--line-strong);border-radius:6px;background:#fff;color:var(--ink)}
textarea{resize:vertical}
textarea.code{font-family:var(--mono);font-size:13px;line-height:1.5;background:#1e2428;color:#e6edf0;border-color:#1e2428;tab-size:4;white-space:pre}
.row input[type=text],.row select{width:auto;flex:1 1 200px}
.inline-checks{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem}
.prefix-field{display:flex;align-items:stretch}
.prefix-field span{display:grid;place-items:center;padding:0 .6rem;background:#eef0ec;border:1px solid var(--line-strong);border-right:0;border-radius:6px 0 0 6px;color:var(--muted);font-family:var(--mono);font-size:.85rem}
.prefix-field input{border-radius:0 6px 6px 0}
.color-field{display:flex;gap:.4rem}
.color-field input[type=color]{width:2.6rem;height:2.4rem;padding:2px;border:1px solid var(--line-strong);border-radius:6px;background:#fff}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.5rem .95rem;border:1px solid var(--line-strong);border-radius:6px;background:#fff;color:var(--ink);font:inherit;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{border-color:var(--ink)}
.btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn--primary:hover{background:#0b5643;border-color:#0b5643}
.btn--danger{color:var(--danger);border-color:#e7b3ad}
.btn--danger:hover{background:var(--danger-soft);border-color:var(--danger)}
.btn--ghost{border-color:transparent;background:transparent}
.btn--small{padding:.25rem .6rem;font-size:.85rem;font-weight:500}
.btn[disabled]{opacity:.4;cursor:default}

/* Feedback */
.flash{padding:.7rem 1rem;border-radius:6px;margin:0 0 1rem;border:1px solid transparent}
.flash--success{background:var(--accent-soft);border-color:#b8dccd}
.flash--error{background:var(--danger-soft);border-color:#f0c4bf;color:#7a1a12}
.flash--info{background:var(--info-soft);border-color:#c9daf3}
.tag{display:inline-block;font-size:.75rem;font-weight:600;padding:.05rem .45rem;border-radius:99px;background:#eceee9;color:var(--muted);margin-left:.25rem}
.tag--ok{background:var(--accent-soft);color:var(--accent)}
.tag--warn{background:var(--warn-soft);color:#7a5600}
.state{display:inline-block;font-size:.8rem;font-weight:600;padding:.1rem .5rem;border-radius:99px;margin:.1rem .2rem .1rem 0;text-decoration:none;white-space:nowrap}
.state--published{background:var(--accent-soft);color:var(--accent)}
.state--changed{background:var(--warn-soft);color:#7a5600}
.state--draft{background:var(--info-soft);color:#24508f}
.state--empty{background:#eceee9;color:var(--muted)}
.empty{background:var(--panel);border:1px dashed var(--line-strong);border-radius:var(--radius);padding:2rem;text-align:center;color:var(--muted)}
.empty h2{color:var(--ink)}
.empty-row{text-align:center;color:var(--muted);padding:1.5rem!important}

/* Tables */
.table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:1rem}
.table th,.table td{text-align:left;padding:.6rem .8rem;border-bottom:1px solid var(--line);vertical-align:top}
.table th{font-size:.82rem;color:var(--muted);font-weight:600;background:#f8f9f7}
.table tr:last-child td{border-bottom:0}
.table .num{text-align:right;white-space:nowrap}
.table--compact td{padding:.35rem .6rem;font-size:.88rem}
.clip{max-width:360px}
.secret{word-break:break-all;user-select:all}
.kv{display:grid;gap:.35rem;margin:.75rem 0}
.kv div{display:grid;grid-template-columns:110px 1fr;gap:.75rem}
.kv dt{color:var(--muted)}
.kv dd{margin:0}
.submission.is-new{border-left:3px solid var(--accent)}

/* Dashboard */
.site-list{list-style:none;padding:0;margin:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.site-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.site-card__link{display:grid;gap:.2rem;padding:1.1rem 1.25rem;color:var(--ink);text-decoration:none;position:relative}
.site-card__link:hover strong{text-decoration:underline}
.site-card__swatch{position:absolute;top:1.1rem;right:1.25rem;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--sw)}
.site-card__meta{display:grid;grid-template-columns:repeat(3,1fr);margin:0;border-top:1px solid var(--line);font-size:.82rem}
.site-card__meta div{padding:.6rem 1rem}
.site-card__meta dt{color:var(--muted)}
.site-card__meta dd{margin:0}
.choice,.cards{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.choice legend,.cards legend{grid-column:1/-1}
.choice__item,.pick{display:flex;gap:.6rem;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:.85rem;cursor:pointer;font-weight:400}
.choice__item:has(input:checked),.pick:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.choice__item span,.pick span{display:grid;gap:.15rem}
.choice__item small,.pick small{color:var(--muted)}
.cards-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));margin-bottom:1.25rem}
.cards-grid .panel{margin:0}

/* Auth */
.guest{display:grid;place-items:center;min-height:100vh;background:var(--side)}
.auth{width:min(420px,100% - 2rem);background:var(--panel);border-radius:12px;padding:2rem}
.auth__brand{font-size:1.3rem;margin-bottom:1.25rem;display:flex;gap:.5rem;align-items:center}
.auth__brand span{color:var(--accent)}
.auth__lead{color:var(--muted);margin-top:-.5rem}

/* Media */
.media-grid{list-style:none;padding:0;margin:1rem 0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.media-item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.media-item img,.media-item__file{width:100%;aspect-ratio:4/3;object-fit:cover;background:#e8ebe6}
.media-item__file{display:grid;place-items:center;font-weight:700;color:var(--muted)}
.media-item__meta{padding:.75rem;display:grid;gap:.5rem;font-size:.85rem}

/* Page editor */
.page-head--editor{align-items:flex-end}
.locale-tabs{display:flex;gap:.25rem;background:#e4e7e2;padding:.25rem;border-radius:8px}
.locale-tabs a{padding:.3rem .8rem;border-radius:6px;text-decoration:none;color:var(--ink);font-weight:500}
.locale-tabs a.is-active{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.editor-layout{display:grid;gap:1.5rem;grid-template-columns:minmax(0,1fr) 320px;align-items:start}
.editor-extra{max-width:calc(100% - 320px - 1.5rem)}
@media (max-width:1100px){.editor-layout{grid-template-columns:1fr}.editor-extra{max-width:none}.panel--sticky{position:static}}
.status-line{margin:0 0 .75rem}
.editor-side .row{margin-top:.6rem}
.editor-side .row .btn:not(.btn--small){flex:1}
.over{color:var(--danger)}
.block{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.block.is-open{border-color:var(--line-strong);box-shadow:0 2px 8px rgba(20,30,25,.06)}
.block__head{display:flex;align-items:center;gap:.5rem;padding:.35rem .5rem .35rem .25rem}
.block__title{flex:1;display:flex;gap:.75rem;align-items:baseline;min-width:0;text-align:left;background:none;border:0;padding:.5rem .6rem;font:inherit;color:inherit;cursor:pointer;border-radius:6px}
.block__title:hover{background:#f4f6f3}
.block__title .muted{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.88rem}
.block__tools,.list__tools{display:flex;gap:2px}
.block__tools button,.list__tools button{width:2rem;height:2rem;border:1px solid transparent;background:none;border-radius:6px;cursor:pointer;color:var(--muted);font-size:.95rem}
.block__tools button:hover:not([disabled]),.list__tools button:hover:not([disabled]){border-color:var(--line-strong);color:var(--ink)}
.block__tools button[disabled],.list__tools button[disabled]{opacity:.3;cursor:default}
.block__body{padding:.25rem 1rem 1rem;display:grid;gap:.85rem;border-top:1px solid var(--line)}
.block__body > .field:first-child{margin-top:.75rem}
.block--unknown{padding:1rem;color:var(--danger)}
.field{display:grid;gap:.3rem}
.field__label{font-weight:500;font-size:.88rem}
.field--inline{display:flex;align-items:center;gap:.5rem}
.field--inline .field__label{order:2;font-weight:400}
.add-between{display:block;width:100%;height:1.1rem;margin:.15rem 0;border:0;background:none;color:transparent;cursor:pointer;position:relative;font-weight:700}
.add-between:hover,.add-between:focus-visible{color:var(--accent)}
.add-between:hover::before,.add-between:focus-visible::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px dashed var(--accent);z-index:-1}
.add-block{margin-top:1rem;width:100%;border-style:dashed;padding:.9rem}
.list{display:grid;gap:.6rem}
.list__item{border:1px solid var(--line);border-radius:6px;background:#fafbf9}
.list__head{display:flex;justify-content:space-between;align-items:center;padding:.15rem .5rem;border-bottom:1px solid var(--line)}
.list__body{padding:.75rem;display:grid;gap:.7rem}
.image-field{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.image-field img{width:96px;height:72px;object-fit:cover;border-radius:4px;border:1px solid var(--line)}
.rte-wrap{border:1px solid var(--line-strong);border-radius:6px;overflow:hidden;background:#fff}
.rte-bar{display:flex;gap:2px;padding:.25rem;border-bottom:1px solid var(--line);background:#f6f7f5}
.rte-bar button{min-width:2rem;height:1.9rem;border:1px solid transparent;background:none;border-radius:4px;cursor:pointer;font-size:.85rem}
.rte-bar button:hover{border-color:var(--line-strong);background:#fff}
.rte{min-height:7rem;padding:.6rem .75rem;outline:none;line-height:1.6}
.rte:focus{box-shadow:inset 0 0 0 2px #4c9dff}
.rte p{margin:0 0 .6em}
.lint{font-size:.85rem}
.lint--ok{color:var(--accent)}
.lint--error{color:var(--danger);font-family:var(--mono)}
.history{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.history li{display:grid;gap:.15rem;padding-bottom:.5rem;border-bottom:1px solid var(--line);font-size:.88rem}
.history form{margin-top:.25rem}

/* Dialogs (media picker, block palette) */
.picker{width:min(920px,100vw - 2rem);max-height:85vh;border:0;border-radius:12px;padding:0;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.picker::backdrop{background:rgba(20,26,30,.55)}
.picker__head{display:flex;gap:.75rem;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:1}
.picker__head strong{margin-right:auto}
.picker__head input[type=file]{display:none}
.picker__grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));padding:1.25rem}
.picker__item{display:grid;gap:.3rem;border:1px solid var(--line);border-radius:6px;padding:.4rem;background:#fff;cursor:pointer;text-align:left;font:inherit;font-size:.8rem}
.picker__item:hover{border-color:var(--accent)}
.picker__item img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.picker__item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker--blocks h3{margin:1rem 1.25rem .5rem;color:var(--muted);font-size:.85rem}
.block-types{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));padding:0 1.25rem 1rem}
.block-type{display:grid;gap:.2rem;text-align:left;padding:.75rem;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;font:inherit}
.block-type:hover{border-color:var(--accent);background:#f7fbf9}
.block-type small{color:var(--muted);font-size:.82rem}
/* changes proposed by AI (Studio -> Zmiany od AI) */
.side__badge{display:inline-block;min-width:1.4em;padding:0 .4em;margin-left:.35em;border-radius:999px;background:#e8a33d;color:#1f262b;font-size:.75rem;font-weight:700;text-align:center;line-height:1.5}
.change{display:grid;gap:.75rem}
.change__summary{margin:.2rem 0 0;color:var(--muted)}
.change__meta{text-align:right;font-size:.85rem}
.change__diff td{vertical-align:top;white-space:pre-wrap;word-break:break-word}
.change__diff td:first-child{width:24%;font-weight:600}
.change__old{background:var(--danger-soft)}
.change__new{background:var(--accent-soft)}
