:root{
  --red:#9D1F23; --cab:#5E1719; --sand:#F7F3EC; --champ:#E7DCCB; --lime:#C7BBAA; --olive:#6F7A55; --black:#1C1A18;
  --ink:#1C1A18; --muted:#6b645b; --line:#e3dacb; --card:#fffdf9; --bg:#F7F3EC;
  --ok:#4f7a3a; --warn:#b7791f; --err:#9D1F23;
  --head:'Century Gothic','URW Gothic','URW Gothic L','Questrial',system-ui,sans-serif;
  --body:Arial,'Liberation Sans',Helvetica,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 var(--body)}
a{color:var(--red)}
h1,h2,h3{font-family:var(--head);font-weight:400;letter-spacing:.03em;margin:0 0 .6em}
h1{font-size:22px;text-transform:uppercase}
h2{font-size:17px;text-transform:uppercase}
h3{font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
button,.btn{font:inherit;font-size:14px;border:1px solid var(--black);background:var(--black);color:var(--sand);
  padding:8px 14px;border-radius:2px;cursor:pointer;text-decoration:none;display:inline-block;line-height:1.2}
button.secondary,.btn.secondary{background:transparent;color:var(--ink)}
button.red{background:var(--red);border-color:var(--red)}
button.small{padding:4px 9px;font-size:12px}
button:disabled{opacity:.45;cursor:default}
input,select,textarea{font:inherit;border:1px solid var(--line);background:#fff;border-radius:2px;padding:8px 10px;width:100%;color:var(--ink)}
textarea{min-height:70px;resize:vertical}
label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:12px 0 4px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grow{flex:1}
.muted{color:var(--muted)}
.small{font-size:12px}
.err{color:var(--err)}

/* nav */
.top{display:flex;align-items:center;gap:18px;padding:10px 20px;background:var(--black);color:var(--sand);position:sticky;top:0;z-index:20}
.top .logo{height:26px;display:block}
.top nav{display:flex;gap:4px;flex-wrap:wrap}
.top nav a{color:var(--sand);text-decoration:none;font-family:var(--head);text-transform:uppercase;letter-spacing:.1em;font-size:12px;padding:6px 10px;border-radius:2px}
.top nav a.on,.top nav a:hover{background:rgba(247,243,236,.14)}
.top .me{margin-left:auto;font-size:12px;opacity:.85}
.top .me a{color:var(--sand)}
main{padding:20px}

/* badges */
.badge{display:inline-block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:2px 6px;border-radius:2px;border:1px solid var(--line);background:#fff;color:var(--muted);white-space:nowrap}
.st-draft{background:#fff;color:var(--muted)}
.st-preapproved{background:#f6e7c9;border-color:#e4c98f;color:#7a5a12}
.st-approved{background:#dfe8d4;border-color:#b9cba3;color:#36532a}
.st-published{background:var(--black);border-color:var(--black);color:var(--sand)}
.or-ai{background:#e9e1f3;border-color:#cfc0e4;color:#4c3a6b}
.chip{display:inline-block;background:var(--red);color:var(--sand);font-family:var(--head);font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:3px 7px}
.warn{color:var(--warn);font-size:12px}

/* board */
.board{display:flex;gap:14px;overflow-x:auto;padding-bottom:20px;align-items:flex-start}
.col{flex:0 0 270px;background:#efe8db;border-radius:3px;padding:10px;max-height:calc(100vh - 150px);display:flex;flex-direction:column}
.col-head{border-left:4px solid var(--red);padding-left:8px;margin-bottom:8px;cursor:pointer}
.col-head .code{font-family:var(--head);font-size:11px;letter-spacing:.14em;color:var(--muted)}
.col-head .name{font-family:var(--head);text-transform:uppercase;letter-spacing:.05em;font-size:15px}
.col-head .sub{font-size:12px;color:var(--muted)}
.col-items{overflow-y:auto;min-height:40px;flex:1}
.card{background:var(--card);border:1px solid var(--line);border-radius:3px;margin-bottom:8px;display:flex;gap:8px;padding:6px;cursor:grab;text-decoration:none;color:inherit}
.card:hover{border-color:var(--lime)}
.thumb{flex:0 0 54px;height:96px;background:#e8e0d2 center/cover no-repeat;border-radius:2px;position:relative}
.thumb.feed{height:68px}
.thumb .spin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--muted)}
.card .meta{flex:1;min-width:0}
.card .ep{font-family:var(--head);font-size:11px;letter-spacing:.1em;color:var(--muted)}
.card .hl{font-size:13px;line-height:1.25;margin:2px 0 4px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.card .when{font-size:11px;color:var(--muted)}
.ghost{opacity:.4}
.add-item{width:100%;margin-top:6px}

/* calendar */
.cal-wrap{display:flex;gap:16px;align-items:flex-start}
.tray{flex:0 0 260px;background:#efe8db;padding:10px;border-radius:3px;max-height:calc(100vh - 130px);overflow-y:auto}
.tray .card{cursor:grab}
#cal{flex:1;background:#fff;padding:10px;border-radius:3px;min-width:0}
.fc .fc-event{border:none;border-left:4px solid var(--red);background:#faf6ef;color:var(--ink);padding:1px 3px;font-size:11px;cursor:pointer}
.fc .fc-event .ev-code{font-family:var(--head);letter-spacing:.08em;font-weight:700}
.fc .fc-toolbar-title{font-family:var(--head);text-transform:uppercase;font-size:17px;letter-spacing:.05em}
.fc .fc-button{background:var(--black);border-color:var(--black);font-size:12px}
.fc .fc-button-primary:not(:disabled).fc-button-active{background:var(--red);border-color:var(--red)}

/* item editor */
.editor{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:24px;align-items:start}
.preview{position:sticky;top:70px}
.preview .frame{background:#e8e0d2;border-radius:4px;overflow:hidden;position:relative}
.preview img,.preview video{width:100%;display:block}
.preview .state{position:absolute;top:8px;right:8px}
.slides{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.slide{width:64px;position:relative}
.slide img{width:64px;height:80px;object-fit:cover;border-radius:2px;display:block;border:2px solid transparent;cursor:pointer}
.slide.on img{border-color:var(--red)}
.slide .x{position:absolute;top:-6px;right:-6px;background:var(--black);color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px;line-height:18px;text-align:center;cursor:pointer}
.panel{background:var(--card);border:1px solid var(--line);border-radius:3px;padding:16px;margin-bottom:16px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.statusbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.flow{display:flex;gap:4px;align-items:center;font-size:12px}
.flow span{padding:4px 8px;border:1px solid var(--line);border-radius:2px;background:#fff}
.flow span.on{background:var(--black);color:var(--sand);border-color:var(--black)}
.log{font-size:12px;color:var(--muted);max-height:220px;overflow:auto}
.comment{border-top:1px solid var(--line);padding:6px 0;font-size:13px}

/* grid preview */
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;max-width:600px;background:#fff;padding:3px}
.ig-grid a{aspect-ratio:4/5;background:#e8e0d2 center/cover no-repeat;position:relative;display:block}
.ig-grid a .b{position:absolute;bottom:4px;left:4px}

/* tables/forms */
table{border-collapse:collapse;width:100%;background:var(--card)}
th,td{border-bottom:1px solid var(--line);padding:8px;text-align:left;font-size:13px;vertical-align:top}
th{font-family:var(--head);font-weight:400;text-transform:uppercase;letter-spacing:.06em;font-size:11px;color:var(--muted)}
.auth{max-width:380px;margin:9vh auto;background:var(--card);border:1px solid var(--line);padding:28px}
.auth .logo{display:block;width:150px;margin:0 auto 18px}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--black);color:var(--sand);padding:10px 16px;border-radius:3px;z-index:99;font-size:14px;max-width:90vw}
.toast.err{background:var(--red)}
dialog{border:1px solid var(--line);border-radius:3px;padding:20px;max-width:480px;width:92vw;background:var(--card)}
dialog::backdrop{background:rgba(28,26,24,.4)}
code.copy{display:block;background:#fff;border:1px solid var(--line);padding:8px;word-break:break-all;font-size:12px}

@media (max-width:820px){
  main{padding:12px}
  .editor{grid-template-columns:1fr}
  .preview{position:static}
  .cal-wrap{flex-direction:column}
  .tray{flex:none;width:100%;max-height:220px}
  .grid2{grid-template-columns:1fr}
  .top{gap:8px;padding:8px 12px}
  .top .me{display:none}
}
