:root{
  --canvas:#F4F2FA;
  --white:#fff;
  --ink:#17132E;
  --ink-2:#5B5578;
  --line:#E3DFF2;
  --violet:#5B3DF5;
  --aqua:#06B6A9;
  --coral:#FF5A46;
  --amber:#FFB627;
  --ease:cubic-bezier(.22,.72,.2,1);
  --r:18px;
}

*,*::before,*::after{box-sizing:border-box}
body{
  margin:0;background:var(--canvas);color:var(--ink);
  font-family:"Manrope",system-ui,sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
:focus-visible{outline:2px solid var(--violet);outline-offset:2px}
button{font:inherit;cursor:pointer}

/* ---------- bar ---------- */
.bar{position:sticky;top:0;z-index:20;background:rgba(244,242,250,.9);backdrop-filter:blur(12px)}
.bar-inner{width:min(100% - 2rem,1180px);margin-inline:auto;display:flex;align-items:center;gap:.7rem;padding:.9rem 0;flex-wrap:wrap}
.back{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--ink);font-weight:700}
.chip{width:20px;height:20px;border-radius:7px;background:linear-gradient(140deg,var(--violet),var(--coral) 70%,var(--amber));box-shadow:inset 0 0 0 3px rgba(255,255,255,.85)}
.crumb{font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);padding-left:.6rem;border-left:1px solid var(--line);margin-right:auto}
.bar-inner form{margin:0}

.solid{background:var(--ink);color:#fff;border:0;border-radius:999px;padding:.7rem 1.4rem;font-weight:700;font-size:.92rem;transition:background .2s;text-decoration:none;display:inline-block}
.solid:hover{background:var(--violet)}
.ghost{background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:.5rem 1rem;font-weight:600;font-size:.86rem;text-decoration:none;display:inline-block;transition:border-color .2s}
.ghost:hover{border-color:var(--ink)}
.ghost b{color:var(--coral)}
.sm{padding:.38rem .85rem;font-size:.8rem}
.danger:hover{border-color:var(--coral);color:var(--coral)}

.banner{
  width:min(100% - 2rem,1180px);margin:.2rem auto 1.6rem;
  font-size:.86rem;color:var(--ink-2);
  background:rgba(91,61,245,.07);border-left:3px solid var(--violet);
  border-radius:0 12px 12px 0;padding:.7rem 1rem;
}
.banner a{color:var(--violet);font-weight:700}

.page{width:min(100% - 2rem,1180px);margin-inline:auto;padding-bottom:4rem}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:2.5rem;align-items:start}
.queues{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.6rem;align-items:start}

.title{
  font-family:"Bricolage Grotesque",sans-serif;font-weight:700;
  font-size:1.5rem;letter-spacing:-.025em;margin:0 0 .3rem;
  display:flex;align-items:center;gap:.6rem;
}
.count{
  font-family:"JetBrains Mono",monospace;font-size:.7rem;font-weight:600;
  background:var(--ink);color:#fff;border-radius:999px;padding:.15rem .55rem;
}
.sub{color:var(--ink-2);font-size:.9rem;margin:0 0 1.2rem}
.empty{color:var(--ink-2);font-size:.9rem;background:var(--white);border:1px dashed var(--line);border-radius:var(--r);padding:1rem;margin:0}

/* ---------- form ---------- */
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem;box-shadow:0 16px 38px -30px rgba(23,19,46,.6)}
.field{margin-bottom:.9rem}
.field label{display:block;font-size:.82rem;font-weight:700;margin-bottom:.35rem}
.field label span{font-weight:400;color:var(--ink-2)}
.field input,.field textarea{
  width:100%;font:inherit;font-size:.98rem;color:var(--ink);
  background:var(--canvas);border:1px solid var(--line);border-radius:12px;padding:.7rem .85rem;
}
.field textarea{resize:vertical;min-height:110px}
.field input:focus,.field textarea:focus{outline:none;background:var(--white);border-color:var(--violet);box-shadow:0 0 0 3px rgba(91,61,245,.15)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.flash{border-radius:12px;padding:.8rem 1rem;font-size:.9rem;margin:0 0 1.2rem}
.flash.ok{background:rgba(6,182,169,.1);border-left:3px solid var(--aqua);color:#0B5F59}
.flash.bad{background:rgba(255,90,70,.1);border-left:3px solid var(--coral);color:#96271A;list-style:none;padding-left:1.6rem}
.flash.bad li{margin-left:0}
.flash a{color:var(--violet);font-weight:700}

.protects{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.4rem}
.protects li{position:relative;padding-left:1.2rem;font-size:.86rem;color:var(--ink-2)}
.protects li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--aqua)}

/* ---------- entries ---------- */
.entries{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.entry,.mod{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:1.1rem 1.2rem;
}
.mod{margin-bottom:.9rem}
.entry-head{display:flex;align-items:center;gap:.7rem;margin-bottom:.6rem}
.avatar{
  width:38px;height:38px;flex:0 0 auto;border-radius:50%;
  display:grid;place-items:center;
  font-weight:700;font-size:1rem;color:#fff;
  background:hsl(var(--seed,265) 62% 55%);
}
.entry-name{margin:0;font-weight:700;font-size:.98rem}
.entry-name a{color:var(--violet);text-decoration:none}
.entry-name a:hover{text-decoration:underline}
.entry-meta{margin:0;font-family:"JetBrains Mono",monospace;font-size:.62rem;color:var(--ink-2);letter-spacing:.02em}
.entry-body{margin:0;font-size:.95rem;overflow-wrap:anywhere}
.entry-reply{
  margin:.8rem 0 0;padding:.7rem .9rem;font-size:.9rem;
  background:rgba(91,61,245,.06);border-left:3px solid var(--violet);border-radius:0 10px 10px 0;
}

.mod-acts{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.9rem}
.mod-acts form{margin:0}
.reply-form{display:flex;gap:.4rem;margin-top:.6rem}
.reply-form input{
  flex:1;font:inherit;font-size:.85rem;background:var(--canvas);
  border:1px solid var(--line);border-radius:999px;padding:.45rem .85rem;color:var(--ink);
}
.reply-form input:focus{outline:none;border-color:var(--violet);background:var(--white)}

.foot{border-top:1px solid var(--line);padding:1.5rem 0;text-align:center}
.foot p{margin:0;font-size:.85rem;color:var(--ink-2)}
.foot a{color:var(--violet);font-weight:700}

@media (max-width:820px){
  .split{grid-template-columns:1fr;gap:2rem}
  .row{grid-template-columns:1fr}
  .crumb{display:none}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms!important}
}
