:root{
  /* Marka Stories */
  --accent:        #C10021;
  --accent-hover:  #a50a25;
  --accent-soft:   #fbe7ea;

  /* Powierzchnie — szarawe, zbliżone do bieli */
  --bg:            #f4f4f2;
  --surface:       #ffffff;
  --surface-2:     #eeeeec;
  --border:        #e2e1dd;

  /* Tekst */
  --text:          #1c1b1a;
  --text-soft:     #5f5e5a;
  --text-mute:     #8a8983;

  --radius:        12px;
  --maxw:          1100px;
  --font-ui:       system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-ui);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}

/* Topbar */
.topbar{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:24px;
  height:60px;padding:0 20px;
  background:var(--surface);
  border-bottom:1px solid var(--border);
}
.brand{display:flex;align-items:center;gap:9px;font-weight:600}
.brand-mark{
  display:grid;place-items:center;
  width:30px;height:30px;border-radius:8px;
  background:var(--accent);color:#fff;font-weight:700;
}
.brand-name{font-size:18px;letter-spacing:.2px}
.topnav{display:flex;gap:18px;margin-left:8px}
.topnav a{color:var(--text-soft);font-size:15px}
.topnav a:hover{color:var(--text)}
.account{margin-left:auto;display:flex;align-items:center;gap:12px}
.hello{color:var(--text-soft);font-size:14px}

.btn-accent{
  background:var(--accent);color:#fff;
  padding:8px 16px;border-radius:999px;font-size:14px;font-weight:500;
}
.btn-accent:hover{background:var(--accent-hover)}

/* Layout */
.app-main{max-width:var(--maxw);margin:0 auto;padding:32px 20px 64px}
.app-footer{
  max-width:var(--maxw);margin:0 auto;padding:24px 20px 48px;
  color:var(--text-mute);font-size:13px;
}

/* Placeholder discover */
.hero{
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:40px;text-align:center;
}
.hero h1{margin:0 0 8px;font-size:28px}
.hero p{margin:0;color:var(--text-soft)}
.pill{
  display:inline-block;margin-top:20px;padding:6px 14px;border-radius:999px;
  background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:500;
}