/* Język wizualny konkursu: stonowane, ramki 1px, beż/szarość, bez ikon/bold/kolorów.
   Hierarchia: odstęp, rozmiar, odcień szarości. To szkielet (0a) — do rozwinięcia. */
:root{
  --ink:#2a2a28; --soft:#6f6f69; --faint:#9a988f;
  --line:#e3e1d8; --paper:#faf8f2; --card:#fff; --hl:#f1efe7;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.5; font-size:16px;
}
.wrap{max-width:900px;margin:0 auto;padding:18px 16px 60px}
/* Zakładki — podkreślenie (styl „Kafelki / Lista" w Rambulo). Bez bold, bez koloru. */
.tabs{display:flex;gap:20px;align-items:center;border-bottom:1px solid var(--line);margin-bottom:20px}
.tabs button{border:none;background:none;color:var(--soft);
  padding:9px 1px;font-size:14px;cursor:pointer;font-family:inherit;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .15s,border-color .15s}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--soft)}
.help{float:right;border:1px solid var(--line);background:var(--card);border-radius:50%;
  width:28px;height:28px;color:var(--soft);cursor:pointer}
.panel{padding:18px 2px}
.foot{margin-top:30px;border-top:1px solid var(--line);padding-top:10px;
  font-size:12.5px;color:var(--faint)}
.foot a{color:var(--soft)}
.foot-sep{margin:0 4px}
[hidden]{display:none !important}

/* --- Logowanie — stonowane, bez ciężkich przycisków --- */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.login-card{width:100%;max-width:300px;text-align:center}
.login-logo{width:56px;height:56px;border-radius:13px;border:1px solid var(--line)}
.login-card h1{font-size:17px;font-weight:500;margin:14px 0 26px;color:var(--ink)}
.login-step{display:flex;flex-direction:column;gap:9px;text-align:left}
.login-step label{font-size:12.5px;color:var(--soft)}
.login-step input{border:1px solid var(--line);background:var(--card);border-radius:9px;
  padding:11px 12px;font-size:16px;color:var(--ink);width:100%}
.login-step input:focus{outline:none;border-color:var(--soft)}
#pin{letter-spacing:5px;text-align:center;font-size:20px}
.login-step button[type="submit"]{border:1px solid var(--faint);background:var(--hl);
  color:var(--ink);border-radius:9px;padding:10px 12px;font-size:14px;cursor:pointer;margin-top:4px}
.login-step button[type="submit"]:hover{background:var(--line)}
.login-step button[type="submit"]:disabled{opacity:.5;cursor:default}
.login .link{border:none;background:none;color:var(--soft);font-size:12.5px;cursor:pointer;
  padding:6px 2px;align-self:center}
.login-hint,.login-sent{font-size:12px;color:var(--faint);margin:2px 0 0}
.login-sent{color:var(--soft)}
.login-sent span{color:var(--ink)}
.login-msg{min-height:18px;font-size:12.5px;margin:12px 0 0;color:var(--soft)}
.login-msg.err{color:#9a3b34}

/* --- Moje zdjęcia --- */
.muted{color:var(--faint)}
.link{border:none;background:none;color:var(--soft);cursor:pointer;font-size:13px;
  font-family:inherit;padding:0;text-decoration:underline;text-underline-offset:2px;
  text-decoration-color:var(--line)}
.link:hover{color:var(--ink)}

.userbar{padding-bottom:10px;border-bottom:1px solid var(--line)}
.userbar-name{font-size:15px;color:var(--ink)}
.userbar-mail{font-size:13px;color:var(--soft)}
.counters{font-size:12.5px;color:var(--soft);margin:10px 0 16px}

details.cat{border:1px solid var(--line);border-radius:10px;background:var(--card);
  margin-bottom:10px;overflow:hidden}
details.cat>summary{list-style:none;cursor:pointer;padding:11px 14px;display:flex;
  align-items:center;justify-content:space-between;font-size:14px;color:var(--ink)}
details.cat>summary::-webkit-details-marker{display:none}
.cat-count{font-size:12.5px;color:var(--faint)}
.cat-body{padding:4px 14px 14px;border-top:1px solid var(--line)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:12px 0}
.thumb{margin:0;border:1px solid var(--line);border-radius:8px;padding:6px;background:var(--paper);
  display:flex;flex-direction:column;gap:5px}
.thumb img{width:100%;height:104px;object-fit:cover;border-radius:5px;background:var(--hl);display:block}
.thumb figcaption{font-size:12px;color:var(--soft);line-height:1.3;min-height:16px}
.thumb .del{align-self:flex-start;font-size:12px}

.upload{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:6px}
.up-title{border:1px solid var(--line);background:var(--card);border-radius:8px;
  padding:8px 10px;font-size:13px;color:var(--ink);flex:1;min-width:160px}
.up-title:focus{outline:none;border-color:var(--soft)}
.up-pick{font-size:13px;white-space:nowrap}
.up-status{font-size:12.5px}
.cat-full{margin:10px 0 2px}