/* Rankrix Projects — dark glass UI */
:root{
  --bg:#03040a;--blue:#0057ff;--blue2:#0a63ff;--ink:#fff;
  --muted:rgba(255,255,255,.62);--faint:rgba(255,255,255,.4);
  --line:rgba(255,255,255,.09);--panel:rgba(255,255,255,.04);--glass:rgba(255,255,255,.05);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body.rkp{
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);
  background:
    radial-gradient(1200px 700px at 88% -10%,rgba(0,87,255,.18),transparent 60%),
    radial-gradient(900px 600px at -8% 110%,rgba(0,87,255,.12),transparent 55%),
    var(--bg);
  overflow:hidden;
}
.rkp-app{display:grid;grid-template-columns:248px 1fr;height:100vh}
.rkp-boot{display:flex;align-items:center;gap:10px;justify-content:center;height:100vh;color:var(--muted);font-size:14px}
.rkp-boot__spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.18);border-top-color:var(--blue);border-radius:50%;animation:rkp-spin .7s linear infinite}
@keyframes rkp-spin{to{transform:rotate(360deg)}}

/* sidebar */
.rkp-side{display:flex;flex-direction:column;border-right:1px solid var(--line);padding:18px 14px;background:rgba(8,10,18,.5);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.rkp-brand{font-weight:800;font-size:18px;letter-spacing:-.01em;padding:0 8px 6px}
.rkp-brand span{color:var(--blue)}
.rkp-brand em{display:block;font-style:normal;font-size:11px;font-weight:600;color:var(--faint);letter-spacing:.18em;text-transform:uppercase;margin-top:2px}
.rkp-side__lbl{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:18px 8px 8px}
.rkp-side__list{display:flex;flex-direction:column;gap:2px;overflow-y:auto;flex:1}
.rkp-proj{display:flex;align-items:center;gap:10px;padding:9px 10px;border:none;background:none;border-radius:10px;color:var(--muted);font-family:inherit;font-weight:600;font-size:14px;cursor:pointer;text-align:left;transition:background .15s,color .15s,transform .15s}
.rkp-proj:hover{background:rgba(255,255,255,.05);color:#fff;transform:translateX(2px)}
.rkp-proj.is-active{background:rgba(0,87,255,.16);color:#fff}
.rkp-proj__dot{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.rkp-proj__name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-side__empty,.rkp-muted{color:var(--faint);font-size:13px}
.rkp-side__new{margin-top:10px;background:var(--glass);border:1px solid var(--line);color:#fff;border-radius:10px;padding:10px;font-family:inherit;font-weight:600;font-size:13px;cursor:pointer;transition:background .15s,transform .15s}
.rkp-side__new:hover{background:rgba(0,87,255,.16);transform:translateY(-1px)}
.rkp-side__foot{display:flex;align-items:center;gap:9px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.rkp-side__me{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.rkp-side__out{font-size:12px;color:var(--faint);text-decoration:none}
.rkp-side__out:hover{color:#7fb0ff}

/* avatars */
.rkp-av{width:26px;height:26px;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;font-weight:700;color:#fff;background:var(--blue2);box-shadow:0 0 0 2px rgba(255,255,255,.08);flex-shrink:0}
.rkp-av--me{background:linear-gradient(135deg,#0a63ff,#0047d6)}

/* main */
.rkp-main{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.rkp-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 26px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.rkp-top__head{display:flex;align-items:center;gap:11px}
.rkp-top__head h1{font-size:22px;font-weight:800;letter-spacing:-.02em}
.rkp-top__edit{background:none;border:1px solid var(--line);color:var(--muted);border-radius:8px;width:32px;height:32px;cursor:pointer;font-size:14px;transition:background .15s,transform .15s}
.rkp-top__edit:hover{color:#fff;background:rgba(255,255,255,.06);transform:rotate(45deg)}
.rkp-top__tools{display:flex;align-items:center;gap:10px}
.rkp-seg{display:flex;gap:2px;background:var(--glass);border:1px solid var(--line);border-radius:9px;padding:3px}
.rkp-seg button{padding:7px 14px;border:none;background:none;color:var(--muted);font-family:inherit;font-weight:600;font-size:13px;border-radius:7px;cursor:pointer}
.rkp-seg button.on{background:rgba(0,87,255,.2);color:#fff}
.rkp-filter{background:var(--glass);border:1px solid var(--line);color:#fff;border-radius:9px;padding:8px 11px;font-family:inherit;font-size:13px;outline:none}
.rkp-btn{background:linear-gradient(135deg,#0a63ff,#0047d6);border:none;color:#fff;font-family:inherit;font-weight:700;font-size:13px;padding:10px 18px;border-radius:10px;cursor:pointer;transition:transform .14s,filter .14s;box-shadow:0 10px 24px -12px rgba(0,87,255,.8)}
.rkp-btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.rkp-btn--sm{padding:8px 14px;font-size:12px}
.rkp-btn--danger{background:rgba(220,38,38,.16);border:1px solid rgba(220,38,38,.4);color:#fca5a5;box-shadow:none}
.rkp-btn--danger:hover{background:rgba(220,38,38,.26)}

.rkp-viewport{flex:1;overflow:auto;padding:22px 26px}

/* board */
.rkp-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,1fr);gap:16px;height:100%;align-items:start}
.rkp-col{background:var(--panel);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;max-height:100%;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.rkp-col__head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;font-weight:700;font-size:13px;letter-spacing:.02em}
.rkp-col__count{font-size:11px;color:var(--faint);background:rgba(255,255,255,.06);border-radius:999px;padding:2px 8px}
.rkp-col__body{flex:1;overflow-y:auto;padding:0 12px 4px;display:flex;flex-direction:column;gap:10px;min-height:40px;transition:background .15s}
.rkp-col__body.is-over{background:rgba(0,87,255,.08);outline:2px dashed rgba(0,87,255,.4);outline-offset:-6px;border-radius:10px}
.rkp-col__add{margin:8px 12px 12px;background:none;border:1px dashed var(--line);color:var(--faint);border-radius:9px;padding:9px;font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:color .15s,border-color .15s}
.rkp-col__add:hover{color:#fff;border-color:rgba(0,87,255,.5)}

.rkp-card{position:relative;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:12px;padding:13px 14px 12px;cursor:grab;transition:transform .14s,border-color .14s,background .14s;overflow:hidden}
.rkp-card:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.4);background:rgba(255,255,255,.07)}
.rkp-card.is-drag{opacity:.4}
.rkp-card__pr{position:absolute;left:0;top:0;bottom:0;width:3px}
.rkp-pr--low{background:#56c08a}.rkp-pr--medium{background:#f5b73c}.rkp-pr--high{background:#fb7185}.rkp-pr--urgent{background:#dc2626}
.rkp-card__title{font-size:14px;font-weight:600;line-height:1.4;margin-bottom:10px}
.rkp-card__meta{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:26px}
.rkp-card__due{font-size:11px;font-weight:700;color:var(--muted);background:rgba(255,255,255,.06);padding:3px 8px;border-radius:6px}
.rkp-card__due.is-over{color:#fca5a5;background:rgba(220,38,38,.16)}

/* list */
.rkp-listwrap{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.rkp-list{width:100%;border-collapse:collapse}
.rkp-list th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:700;padding:13px 18px;border-bottom:1px solid var(--line)}
.rkp-list td{padding:13px 18px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
.rkp-list tr:last-child td{border-bottom:none}
.rkp-list tbody tr{cursor:pointer;transition:background .14s}
.rkp-list tbody tr:hover{background:rgba(0,87,255,.07)}
.rkp-lt__title{display:flex;align-items:center;gap:10px;font-weight:600}
.rkp-lt__title .rkp-card__pr{position:static;width:8px;height:8px;border-radius:50%}
.rkp-lt__who{font-size:13px;color:var(--muted);margin-left:4px}
.rkp-badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px}
.rkp-st--todo{background:rgba(255,255,255,.08);color:var(--muted)}
.rkp-st--doing{background:rgba(0,87,255,.16);color:#9ec2ff}
.rkp-st--review{background:rgba(245,183,60,.16);color:#f7cf7a}
.rkp-st--done{background:rgba(24,200,120,.16);color:#74e2a7}
.rkp-over{color:#fca5a5}

/* empty */
.rkp-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;color:var(--muted)}
.rkp-empty h2{font-size:24px;font-weight:800;color:#fff}
.rkp-empty p{max-width:360px;font-size:14px}
.rkp-empty .rkp-btn{margin-top:8px}

/* drawer */
.rkp-drawer-scrim{position:fixed;inset:0;background:rgba(3,4,10,.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .25s;z-index:40}
.rkp-drawer-scrim.open{opacity:1;pointer-events:auto}
.rkp-drawer{position:fixed;top:0;right:0;height:100vh;width:480px;max-width:94vw;background:rgba(12,14,22,.82);border-left:1px solid var(--line);backdrop-filter:blur(22px) saturate(1.2);-webkit-backdrop-filter:blur(22px) saturate(1.2);box-shadow:-40px 0 90px -30px rgba(0,0,0,.7);transform:translateX(100%);transition:transform .32s cubic-bezier(.22,1,.36,1);z-index:50;display:flex;flex-direction:column;padding:24px;overflow-y:auto}
.rkp-drawer.open{transform:none}
.rkp-drawer__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.rkp-drawer__eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700}
.rkp-drawer__x{background:none;border:none;color:var(--faint);font-size:18px;cursor:pointer}
.rkp-drawer__x:hover{color:#fff}
.rkp-drawer__title{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:11px;color:#fff;font-family:inherit;font-size:18px;font-weight:700;padding:12px 14px;outline:none;margin-bottom:16px;transition:border-color .14s,box-shadow .14s}
.rkp-drawer__title:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}
.rkp-drawer__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.rkp-drawer__grid label{display:flex;flex-direction:column;gap:5px;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);font-weight:700}
.rkp-drawer__grid select,.rkp-drawer__grid input{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:9px;color:#fff;font-family:inherit;font-size:14px;padding:10px 12px;outline:none;transition:border-color .14s,box-shadow .14s}
.rkp-drawer__grid select:focus,.rkp-drawer__grid input:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}
.rkp-drawer__lbl{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);font-weight:700;margin-bottom:6px;display:block}
.rkp-drawer__desc{width:100%;min-height:96px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:11px;color:#fff;font-family:inherit;font-size:14px;line-height:1.6;padding:12px 14px;outline:none;resize:vertical;transition:border-color .14s,box-shadow .14s}
.rkp-drawer__desc:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}
.rkp-drawer__actions{display:flex;gap:10px;margin-top:18px}
.rkp-sws{display:flex;gap:8px;margin-bottom:16px}
.rkp-sw{width:28px;height:28px;border-radius:8px;border:2px solid transparent;cursor:pointer;transition:transform .14s}
.rkp-sw:hover{transform:scale(1.1)}
.rkp-sw.on{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.15)}

/* comments */
.rkp-comments{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}
.rkp-comments__list{display:flex;flex-direction:column;gap:12px;max-height:260px;overflow-y:auto;margin-bottom:12px}
.rkp-comment{display:flex;gap:10px}
.rkp-comment__who{font-size:12px;font-weight:700;margin-bottom:2px}
.rkp-comment__who em{font-style:normal;color:var(--faint);font-weight:500;margin-left:6px}
.rkp-comment__body{font-size:13px;color:rgba(255,255,255,.85);line-height:1.55}
.rkp-comments__new{display:flex;gap:8px;align-items:flex-end}
.rkp-comments__new textarea{flex:1;min-height:42px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;color:#fff;font-family:inherit;font-size:13px;padding:10px 12px;outline:none;resize:none}
.rkp-comments__new textarea:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}

/* scrollbars */
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:9px}

/* responsive */
@media(max-width:880px){
  .rkp-app{grid-template-columns:1fr}
  .rkp-side{position:fixed;left:0;top:0;bottom:0;width:240px;z-index:60;transform:translateX(-100%);transition:transform .25s}
  .rkp-board{grid-auto-flow:row;grid-auto-columns:auto}
}

/* ===== v2: home / my work ===== */
.rkp-home-btn{display:flex;align-items:center;gap:9px;width:100%;margin-bottom:6px;padding:10px;border:1px solid var(--line);background:var(--glass);color:#fff;border-radius:10px;font-family:inherit;font-weight:700;font-size:13px;cursor:pointer;transition:background .15s,transform .15s}
.rkp-home-btn:hover{background:rgba(0,87,255,.16);transform:translateY(-1px)}
.rkp-home-btn.is-active{background:rgba(0,87,255,.2)}
.rkp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}
.rkp-stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .15s,border-color .15s}
.rkp-stat:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.35)}
.rkp-stat__n{font-size:26px;font-weight:800}
.rkp-stat__l{font-size:12px;color:var(--muted);margin-top:2px}
.rkp-stat.is-bad .rkp-stat__n{color:#fca5a5}
.rkp-home__group{margin-bottom:22px}
.rkp-home__group h3{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.rkp-home__group h3 span{font-size:11px;background:rgba(255,255,255,.06);border-radius:999px;padding:1px 8px}
.rkp-home__group h3.is-over{color:#fca5a5}
.rkp-home__task{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:13px 15px;margin-bottom:8px;color:#fff;font-family:inherit;cursor:pointer;transition:transform .14s,border-color .14s,background .14s}
.rkp-home__task:hover{transform:translateX(3px);border-color:rgba(0,87,255,.4);background:rgba(255,255,255,.06)}
.rkp-home__title{flex:1;font-weight:600;font-size:14px}
.rkp-home__proj{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.rkp-home__due{font-size:12px;font-weight:700;color:var(--muted);background:rgba(255,255,255,.06);padding:3px 9px;border-radius:7px}

/* ===== v2: chips / mini badges / search ===== */
.rkp-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}
.rkp-chip{font-size:10px;font-weight:700;padding:2px 8px;border-radius:6px;display:inline-flex;align-items:center;gap:5px}
.rkp-chip button{background:none;border:none;color:inherit;cursor:pointer;font-size:11px;opacity:.7;padding:0}
.rkp-chip button:hover{opacity:1}
.rkp-mini{font-size:11px;font-weight:700;color:var(--faint);background:rgba(255,255,255,.05);padding:2px 7px;border-radius:6px}
.rkp-card__metaL{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.rkp-search{background:var(--glass);border:1px solid var(--line);color:#fff;border-radius:9px;padding:8px 12px;font-family:inherit;font-size:13px;outline:none;width:180px;transition:border-color .14s,box-shadow .14s,width .2s}
.rkp-search:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18);width:220px}

/* ===== v2: label toggle chips in drawer ===== */
.rkp-lchips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}
.rkp-lchip{font-size:12px;font-weight:700;padding:6px 12px;border-radius:8px;border:1px solid var(--lc);color:var(--lc);background:transparent;cursor:pointer;font-family:inherit;transition:background .14s,color .14s}
.rkp-lchip.on{background:var(--lc);color:#fff}

/* ===== v2: subtasks / checklist ===== */
.rkp-subs{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.rkp-subs__bar{height:5px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin-bottom:8px}
.rkp-subs__bar span{display:block;height:100%;background:linear-gradient(90deg,#0a63ff,#3b82f6);transition:width .3s}
.rkp-sub{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rkp-sub label{display:flex;align-items:center;gap:9px;font-size:13px;cursor:pointer;flex:1}
.rkp-sub input{width:16px;height:16px;accent-color:#0a63ff}
.rkp-sub span.is-done{text-decoration:line-through;color:var(--faint)}
.rkp-sub__x{background:none;border:none;color:var(--faint);cursor:pointer;font-size:12px}
.rkp-sub__x:hover{color:#fca5a5}
.rkp-subs__new,.rkp-labels__new{display:flex;gap:8px;align-items:center;margin-bottom:16px}
.rkp-subs__new input,.rkp-labels__new input[type=text],.rkp-labels__new input:not([type]),.rkp-labels__new [data-label-new]{flex:1;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:9px;color:#fff;font-family:inherit;font-size:13px;padding:9px 11px;outline:none}
.rkp-labels__new input[type=color]{width:36px;height:36px;border:1px solid var(--line);border-radius:9px;background:none;padding:2px;cursor:pointer}

/* ===== v2: attachments + project label manager ===== */
.rkp-atts{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.rkp-att{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:9px;padding:8px 12px;font-size:13px}
.rkp-att a{color:#9ec2ff;text-decoration:none}
.rkp-att-up{display:inline-block;background:var(--glass);border:1px dashed var(--line);color:var(--muted);border-radius:9px;padding:9px 14px;font-size:12px;font-weight:600;cursor:pointer;margin-bottom:8px;transition:color .15s,border-color .15s}
.rkp-att-up:hover{color:#fff;border-color:rgba(0,87,255,.5)}
.rkp-labels{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}

/* ===== v2: calendar ===== */
.rkp-cal__bar{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.rkp-cal__bar h3{font-size:18px;font-weight:800;min-width:180px;text-align:center}
.rkp-cal__nav{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--glass);color:#fff;font-size:18px;cursor:pointer;transition:background .14s}
.rkp-cal__nav:hover{background:rgba(0,87,255,.16)}
.rkp-cal__today{margin-left:auto;background:var(--glass);border:1px solid var(--line);color:#fff;border-radius:9px;padding:8px 14px;font-family:inherit;font-weight:600;font-size:13px;cursor:pointer}
.rkp-cal__today:hover{background:rgba(0,87,255,.16)}
.rkp-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.rkp-cal__head{margin-bottom:8px}
.rkp-cal__dow{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:700;text-align:center;padding:4px}
.rkp-cal__cell{min-height:104px;background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:8px;display:flex;flex-direction:column;gap:4px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.rkp-cal__cell.is-empty{background:transparent;border:none}
.rkp-cal__cell.is-today{border-color:rgba(0,87,255,.55);box-shadow:0 0 0 1px rgba(0,87,255,.3) inset}
.rkp-cal__num{font-size:12px;font-weight:700;color:var(--muted)}
.rkp-cal__task{text-align:left;border:none;border-radius:6px;padding:4px 7px;font-size:11px;font-weight:600;color:#fff;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:inherit}
.rkp-pr-bg--low{background:rgba(86,192,138,.3)}.rkp-pr-bg--medium{background:rgba(245,183,60,.3)}.rkp-pr-bg--high{background:rgba(251,113,133,.3)}.rkp-pr-bg--urgent{background:rgba(220,38,38,.4)}

@media(max-width:880px){.rkp-stats{grid-template-columns:repeat(2,1fr)}.rkp-cal__grid{gap:4px}.rkp-cal__cell{min-height:72px}}

/* ============================================================
   GALACTIC GLASS THEME
   Fixed galaxy image → blurred layer → dark scrim → glass app
   ============================================================ */
body.rkp{background:#03040a}
body.rkp::before{
  content:"";position:fixed;inset:-40px;z-index:-2;
  background:var(--rkp-bg) center/cover no-repeat;
  filter:blur(10px) saturate(1.05) brightness(.82);
  transform:scale(1.04);
}
body.rkp::after{
  content:"";position:fixed;inset:0;z-index:-1;
  background:
    radial-gradient(1100px 620px at 86% -8%,rgba(0,87,255,.20),transparent 60%),
    radial-gradient(900px 520px at -6% 110%,rgba(0,87,255,.14),transparent 55%),
    linear-gradient(180deg,rgba(3,4,10,.42),rgba(3,4,10,.66));
}
/* let the galaxy show through the shell */
.rkp-side{background:rgba(8,10,18,.46)}
.rkp-col,.rkp-listwrap,.rkp-stat,.rkp-cal__cell{background:rgba(255,255,255,.045)}
.rkp-card{background:rgba(255,255,255,.06)}
.rkp-drawer{background:rgba(10,12,20,.74)}

/* ---- 1px corners on everything (true circles stay round) ---- */
.rkp [class*="rkp-"]{border-radius:1px}
.rkp .rkp-av,.rkp .rkp-av--me,
.rkp .rkp-boot__spin,
.rkp .rkp-proj__dot,
.rkp .rkp-lt__title .rkp-card__pr,
.rkp .rkp-home__task .rkp-card__pr,
.rkp .rkp-sub input{border-radius:50%}
.rkp .rkp-subs__bar,.rkp .rkp-subs__bar span{border-radius:999px}

/* ============================================================
   FULL NAV SHELL + MODULE VIEWS (Workload, Reports, Team, Files)
   ============================================================ */
.rkp-side{display:flex;flex-direction:column}
.rkp-side__scroll{flex:1;overflow-y:auto;margin:0 -6px;padding:0 6px}
.rkp-side__lbl{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:16px 8px 6px}
.rkp-nav{display:flex;align-items:center;gap:11px;width:100%;text-align:left;padding:9px 10px;border:1px solid transparent;background:none;color:var(--muted);font-family:inherit;font-weight:600;font-size:13.5px;cursor:pointer;margin-bottom:1px;transition:background .14s,color .14s,transform .14s}
.rkp-nav:hover{background:rgba(255,255,255,.05);color:#fff;transform:translateX(2px)}
.rkp-nav.is-active{background:rgba(0,87,255,.18);color:#fff;border-color:rgba(0,87,255,.3)}
.rkp-nav__ic{width:18px;text-align:center;opacity:.8;font-size:14px}
.rkp-nav__lbl{flex:1}
.rkp-nav__pro{font-size:9px;font-weight:800;letter-spacing:.04em;color:#9ec2ff;border:1px solid rgba(0,87,255,.5);padding:1px 5px}
.rkp-nav__soon{font-size:10px;color:var(--faint)}
.rkp-side__bottom{border-top:1px solid var(--line);padding-top:8px;margin-top:4px}
.rkp-pin{display:flex;align-items:center;gap:9px;width:100%;min-width:0;box-sizing:border-box;text-align:left;padding:7px 10px;border:none;background:none;color:var(--muted);font-family:inherit;font-size:13px;cursor:pointer;transition:color .14s}
.rkp-pin .rkp-proj__dot{flex:0 0 10px}
.rkp-pin .rkp-proj__name{flex:1;min-width:0}
.rkp-pin:hover{color:#fff}
.rkp-side__foot{display:flex;align-items:center;gap:9px;margin-top:8px;padding-top:10px;border-top:1px solid var(--line)}
.rkp-side__me{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.rkp-side__out{font-size:12px;color:var(--faint);text-decoration:none}
.rkp-side__out:hover{color:#7fb0ff}
.rkp-back{background:none;border:1px solid var(--line);color:var(--muted);font-family:inherit;font-size:12px;font-weight:600;padding:6px 11px;cursor:pointer;margin-right:4px}
.rkp-back:hover{color:#fff;background:rgba(255,255,255,.05)}

.rkp-h3{font-size:13px;font-weight:700;color:var(--muted);margin:22px 0 12px}
.rkp-h3:first-child{margin-top:0}
.rkp-soft{color:var(--faint);font-size:14px;padding:18px 2px}
.rkp-card-panel{background:rgba(255,255,255,.045);border:1px solid var(--line);padding:18px 20px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* projects grid */
.rkp-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-bottom:8px}
.rkp-pcard{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.045);border:1px solid var(--line);padding:13px 14px;color:#fff;font-family:inherit;font-weight:600;font-size:14px;cursor:pointer;text-align:left;transition:transform .14s,border-color .14s}
.rkp-pcard:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.4)}
.rkp-pcard__name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-projgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.rkp-projcard{position:relative;background:rgba(255,255,255,.045);border:1px solid var(--line);padding:18px;text-align:left;color:#fff;font-family:inherit;cursor:pointer;overflow:hidden;transition:transform .15s,border-color .15s}
.rkp-projcard:hover{transform:translateY(-3px);border-color:rgba(0,87,255,.45)}
.rkp-projcard__bar{position:absolute;left:0;top:0;bottom:0;width:4px}
.rkp-projcard__name{font-size:16px;font-weight:800;margin-bottom:6px}
.rkp-projcard__desc{font-size:13px;color:var(--muted);line-height:1.5;min-height:20px;margin-bottom:10px}

/* workload */
.rkp-wl__row{display:grid;grid-template-columns:200px 1fr 36px;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}
.rkp-wl__row:last-child{border-bottom:none}
.rkp-wl__who{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden}
.rkp-wl__track{height:10px;background:rgba(255,255,255,.07);overflow:hidden}
.rkp-wl__fill{height:100%;background:linear-gradient(90deg,#0a63ff,#3b82f6)}
.rkp-wl__n{font-weight:800;text-align:right}
.rkp-wl__tags{grid-column:2/4;display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.rkp-wl__seg{font-size:10px;font-weight:700;padding:2px 7px}

/* reports bars */
.rkp-rep2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}
.rkp-bar{display:grid;grid-template-columns:120px 1fr 48px;align-items:center;gap:12px;margin:9px 0;font-size:13px}
.rkp-bar__lbl{color:var(--muted);display:flex;align-items:center;gap:6px}
.rkp-bar__track{height:12px;background:rgba(255,255,255,.07);overflow:hidden}
.rkp-bar__fill{height:100%;background:linear-gradient(90deg,#0a63ff,#3b82f6)}
.rkp-bar__n{font-weight:700;text-align:right}
.rkp-fill--todo{background:rgba(255,255,255,.3)}.rkp-fill--doing{background:#3b82f6}.rkp-fill--review{background:#f5b73c}.rkp-fill--done{background:#1d9e75}
.rkp-fill--pr-low{background:#56c08a}.rkp-fill--pr-medium{background:#f5b73c}.rkp-fill--pr-high{background:#fb7185}.rkp-fill--pr-urgent{background:#dc2626}

/* files */
.rkp-file{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:12px 4px;color:#fff;font-family:inherit;cursor:pointer}
.rkp-file:hover{background:rgba(255,255,255,.03)}
.rkp-file__name{flex:1;font-weight:600;font-size:14px}
.rkp-file__meta{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}

/* team */
.rkp-teamgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.rkp-teamcard{background:rgba(255,255,255,.045);border:1px solid var(--line);padding:20px;text-align:center;transition:transform .15s,border-color .15s}
.rkp-teamcard:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.4)}
.rkp-teamcard .rkp-av{margin:0 auto 10px}
.rkp-teamcard__name{font-weight:700;font-size:14px}
.rkp-teamcard__n{font-size:12px;color:var(--muted);margin-top:3px}

/* coming soon */
.rkp-coming{height:100%;min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;background:rgba(255,255,255,.03);border:1px dashed var(--line)}
.rkp-coming__badge{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#9ec2ff;border:1px solid rgba(0,87,255,.4);padding:4px 12px;margin-bottom:6px}
.rkp-coming h2{font-size:24px;font-weight:800}
.rkp-coming p{color:var(--muted);font-size:14px;max-width:380px;line-height:1.6}

@media(max-width:880px){.rkp-rep2{grid-template-columns:1fr}.rkp-wl__row{grid-template-columns:140px 1fr 30px}.rkp-bar{grid-template-columns:90px 1fr 40px}}

/* ============================================================
   TIME + INBOX modules
   ============================================================ */
.rkp-timeform{display:grid;grid-template-columns:1.4fr 1.4fr .8fr 1fr 1.6fr auto;gap:10px;align-items:center}
.rkp-timeform select,.rkp-timeform input{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:13px;padding:10px 12px;outline:none}
.rkp-timeform select:focus,.rkp-timeform input:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}
.rkp-trow{display:grid;grid-template-columns:24px 70px 1fr 96px 20px;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.rkp-trow:last-child{border-bottom:none}
.rkp-trow__dur{font-weight:800;color:#9ec2ff}
.rkp-trow__task{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-trow__task em{color:var(--faint);font-style:normal}
.rkp-trow__date{color:var(--muted);text-align:right;font-size:12px}

.rkp-pilln{font-size:11px;background:rgba(0,87,255,.18);color:#9ec2ff;border-radius:999px;padding:1px 8px;font-weight:700;margin-left:4px}
.rkp-inbox__item{display:flex;gap:12px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:13px 4px;color:#fff;font-family:inherit;cursor:pointer;align-items:flex-start}
.rkp-inbox__item:last-child{border-bottom:none}
.rkp-inbox__item:hover{background:rgba(255,255,255,.03)}
.rkp-inbox__item .rkp-card__pr{position:static;width:8px;height:8px;border-radius:50%;margin-top:5px;flex-shrink:0}
.rkp-inbox__body{flex:1;min-width:0}
.rkp-inbox__top{font-size:13px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rkp-inbox__top em{color:var(--faint);font-style:normal;margin-left:auto;font-size:12px}
.rkp-inbox__text{font-size:13px;color:var(--muted);margin-top:3px;line-height:1.5;display:flex;align-items:center;gap:6px}

@media(max-width:880px){.rkp-timeform{grid-template-columns:1fr 1fr}.rkp-trow{grid-template-columns:24px 60px 1fr 20px}.rkp-trow__date{display:none}}

/* ============================================================
   CLIENTS / CRM / INVOICING / NOTEBOOKS / TIMELINE
   ============================================================ */
/* clients */
.rkp-clientgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.rkp-clientcard{background:rgba(255,255,255,.045);border:1px solid var(--line);padding:16px;text-align:left;color:#fff;font-family:inherit;cursor:pointer;transition:transform .15s,border-color .15s}
.rkp-clientcard:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.45)}
.rkp-clientcard__top{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.rkp-clientcard__name{font-weight:700;font-size:15px}
.rkp-clientcard__co{font-size:12px;color:var(--muted)}
.rkp-clientcard__meta{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted)}
.rkp-drawer__grid input,.rkp-drawer__grid select{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:9px;color:#fff;font-family:inherit;font-size:14px;padding:10px 12px;outline:none}

/* crm */
.rkp-deal__val{font-size:15px;font-weight:800;color:#74e2a7;margin:6px 0}
.rkp-deal__client{font-size:12px;color:var(--muted)}

/* invoicing */
.rkp-inv--draft{background:rgba(255,255,255,.08);color:var(--muted)}
.rkp-inv--sent{background:rgba(0,87,255,.16);color:#9ec2ff}
.rkp-inv--paid{background:rgba(24,200,120,.16);color:#74e2a7}
.rkp-inv--overdue{background:rgba(220,38,38,.18);color:#fca5a5}
.rkp-invline{display:grid;grid-template-columns:1fr 70px 90px 80px 22px;gap:8px;align-items:center;margin-bottom:7px}
.rkp-invline input{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:13px;padding:8px 10px;outline:none}
.rkp-invline__amt{font-size:13px;font-weight:700;text-align:right;color:var(--muted)}
.rkp-inv__total{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.rkp-inv__total strong{font-size:20px;color:#fff}

/* notebooks */
.rkp-notegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.rkp-notecard{background:rgba(255,255,255,.045);border:1px solid var(--line);padding:18px;text-align:left;color:#fff;font-family:inherit;cursor:pointer;transition:transform .15s,border-color .15s;min-height:140px;display:flex;flex-direction:column}
.rkp-notecard:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.45)}
.rkp-notecard__title{font-weight:700;font-size:15px;margin-bottom:8px}
.rkp-notecard__body{font-size:13px;color:var(--muted);line-height:1.55;flex:1}
.rkp-notecard__foot{font-size:11px;color:var(--faint);display:flex;align-items:center;gap:6px;margin-top:10px}

/* timeline */
.rkp-tl__axis{display:flex;justify-content:space-between;font-size:11px;color:var(--faint);font-weight:700;padding:0 200px 8px 200px}
.rkp-tl{position:relative}
.rkp-tl::before{content:"";position:absolute;top:0;bottom:0;left:calc(200px + var(--today, 0%) * (100% - 200px) / 100);width:2px;background:rgba(255,90,90,.5);z-index:1}
.rkp-tl__proj{font-size:12px;font-weight:700;color:var(--muted);display:flex;align-items:center;gap:7px;margin:14px 0 6px}
.rkp-tl__row{display:grid;grid-template-columns:200px 1fr;align-items:center;gap:0;margin-bottom:6px}
.rkp-tl__label{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:12px}
.rkp-tl__track{position:relative;height:26px;background:rgba(255,255,255,.04);border-radius:1px}
.rkp-tl__bar{position:absolute;top:3px;height:20px;border-radius:1px;font-size:11px;font-weight:700;color:#fff;display:flex;align-items:center;padding:0 8px;white-space:nowrap;overflow:hidden;cursor:pointer;min-width:24px}
.rkp-tl__bar:hover{filter:brightness(1.15)}

@media(max-width:880px){.rkp-tl__axis{padding:0 0 8px}.rkp-tl__row{grid-template-columns:120px 1fr}.rkp-tl::before{display:none}.rkp-invline{grid-template-columns:1fr 50px 70px 60px 20px}}

/* ============================================================
   MESSAGES / PROOFS / FORMS / AUTOMATIONS + public form
   ============================================================ */
/* messages */
.rkp-thread{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:13px 4px;color:#fff;font-family:inherit;cursor:pointer}
.rkp-thread:last-child{border-bottom:none}
.rkp-thread:hover{background:rgba(255,255,255,.03)}
.rkp-thread__body{flex:1;min-width:0}
.rkp-thread__title{font-weight:700;font-size:14px}
.rkp-thread__meta{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px;margin-top:2px}
.rkp-thread__count{font-size:12px;color:var(--faint);white-space:nowrap}

/* proofs */
.rkp-proofgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.rkp-proofcard{background:rgba(255,255,255,.045);border:1px solid var(--line);overflow:hidden;text-align:left;color:#fff;font-family:inherit;cursor:pointer;transition:transform .15s,border-color .15s}
.rkp-proofcard:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.45)}
.rkp-proof__thumb{height:130px;background-size:cover;background-position:center;background-color:rgba(255,255,255,.04)}
.rkp-proof__thumb--file{display:grid;place-items:center;font-size:38px}
.rkp-proofcard__b{padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.rkp-proofcard__t{font-weight:700;font-size:14px}
.rkp-pst--pending{background:rgba(245,183,60,.16);color:#f7cf7a}
.rkp-pst--changes{background:rgba(251,113,133,.16);color:#fb9bab}
.rkp-pst--approved{background:rgba(24,200,120,.16);color:#74e2a7}
.rkp-proof__big{width:100%;border:1px solid var(--line);margin-bottom:12px;border-radius:1px}
.rkp-proof__actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}

/* forms */
.rkp-formgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.rkp-formcard{background:rgba(255,255,255,.045);border:1px solid var(--line);padding:18px}
.rkp-formcard__t{font-weight:700;font-size:15px}
.rkp-formcard__m{font-size:12px;color:var(--muted);margin:6px 0 12px}
.rkp-formcard__actions{display:flex;gap:6px;flex-wrap:wrap}
.rkp-ffield{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.rkp-ffield em{color:var(--faint);font-style:normal}
.rkp-ffield__req{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px;margin-left:auto}
.rkp-ffield input[data-field-opts]{flex-basis:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:12px;padding:7px 10px;outline:none}
.rkp-subrow{font-size:13px;padding:3px 0}

/* automations */
.rkp-autorow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:13px 4px;color:#fff;font-family:inherit;cursor:pointer}
.rkp-autorow:last-child{border-bottom:none}
.rkp-autorow:hover{background:rgba(255,255,255,.03)}
.rkp-autorow__dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.2);flex-shrink:0}
.rkp-autorow__dot.on{background:#74e2a7;box-shadow:0 0 8px rgba(116,226,167,.6)}
.rkp-autorow__b{flex:1;min-width:0}
.rkp-autorow__name{font-weight:700;font-size:14px}
.rkp-autorow__rule{font-size:12px;color:var(--muted);margin-top:2px}

/* public form page */
.rkp-pubwrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:30px}
.rkp-pubform{width:100%;max-width:520px;background:rgba(12,14,22,.72);border:1px solid var(--line);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);padding:32px;border-radius:1px}
.rkp-pubform h1{font-size:24px;font-weight:800;margin-bottom:6px}
.rkp-pubform__desc{color:var(--muted);font-size:14px;margin-bottom:18px}
.rkp-pubfield{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;font-size:13px;font-weight:600;color:var(--muted)}
.rkp-pubfield input,.rkp-pubfield textarea,.rkp-pubfield select{background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:14px;padding:11px 13px;outline:none;border-radius:1px}
.rkp-pubfield textarea{min-height:90px;resize:vertical}
.rkp-pubfield input:focus,.rkp-pubfield textarea:focus,.rkp-pubfield select:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}
.rkp-pubform .rkp-btn{width:100%;margin-top:6px;padding:13px}
.rkp-pubmsg{margin-top:14px;font-size:14px;font-weight:600;text-align:center}
.rkp-pubmsg.is-ok{color:#74e2a7}.rkp-pubmsg.is-err{color:#fca5a5}

/* ============================================================
   Mobile navigation (hamburger + slide-in sidebar)
   ============================================================ */
.rkp-burger{display:none;background:none;border:1px solid var(--line);color:#fff;font-size:16px;width:34px;height:34px;border-radius:1px;cursor:pointer;margin-right:4px}
.rkp-burger:hover{background:rgba(255,255,255,.06)}
@media(max-width:880px){
  .rkp-burger{display:inline-flex;align-items:center;justify-content:center}
  .rkp-side{z-index:70;box-shadow:30px 0 80px -30px rgba(0,0,0,.8)}
  .rkp-nav-open .rkp-side{transform:translateX(0)}
  .rkp-nav-open::after{content:"";position:fixed;inset:0;background:rgba(3,4,10,.5);z-index:65}
}

/* ============================================================
   COMPREHENSIVE RESPONSIVE PASS (all screen sizes)
   ============================================================ */
@media(max-width:1100px){
  .rkp-app{grid-template-columns:210px 1fr}
  .rkp-top{flex-wrap:wrap;gap:12px}
  .rkp-top__tools{flex-wrap:wrap}
  .rkp-search{width:160px}
  .rkp-rep2{grid-template-columns:1fr}
}
@media(max-width:880px){
  .rkp-viewport{padding:16px}
  .rkp-top{padding:16px}
  .rkp-top__head h1{font-size:19px}
  .rkp-top__tools{width:100%}
  .rkp-search{flex:1;width:auto;min-width:120px}
  .rkp-listwrap{overflow-x:auto}
  .rkp-list{min-width:560px}
  .rkp-board{grid-auto-flow:row;grid-auto-columns:auto;height:auto}
  .rkp-col{max-height:none}
  .rkp-stats{grid-template-columns:repeat(2,1fr)}
  .rkp-drawer{width:100vw;max-width:100vw;padding:20px}
  .rkp-drawer__grid{grid-template-columns:1fr 1fr}
  .rkp-timeform{grid-template-columns:1fr 1fr!important}
  .rkp-projgrid,.rkp-clientgrid,.rkp-notegrid,.rkp-formgrid,.rkp-proofgrid,.rkp-pgrid,.rkp-teamgrid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
}
@media(max-width:640px){
  .rkp-viewport{padding:12px}
  .rkp-stats{grid-template-columns:1fr 1fr;gap:8px}
  .rkp-stat__n{font-size:20px}
  .rkp-top__head h1{font-size:17px}
  .rkp-top__edit{display:none}
  .rkp-drawer__grid{grid-template-columns:1fr}
  .rkp-timeform{grid-template-columns:1fr!important}
  .rkp-wl__row{grid-template-columns:110px 1fr 26px}
  .rkp-wl__tags{display:none}
  .rkp-bar{grid-template-columns:80px 1fr 36px;font-size:12px}
  .rkp-cal__cell{min-height:56px;padding:5px}
  .rkp-cal__num{font-size:10px}
  .rkp-cal__task{font-size:9px;padding:2px 4px}
  .rkp-cal__bar h3{font-size:15px;min-width:120px}
  .rkp-tl__row{grid-template-columns:96px 1fr}
  .rkp-tl__axis{padding:0 0 8px}
  .rkp-invline{grid-template-columns:1fr 44px 60px 56px 18px;gap:5px}
  .rkp-invline input{padding:7px 6px;font-size:12px}
  .rkp-home__task{flex-wrap:wrap}
  .rkp-home__proj{order:3;width:100%}
  .rkp-projgrid,.rkp-clientgrid,.rkp-notegrid,.rkp-formgrid,.rkp-proofgrid,.rkp-pgrid,.rkp-teamgrid{grid-template-columns:1fr 1fr}
  .rkp-pubform{padding:22px}
}
@media(max-width:440px){
  .rkp-stats{grid-template-columns:1fr}
  .rkp-projgrid,.rkp-clientgrid,.rkp-notegrid,.rkp-formgrid,.rkp-proofgrid,.rkp-pgrid,.rkp-teamgrid{grid-template-columns:1fr}
  .rkp-seg{width:100%}
  .rkp-seg button{flex:1}
  .rkp-filter{flex:1;min-width:0}
  .rkp-btn{width:100%}
  .rkp-top__tools{gap:8px}
  .rkp-trow{grid-template-columns:22px 54px 1fr 18px}
  .rkp-trow__date{display:none}
  .rkp-cal__grid{gap:2px}
  .rkp-cal__dow{font-size:9px}
}
/* touch: allow board horizontal scroll feel on small tablets */
@media(max-width:880px) and (min-width:641px){
  .rkp-board{grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);overflow-x:auto}
}

/* ============================================================
   Global search (sidebar)
   ============================================================ */
.rkp-gsearch{position:relative;margin:4px 0 8px}
.rkp-gsearch input{width:100%;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:13px;padding:9px 11px;outline:none;border-radius:1px}
.rkp-gsearch input:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}
.rkp-gsearch__results{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:rgba(12,14,22,.96);border:1px solid var(--line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);z-index:80;max-height:320px;overflow-y:auto;box-shadow:0 20px 50px -20px rgba(0,0,0,.7)}
.rkp-gres{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:10px 12px;color:#fff;font-family:inherit;font-size:13px;cursor:pointer}
.rkp-gres:hover{background:rgba(0,87,255,.12)}
.rkp-gres__t{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#9ec2ff;border:1px solid rgba(0,87,255,.4);padding:1px 5px;margin-right:7px;border-radius:1px}
.rkp-gres em{color:var(--faint);font-style:normal}
.rkp-gres__none{padding:12px;color:var(--faint);font-size:13px}

/* ============================================================
   v3.3 — milestones, dependencies, billing, capacity + UI POLISH
   ============================================================ */
/* card badges */
.rkp-blocked{display:inline-block;font-size:10px;font-weight:800;color:#fca5a5;background:rgba(220,38,38,.16);border:1px solid rgba(220,38,38,.3);padding:1px 7px;margin:0 0 6px;border-radius:1px}
.rkp-mschip{display:inline-block;font-size:10px;font-weight:700;color:#c9b8ff;background:rgba(137,87,229,.16);padding:1px 7px;margin:0 0 6px 4px;border-radius:1px}
.rkp-card.is-blocked{opacity:.86;border-left:2px solid rgba(220,38,38,.5)}

/* milestones view */
.rkp-msbar{margin-bottom:14px}
.rkp-ms{background:rgba(255,255,255,.045);border:1px solid var(--line);padding:18px 20px;margin-bottom:14px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.rkp-ms__head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}
.rkp-ms__name{font-weight:800;font-size:15px;color:#d7c9ff}
.rkp-ms__due{font-size:12px;color:var(--muted);margin-top:2px}
.rkp-ms__actions{display:flex;align-items:center;gap:8px}
.rkp-ms__pct{font-weight:800;font-size:14px}
.rkp-iconbtn{background:none;border:1px solid var(--line);color:var(--muted);width:28px;height:28px;border-radius:1px;cursor:pointer;font-size:12px}
.rkp-iconbtn:hover{color:#fff;background:rgba(255,255,255,.06)}
.rkp-ms__bar{height:8px;background:rgba(255,255,255,.07);overflow:hidden;border-radius:999px;margin-bottom:14px}
.rkp-ms__bar span{display:block;height:100%;background:linear-gradient(90deg,#8957e5,#b794f6)}
.rkp-ms__tasks{display:flex;flex-direction:column;gap:6px}
.rkp-ms__task{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:rgba(255,255,255,.03);border:1px solid var(--line);padding:9px 12px;color:#fff;font-family:inherit;font-size:13px;cursor:pointer;border-radius:1px}
.rkp-ms__task:hover{background:rgba(0,87,255,.1)}
.rkp-ms__task .rkp-card__pr{position:static;width:6px;height:18px;border-radius:1px}
.rkp-ms__task .rkp-badge{margin-left:auto}

/* workload capacity */
.rkp-wl__fill.is-over{background:linear-gradient(90deg,#dc2626,#fb7185)}
.rkp-wl__cap{font-size:11px;color:var(--muted);font-weight:700}
.rkp-hint{font-size:12px;color:var(--faint);margin-top:12px}
.rkp-bar__fill.is-over{background:linear-gradient(90deg,#dc2626,#fb7185)}

/* team rate/capacity */
.rkp-teamcard__meta{display:flex;gap:8px;margin:12px 0 10px}
.rkp-teamcard__meta label{flex:1;min-width:0;font-size:10px;color:var(--faint);font-weight:700;display:flex;flex-direction:column;gap:3px;text-align:left}
.rkp-teamcard__meta input{width:100%;min-width:0;box-sizing:border-box;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:13px;padding:6px 8px;outline:none;border-radius:1px}
.rkp-teamcard__meta input:focus{border-color:rgba(0,87,255,.6)}

/* time billable */
.rkp-check{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap}
.rkp-nonbill{font-size:10px;color:#f7cf7a;background:rgba(245,183,60,.14);padding:1px 6px;border-radius:1px;font-weight:700}
.rkp-drawer__num{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:14px;padding:10px 12px;outline:none;border-radius:1px}
.rkp-drawer__num:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}

/* ---------- UI POLISH PASS ---------- */
/* softer, deeper glass + smoother motion across the app */
.rkp-card{box-shadow:0 1px 0 rgba(255,255,255,.03) inset, 0 6px 18px -12px rgba(0,0,0,.6);transition:transform .16s cubic-bezier(.2,.7,.3,1),border-color .16s,box-shadow .16s}
.rkp-card:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.4);box-shadow:0 14px 32px -16px rgba(0,40,140,.7)}
.rkp-stat{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));transition:transform .16s,border-color .16s}
.rkp-stat:hover{transform:translateY(-2px);border-color:rgba(0,87,255,.35)}
.rkp-stat__n{background:linear-gradient(180deg,#fff,#b9cdff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rkp-btn{transition:transform .14s,box-shadow .14s,filter .14s}
.rkp-btn:not(.rkp-btn--danger):not(.rkp-btn--sm):not(.rkp-btn--ghost):hover{box-shadow:0 10px 26px -10px rgba(0,87,255,.7)}
.rkp-btn:active{transform:translateY(1px)}
.rkp-col{transition:background .2s}
.rkp-col__body.is-over{background:rgba(0,87,255,.08);outline:1px dashed rgba(0,87,255,.4)}
.rkp-nav{position:relative}
.rkp-nav.is-active::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;background:#3b82f6;border-radius:2px}
.rkp-drawer{box-shadow:-30px 0 80px -30px rgba(0,0,0,.8)}
.rkp-drawer__title{transition:border-color .14s}
.rkp-top h1{letter-spacing:-.01em}
.rkp-brand{letter-spacing:-.02em}
.rkp-av{box-shadow:0 2px 6px -2px rgba(0,0,0,.5)}
.rkp-projcard:hover .rkp-projcard__bar{width:6px;transition:width .16s}
.rkp-badge,.rkp-chip{letter-spacing:.01em}
.rkp-viewport{animation:rkpfade .22s ease}
@keyframes rkpfade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

@media(max-width:880px){.rkp-teamcard__meta{flex-direction:column}}

/* ============================================================
   v3.4 — templates + exports
   ============================================================ */
.rkp-tplrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 4px;border-bottom:1px solid var(--line)}
.rkp-tplrow:last-child{border-bottom:none}
.rkp-tplrow__name{font-weight:700;font-size:14px}
.rkp-tplrow__m{font-size:12px;color:var(--muted);margin-top:2px}
.rkp-tplrow__a{display:flex;align-items:center;gap:8px}

/* ============================================================
   v3.5 — roles + client portal
   ============================================================ */
.rkp-rolepill{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#74e2a7;background:rgba(24,200,120,.16);padding:2px 7px;margin-left:8px;border-radius:1px;vertical-align:middle}
.rkp-personrow{display:flex;align-items:center;gap:12px;padding:11px 4px;border-bottom:1px solid var(--line)}
.rkp-personrow:last-child{border-bottom:none}
.rkp-personrow__n{flex:1;font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-personrow select{min-width:150px}

/* ============================================================
   v3.6 — collapsible sidebar groups (accordion)
   ============================================================ */
.rkp-side__group{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:none;color:var(--faint);font-family:inherit;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:14px 8px 7px;cursor:pointer;transition:color .14s}
.rkp-side__group:hover{color:var(--muted)}
.rkp-side__group.is-open{color:#9ec2ff}
.rkp-side__chev{font-size:9px;width:10px;display:inline-block;transition:transform .15s}
.rkp-side__groupitems{animation:rkpslidein .18s ease}
@keyframes rkpslidein{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ============================================================
   v3.7 — brand SVG nav icons + hover animations
   ============================================================ */
.rkp-nav__ic{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;opacity:.9}
.rkp-nav__ic svg{width:18px;height:18px;display:block;overflow:visible;transition:transform .28s cubic-bezier(.34,1.56,.64,1)}
.rkp-nav__ic svg *{transition:transform .28s cubic-bezier(.34,1.56,.64,1),stroke-width .2s}
.rkp-nav.is-active .rkp-nav__ic{opacity:1;color:#9ec2ff}

/* base springy pop for every icon */
.rkp-nav:hover .rkp-nav__ic svg{transform:scale(1.16)}
.rkp-nav:active .rkp-nav__ic svg{transform:scale(1.02)}

/* per-icon flourishes */
.rkp-nav:hover [data-icon="settings"] svg{transform:rotate(90deg) scale(1.1)}
.rkp-nav:hover [data-icon="automations"] svg{animation:rkp-zap .5s ease}
@keyframes rkp-zap{0%{transform:scale(1.16)}40%{transform:scale(1.34) translateY(-2px) rotate(-4deg)}100%{transform:scale(1.16)}}
.rkp-nav:hover [data-icon="time"] .rkp-ic-hand{transform-origin:12px 12px;transform:rotate(50deg)}
.rkp-nav:hover [data-icon="workload"] .rkp-ic-needle{transform-origin:12px 18px;transform:rotate(-30deg)}
.rkp-nav:hover [data-icon="calendar"] svg,
.rkp-nav:hover [data-icon="inbox"] svg{animation:rkp-bob .5s ease}
@keyframes rkp-bob{0%,100%{transform:scale(1.16) translateY(0)}50%{transform:scale(1.16) translateY(-3px)}}
.rkp-nav:hover [data-icon="messages"] svg{animation:rkp-pop .4s ease}
@keyframes rkp-pop{0%{transform:scale(1.16)}50%{transform:scale(1.28)}100%{transform:scale(1.16)}}
.rkp-nav:hover [data-icon="mytasks"] svg{transform:scale(1.16) rotate(-4deg)}
.rkp-nav:hover [data-icon="projects"] rect{transform:translateY(-1px)}
.rkp-nav:hover [data-icon="projects"] rect:nth-child(2){transform:translateY(1.5px)}

/* the active accent line we already added pairs with the new icons */
.rkp-nav.is-active .rkp-nav__ic svg{transform:scale(1.05)}

/* ============================================================
   v3.8 — collapsible sidebar (R mark) + wordmark logo
   ============================================================ */
.rkp-app{transition:grid-template-columns .22s cubic-bezier(.4,0,.2,1)}
.rkp-app.rkp-collapsed{grid-template-columns:72px 1fr}

/* brand / logos / toggle */
.rkp-brand{display:flex;align-items:center;gap:8px;position:relative}
.rkp-logo-full{height:26px;width:auto;max-width:150px;object-fit:contain;display:block}
.rkp-brand--mini{justify-content:center}
.rkp-logo-r{height:34px;width:auto;object-fit:contain;display:block}
.rkp-collapse{position:absolute;top:50%;right:-2px;transform:translateY(-50%);width:22px;height:22px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--muted);font-size:12px;line-height:1;border-radius:1px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .14s,color .14s}
.rkp-collapse:hover{color:#fff;background:rgba(0,87,255,.25)}
.rkp-brand--mini .rkp-collapse{position:static;transform:none;margin-top:0}

/* collapsed: center the rail, hide text */
.rkp-collapsed .rkp-side{align-items:stretch}
.rkp-collapsed .rkp-brand--mini{flex-direction:column;gap:10px;align-items:center}
.rkp-collapsed .rkp-nav{justify-content:center;padding:11px 0;margin-bottom:3px;position:relative}
.rkp-collapsed .rkp-nav__lbl,
.rkp-collapsed .rkp-nav__pro,
.rkp-collapsed .rkp-nav__soon{display:none}
.rkp-collapsed .rkp-nav.is-active::before{top:8px;bottom:8px}
.rkp-collapsed .rkp-side__sep{height:1px;background:var(--line);margin:8px 12px}
.rkp-collapsed .rkp-pin--mini{display:flex;justify-content:center;padding:6px 0}
.rkp-collapsed .rkp-side__bottom{display:flex;flex-direction:column;align-items:stretch}
.rkp-collapsed .rkp-side__foot{flex-direction:column;gap:10px;justify-content:center}
.rkp-collapsed .rkp-side__out--mini{font-size:16px;text-decoration:none;color:var(--faint)}
.rkp-collapsed .rkp-side__out--mini:hover{color:#7fb0ff}
.rkp-pin--mini{border:none;background:none;cursor:pointer}

/* on mobile the sidebar is an overlay — always show the full (expanded) look */
@media(max-width:880px){
  .rkp-app.rkp-collapsed{grid-template-columns:230px 1fr}
  .rkp-collapse{display:none}
}

/* ============================================================
   v3.9 — top-bar global controls (search, team, settings, user)
   ============================================================ */
.rkp-top__right{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;flex:1}
.rkp-top__global{display:flex;align-items:center;gap:8px}
.rkp-topsearch{position:relative;display:flex;align-items:center}
.rkp-topsearch__ic{position:absolute;left:10px;width:15px;height:15px;color:var(--faint);pointer-events:none;display:flex}
.rkp-topsearch__ic svg{width:15px;height:15px}
.rkp-topsearch input{width:190px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;font-family:inherit;font-size:13px;padding:9px 11px 9px 32px;outline:none;border-radius:1px;transition:width .18s,border-color .14s}
.rkp-topsearch input:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18);width:230px}
.rkp-topsearch .rkp-gsearch__results{top:calc(100% + 6px);left:0;right:auto;min-width:280px}
.rkp-topbtn{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted);border-radius:1px;cursor:pointer;transition:color .14s,background .14s,transform .14s}
.rkp-topbtn svg{width:18px;height:18px;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.rkp-topbtn:hover{color:#fff;background:rgba(0,87,255,.18)}
.rkp-topbtn:hover svg{transform:scale(1.14)}
.rkp-topbtn.is-active{color:#9ec2ff;border-color:rgba(0,87,255,.4)}
.rkp-topuser{position:relative}
.rkp-topuser .rkp-av--me{border:none;cursor:pointer;width:36px;height:36px;font-size:13px}
.rkp-usermenu{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:180px;background:rgba(12,14,22,.97);border:1px solid var(--line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);z-index:90;box-shadow:0 20px 50px -20px rgba(0,0,0,.7);padding:6px}
.rkp-topuser.is-open .rkp-usermenu{display:block;animation:rkpfade .14s ease}
.rkp-usermenu__name{font-size:13px;font-weight:700;padding:8px 10px 6px}
.rkp-usermenu__out{display:block;padding:9px 10px;font-size:13px;color:var(--muted);text-decoration:none;border-top:1px solid var(--line)}
.rkp-usermenu__out:hover{color:#7fb0ff;background:rgba(255,255,255,.04)}

@media(max-width:880px){
  .rkp-topsearch input{width:130px}
  .rkp-topsearch input:focus{width:150px}
  .rkp-top__right{gap:8px}
}
@media(max-width:560px){
  .rkp-topsearch{display:none}
  .rkp-top__global{gap:6px}
}

/* ============================================================
   v3.10 — compact sidebar, animated chevron/toggle, collapsed group accordion
   ============================================================ */
/* compact widths + spacing (desktop only — mobile uses the single-column overlay) */
@media(min-width:881px){
  .rkp-app{grid-template-columns:212px 1fr}
  .rkp-app.rkp-collapsed{grid-template-columns:58px 1fr}
}
.rkp-side{padding:14px 10px}
.rkp-brand{margin-bottom:12px;min-height:26px}
.rkp-logo-full{height:22px}
.rkp-logo-r{height:26px;margin:0 auto}
.rkp-nav{padding:7px 9px;font-size:12.5px;gap:10px;margin-bottom:1px}
.rkp-nav__ic,.rkp-nav__ic svg{width:16px;height:16px}
.rkp-pin{padding:5px 9px;font-size:12.5px}
.rkp-side__lbl{padding:12px 8px 5px;font-size:9.5px}

/* animated accordion chevron (expanded) */
.rkp-side__group{display:flex;align-items:center;gap:7px;padding:11px 8px 5px;font-size:9.5px}
.rkp-side__chev{display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;color:var(--faint)}
.rkp-side__chev svg{width:12px;height:12px;transition:transform .26s cubic-bezier(.34,1.56,.64,1)}
.rkp-side__group.is-open .rkp-side__chev svg{transform:rotate(90deg)}
.rkp-side__group.is-open .rkp-side__chev{color:#9ec2ff}
.rkp-side__groupitems{animation:rkpslidein .18s ease}

/* collapsed: two group-icon toggles, accordion of icons */
.rkp-cgroup{margin-bottom:5px}
.rkp-cgroup__btn{width:100%;display:flex;align-items:center;justify-content:center;padding:9px 0;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted);cursor:pointer;border-radius:1px;transition:color .15s,background .15s,border-color .15s}
.rkp-cgroup__btn .rkp-nav__ic,.rkp-cgroup__btn .rkp-nav__ic svg{width:18px;height:18px}
.rkp-cgroup__btn svg{transition:transform .28s cubic-bezier(.34,1.56,.64,1)}
.rkp-cgroup__btn:hover{color:#fff;background:rgba(0,87,255,.16)}
.rkp-cgroup__btn:hover svg{transform:scale(1.14)}
.rkp-cgroup__btn.is-open{color:#9ec2ff;background:rgba(0,87,255,.18);border-color:rgba(0,87,255,.4)}
.rkp-cgroup__items{margin:4px 0 8px;display:flex;flex-direction:column;gap:2px;animation:rkpslidein .18s ease}
.rkp-collapsed .rkp-cgroup__items .rkp-nav{justify-content:center;padding:9px 0}

/* bottom expand/collapse toggle with animated icon */
.rkp-side__toggle{margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
.rkp-collapse{position:static;transform:none;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:auto;padding:9px;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted);cursor:pointer;border-radius:1px;font-family:inherit;font-size:12px;font-weight:600;transition:color .15s,background .15s}
.rkp-collapse:hover{color:#fff;background:rgba(0,87,255,.18)}
.rkp-tgsvg{width:18px;height:18px;display:block}
.rkp-tgsvg path{transition:transform .25s ease}
.rkp-collapse:hover .rkp-tg1{animation:rkp-sp1 .8s ease infinite}
.rkp-collapse:hover .rkp-tg2{animation:rkp-sp2 .8s ease infinite}
@keyframes rkp-sp1{0%,100%{transform:translateX(0)}50%{transform:translateX(-2px)}}
@keyframes rkp-sp2{0%,100%{transform:translateX(0)}50%{transform:translateX(2px)}}
.rkp-collapsed .rkp-collapse{justify-content:center;padding:9px 0}
.rkp-collapsed .rkp-collapse__lbl{display:none}

@media(max-width:880px){.rkp-side__toggle{display:none}}

/* ============================================================
   v3.11 — 80px top bar aligned with logo column; bigger logo, smaller icons
   ============================================================ */
.rkp-top{min-height:80px;padding:14px 24px;box-sizing:border-box;align-content:center}
@media(max-width:880px){.rkp-top{min-height:0;padding:14px 16px}}

/* logo column matches the 80px top-bar height, forming one continuous divider line */
.rkp-side{padding:0 10px}
.rkp-brand{height:80px;min-height:80px;margin:0 -10px;padding:0 16px;display:flex;align-items:center;border-bottom:1px solid var(--line);box-sizing:border-box}
.rkp-brand--mini{justify-content:center;padding:0}
.rkp-side__scroll{padding-top:12px}

/* logo a little bigger */
.rkp-logo-full{height:30px}
.rkp-logo-r{height:36px}

/* icons a little smaller so everything fits */
.rkp-nav{padding:6px 9px;font-size:12px;gap:9px}
.rkp-nav__ic,.rkp-nav__ic svg{width:14px;height:14px}
.rkp-cgroup__btn{padding:8px 0}
.rkp-cgroup__btn .rkp-nav__ic,.rkp-cgroup__btn .rkp-nav__ic svg{width:16px;height:16px}
.rkp-pin{padding:5px 9px;font-size:12px}
.rkp-pin .rkp-proj__dot{width:9px;height:9px}

/* ============================================================
   v3.12 — responsive hardening (tablet + mobile)
   ============================================================ */
/* never allow the app to cause horizontal page scroll */
#rkp-app{max-width:100vw;overflow-x:hidden}

/* TABLET (≤1100): keep the top bar to one tidy region, shrink the global search */
@media(max-width:1100px){
  .rkp-top{gap:10px}
  .rkp-topsearch input{width:150px}
  .rkp-topsearch input:focus{width:170px}
  .rkp-top__tools{gap:8px}
}

/* small tablets / large phones (≤880): stack the header cleanly, bigger tap targets */
@media(max-width:880px){
  .rkp-top{flex-direction:column;align-items:stretch;gap:10px}
  .rkp-top__head{display:flex;align-items:center;gap:10px}
  .rkp-top__head h1{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rkp-top__right{flex:none;width:100%;flex-wrap:wrap;justify-content:flex-start;gap:8px}
  .rkp-top__global{order:1;width:100%;justify-content:space-between;flex-wrap:wrap}
  .rkp-top__tools{order:2;width:100%}
  .rkp-topsearch{flex:1}
  .rkp-topsearch input,.rkp-topsearch input:focus{width:100%}
  /* the sidebar overlay is the full menu — make rows comfortably tappable */
  .rkp-side{width:264px}
  .rkp-nav{padding:11px 12px;font-size:14px;gap:12px}
  .rkp-nav__ic,.rkp-nav__ic svg{width:18px;height:18px}
  .rkp-side__group{padding:15px 12px 6px;font-size:11px}
  .rkp-pin{padding:9px 12px;font-size:14px}
  .rkp-burger{width:38px;height:38px;font-size:18px}
  .rkp-topbtn,.rkp-topuser .rkp-av--me{width:40px;height:40px}
}

/* phones (≤640): comfortable controls, no cramped rows */
@media(max-width:640px){
  .rkp-btn,.rkp-filter,.rkp-seg button,.rkp-search,.rkp-topsearch input{min-height:42px}
  .rkp-seg{display:flex;width:100%}
  .rkp-seg button{flex:1}
  .rkp-top__tools{flex-wrap:wrap}
  .rkp-filter{flex:1 1 calc(50% - 4px);min-width:0}
  .rkp-drawer__title{font-size:18px}
  .rkp-card{padding:11px 12px}
  /* keep the "search everything" usable on phones rather than hiding it */
  .rkp-topsearch{display:flex;flex:1 1 100%;order:-1}
}

/* very small phones (≤400): single-column controls */
@media(max-width:400px){
  .rkp-filter{flex:1 1 100%}
  .rkp-top__head h1{font-size:16px}
  .rkp-back{font-size:0}
  .rkp-back::before{content:"‹";font-size:18px}
}

/* ============================================================
   v3.13 — shorter top bar + logo bar; wider wordmark when expanded
   ============================================================ */
.rkp-top{min-height:60px;padding:10px 24px}
@media(max-width:880px){.rkp-top{min-height:0;padding:12px 16px}}
.rkp-brand{height:60px;min-height:60px}
.rkp-side__scroll{padding-top:10px}

/* expanded: wordmark scales by width to fill the sidebar (wider), height auto within the bar */
.rkp-logo-full{width:100%;max-width:176px;height:auto;display:block}
/* collapsed: keep the R mark sized to the slim rail */
.rkp-logo-r{height:30px;width:auto}

/* ============================================================
   v3.14 — slimmer top bar / logo bar (less vertical padding)
   ============================================================ */
.rkp-top{min-height:52px;padding:6px 24px}
@media(max-width:880px){.rkp-top{min-height:0;padding:10px 16px}}
.rkp-brand{height:52px;min-height:52px}
.rkp-side__scroll{padding-top:8px}
/* keep the controls tidy within the slimmer bar */
.rkp-topbtn,.rkp-topuser .rkp-av--me{width:34px;height:34px}
.rkp-topsearch input{padding-top:7px;padding-bottom:7px}

/* ============================================================
   v3.15 — breathing room below the collapse/expand toggle
   ============================================================ */
.rkp-side{padding:0 10px 5px}
.rkp-side__toggle{margin-bottom:0}

/* ============================================================
   v3.16 — fix: force single-column layout below 880 (was being
   overridden by the later ≤1100 tablet rule, squeezing main into 210px)
   ============================================================ */
@media(max-width:880px){
  .rkp-app,.rkp-app.rkp-collapsed{grid-template-columns:1fr}
}

/* ============================================================
   v3.17 — square avatar everywhere; tap-to-open search icon on small screens
   ============================================================ */
/* square top-bar avatar (matches the square Team/Settings buttons) */
.rkp-topuser .rkp-av--me{border-radius:1px}

/* search: default (desktop) shows the field, hides the icon button */
.rkp-topsearch{position:relative;display:flex}
.rkp-searchbtn{display:none}
.rkp-topsearch__field{display:flex;align-items:center;position:relative}

/* small screens: show a search icon button; the field opens as a panel on tap */
@media(max-width:880px){
  .rkp-topsearch{display:flex;flex:0 0 auto;order:0}
  .rkp-searchbtn{display:inline-flex}
  .rkp-topsearch__field{display:none}
  .rkp-topsearch.is-open .rkp-topsearch__field{display:flex;position:absolute;right:0;top:calc(100% + 8px);width:260px;max-width:78vw;z-index:95;background:rgba(12,14,22,.98);border:1px solid var(--line);padding:6px;box-shadow:0 20px 50px -20px rgba(0,0,0,.7)}
  .rkp-topsearch.is-open .rkp-topsearch__field input,
  .rkp-topsearch.is-open .rkp-topsearch__field input:focus{width:100%}
  .rkp-topsearch.is-open .rkp-gsearch__results{position:static;margin-top:6px;min-width:0;width:100%}
  /* keep the global controls grouped neatly on the right */
  .rkp-top__global{width:100%;justify-content:flex-end;flex-wrap:wrap}
}

/* ============================================================
   v3.18 — header stays one line; equal control buttons; ghost + gradient pairs
   ============================================================ */
/* header layout: head on the left, global controls pinned right, tools between */
.rkp-top{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px}
.rkp-top__global{margin-left:auto}

/* keep header on a single line down through tablet; tools wrap to their own line below */
@media(max-width:880px){
  .rkp-top{flex-direction:row;align-items:center;flex-wrap:wrap}
  .rkp-top__head{order:1;flex:1 1 auto;min-width:0}
  .rkp-top__head h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rkp-top__global{order:2;width:auto;margin-left:auto;justify-content:flex-end;flex-wrap:nowrap}
  .rkp-top__tools{order:3;flex:1 1 100%;width:100%}
}

/* equal-sized top control buttons (search / team / settings / avatar) */
.rkp-topbtn,.rkp-searchbtn,.rkp-topuser .rkp-av--me{width:34px;height:34px;flex:0 0 34px;box-sizing:border-box}
.rkp-topbtn svg,.rkp-searchbtn svg{width:17px;height:17px}

/* ghost button = transparent/outline; pairs with the gradient .rkp-btn */
.rkp-btn.rkp-btn--ghost{background:none;border:1px solid var(--line);color:#cdd6e6;box-shadow:none}
.rkp-btn.rkp-btn--ghost:hover{background:rgba(255,255,255,.07);color:#fff;box-shadow:none;transform:translateY(-1px)}

/* ============================================================
   v3.19 — glassier drawers/popups, 1px corners on all fields, compact
   ============================================================ */
/* transparent blurred glass for side drawers + popups */
.rkp-drawer{background:rgba(13,16,26,.55);backdrop-filter:blur(28px) saturate(1.3);-webkit-backdrop-filter:blur(28px) saturate(1.3)}
.rkp-usermenu{background:rgba(14,17,27,.6);backdrop-filter:blur(26px) saturate(1.2);-webkit-backdrop-filter:blur(26px) saturate(1.2)}
@media(max-width:880px){
  .rkp-topsearch.is-open .rkp-topsearch__field{background:rgba(14,17,27,.62);backdrop-filter:blur(24px) saturate(1.2);-webkit-backdrop-filter:blur(24px) saturate(1.2)}
}

/* no round things — every field/control gets a 1px radius (id-scoped to win) */
#rkp-app input,#rkp-app select,#rkp-app textarea,
#rkp-app .rkp-drawer__title,#rkp-app .rkp-drawer__desc,#rkp-app .rkp-drawer__num,
#rkp-app .rkp-labels__new input,#rkp-app .rkp-subs__new input{border-radius:1px}
/* native colour picker → flat 1px square swatch */
#rkp-app input[type="color"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);border-radius:1px;padding:2px;background:none;cursor:pointer}
#rkp-app input[type="color"]::-webkit-color-swatch-wrapper{padding:0}
#rkp-app input[type="color"]::-webkit-color-swatch{border:none;border-radius:0}
#rkp-app input[type="color"]::-moz-color-swatch{border:none;border-radius:0}

/* compact drawer spacing */
.rkp-drawer{padding:18px}
.rkp-drawer__title{font-size:16px;padding:9px 12px;margin-bottom:12px}
.rkp-drawer__grid{gap:9px;margin-bottom:12px}
.rkp-drawer__lbl{font-size:10px;margin-top:2px;margin-bottom:4px}
.rkp-drawer__desc{min-height:74px;padding:9px 12px;font-size:13px}
.rkp-drawer__num{padding:8px 11px}
.rkp-drawer__actions{margin-top:14px;gap:8px}
.rkp-subs__new,.rkp-labels__new{margin-bottom:12px;gap:6px}
.rkp-labels__new input[type=text],.rkp-labels__new input:not([type]),.rkp-labels__new [data-label-new]{padding:8px 10px}
.rkp-labels__new input[type=color]{width:34px;height:34px}
.rkp-lchips{gap:5px}

/* ============================================================
   v3.20 — notifications, activity, portfolio, automation builder,
            custom fields, proofing depth
   ============================================================ */
/* notification bell + panel */
.rkp-topnotif{position:relative}
.rkp-notifdot{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:1px;background:#e9613b;color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;line-height:1}
.rkp-notifpanel{display:none;position:absolute;right:0;top:calc(100% + 8px);width:320px;max-width:84vw;max-height:60vh;overflow-y:auto;background:rgba(14,17,27,.62);backdrop-filter:blur(26px) saturate(1.2);-webkit-backdrop-filter:blur(26px) saturate(1.2);border:1px solid var(--line);z-index:95;box-shadow:0 24px 60px -22px rgba(0,0,0,.75)}
.rkp-topnotif.is-open .rkp-notifpanel{display:block;animation:rkpfade .14s ease}
.rkp-notifpanel__head{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;border-bottom:1px solid var(--line);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}
.rkp-link{background:none;border:none;color:#7fb0ff;font-family:inherit;font-size:11px;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:600}
.rkp-notif,.rkp-inboxrow{display:flex;gap:10px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:11px 13px;color:#fff;font-family:inherit;cursor:pointer;align-items:flex-start}
.rkp-notif:hover,.rkp-inboxrow:hover{background:rgba(0,87,255,.08)}
.rkp-notif__dot{width:7px;height:7px;border-radius:50%;background:transparent;margin-top:5px;flex:0 0 7px}
.rkp-notif.is-unread .rkp-notif__dot,.rkp-inboxrow.is-unread .rkp-notif__dot{background:#3b82f6}
.rkp-notif__text{font-size:13px;line-height:1.4}
.rkp-notif__when{font-size:11px;color:var(--faint);margin-top:2px}
.rkp-inboxrow__b{flex:1;font-size:13.5px}

/* activity log */
.rkp-actrow{display:flex;gap:11px;align-items:center;padding:10px 2px;border-bottom:1px solid var(--line)}
.rkp-actrow:last-child{border-bottom:none}
.rkp-actrow__b{flex:1}
.rkp-actrow__s{font-size:13.5px}
.rkp-actrow__tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);border:1px solid var(--line);padding:2px 7px;border-radius:1px}

/* portfolio */
.rkp-pfhead,.rkp-pfrow{display:grid;grid-template-columns:14px 1.8fr 1.3fr 1.1fr .9fr .8fr;gap:12px;align-items:center}
.rkp-pfhead{padding:6px 10px;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);font-weight:700;border-bottom:1px solid var(--line)}
.rkp-pfrow{width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:12px 10px;color:#fff;font-family:inherit;cursor:pointer}
.rkp-pfrow:hover{background:rgba(0,87,255,.08)}
.rkp-pfrow__name{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-pfrow__prog{display:flex;align-items:center;gap:8px}
.rkp-pfbar{flex:1;height:6px;background:rgba(255,255,255,.08);overflow:hidden;border-radius:999px}
.rkp-pfbar span{display:block;height:100%;background:linear-gradient(90deg,#0057ff,#3b82f6)}
.rkp-pfrow__prog em{font-size:11px;color:var(--muted);font-style:normal;white-space:nowrap}
.rkp-pfrow__over{font-size:12px;color:var(--muted)}
.rkp-pfrow__over.is-risk{color:#fca5a5;font-weight:600}
.rkp-pfrow__budget{font-size:12px;color:var(--muted)}
.rkp-health{width:10px;height:10px;border-radius:50%}
.rkp-health--ok{background:#3b82f6}.rkp-health--done{background:#1d9e75}.rkp-health--risk{background:#e9613b}
@media(max-width:880px){.rkp-pfhead{display:none}.rkp-pfrow{grid-template-columns:14px 1fr 16px;grid-auto-rows:auto;gap:6px 12px}.rkp-pfrow__prog,.rkp-pfrow__over,.rkp-pfrow__budget{grid-column:2/3}}

/* automation builder lines */
.rkp-autoline{display:flex;gap:6px;align-items:center;margin-bottom:6px}
.rkp-autoline .rkp-filter{flex:1;min-width:0}
.rkp-autoline .rkp-sub__x{flex:0 0 auto}

/* custom fields */
.rkp-cfgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:6px}
.rkp-cf{display:flex;flex-direction:column;gap:3px;font-size:10px;color:var(--faint);font-weight:700}
.rkp-cf .rkp-filter{width:100%}
@media(max-width:640px){.rkp-cfgrid{grid-template-columns:1fr}}

/* proofing depth: pins + versions */
.rkp-proof__stage{position:relative;display:inline-block;max-width:100%;line-height:0}
.rkp-proof__big{max-width:100%;border:1px solid var(--line);cursor:crosshair}
.rkp-pin{position:absolute;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50% 50% 50% 1px;background:#0057ff;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px -2px rgba(0,0,0,.6);cursor:default}
.rkp-pin--static{position:static;transform:none;flex:0 0 22px}
.rkp-vbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0}
.rkp-vchip{font-size:11px;font-weight:700;color:var(--muted);border:1px solid var(--line);padding:3px 8px;border-radius:1px;text-decoration:none}
.rkp-vchip:hover{color:#fff;border-color:rgba(0,87,255,.5)}
.rkp-vchip.is-current{color:#9ec2ff;border-color:rgba(0,87,255,.4);background:rgba(0,87,255,.12)}

/* ============================================================
   v4.0.1 — unify all dropdown backgrounds to the notifications glass
   ============================================================ */
.rkp-gsearch__results,
.rkp-usermenu,
.rkp-notifpanel,
.rkp-topsearch.is-open .rkp-topsearch__field{
  background:rgba(14,17,27,.62);
  backdrop-filter:blur(26px) saturate(1.2);
  -webkit-backdrop-filter:blur(26px) saturate(1.2);
}

/* ============================================================
   v4.0.2 — force dark native dropdowns (select option lists, date pickers)
   ============================================================ */
/* tell the browser to render native controls + their popups in dark mode */
html,:root{color-scheme:dark}
#rkp-app,#rkp-app select,#rkp-app input,#rkp-app textarea{color-scheme:dark}
/* explicit fallback for browsers that honour option colours */
#rkp-app option,#rkp-app optgroup,
#rkp-app select option,#rkp-app select optgroup{background-color:#10131c;color:#fff}
#rkp-app option:checked,#rkp-app option:hover{background-color:#16345f;color:#fff}

/* ============================================================
   v4.1.0 — in-app Settings form + Teams manager
   ============================================================ */
.rkp-th-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.rkp-h4{font-size:13px;font-weight:800;margin:0 0 8px}
/* settings form */
.rkp-setgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:6px}
.rkp-setfield{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:700;color:var(--faint)}
.rkp-setfield .rkp-filter{width:100%}
.rkp-settoggle{display:flex;align-items:center;gap:9px;font-size:13.5px;margin-top:12px;cursor:pointer}
.rkp-settoggle input{width:16px;height:16px;accent-color:#0057ff}
@media(max-width:760px){.rkp-setgrid{grid-template-columns:1fr}}
/* teams */
.rkp-teamrow{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.rkp-teamrow:last-of-type{border-bottom:none}
.rkp-teamrow__b{flex:1;min-width:0}
.rkp-teamrow__name{font-weight:700;font-size:14.5px}
.rkp-teamrow__meta{font-size:12px;color:var(--muted);margin-top:2px}
.rkp-teamrow__avs{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}
.rkp-assignbox{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line)}
.rkp-assignrow{display:flex;gap:8px;flex-wrap:wrap}
.rkp-assignrow .rkp-filter{flex:1;min-width:140px}
/* toast */
.rkp-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(14px);background:rgba(14,17,27,.82);backdrop-filter:blur(26px) saturate(1.2);-webkit-backdrop-filter:blur(26px) saturate(1.2);border:1px solid var(--line);color:#fff;font-size:13px;font-weight:600;padding:11px 18px;border-radius:1px;z-index:200;opacity:0;transition:opacity .25s,transform .25s;box-shadow:0 18px 50px -20px rgba(0,0,0,.7)}
.rkp-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ============================================================
   v4.1.1 — sidebar overflow hardening (nav rows never spill out)
   ============================================================ */
.rkp-side__scroll{min-width:0}
.rkp-nav{min-width:0;overflow:hidden}
.rkp-nav__ic{flex:0 0 18px}
.rkp-nav__ic svg{overflow:hidden}            /* keep glyphs inside their slot */
.rkp-nav:hover .rkp-nav__ic svg{overflow:visible} /* allow the hover pop only on hover */
.rkp-nav__lbl{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-side__group span:not(.rkp-side__chev){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ============================================================
   v4.1.3 — header layout + board fit
   - global search + icons sit inline on the top-bar row (was wrapping below)
   - the view/filter/+New-task toolbar drops to its own row beneath the top bar
   - board columns compress to share the viewport width (no horizontal scroll)
   - (sidebar "Pinned projects" removed in app.js)
   ============================================================ */
@media(min-width:881px){
  /* two-row header: [ head .......... global ] / [ tools ............... ]
     scoped to headers that actually have a toolbar, so tool-less views
     (Home, Inbox, etc.) keep their existing single-row layout. */
  .rkp-top:has(.rkp-top__tools){
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-areas:"head global" "tools tools";
    align-items:center;
    column-gap:14px;
    row-gap:12px;
  }
  .rkp-top:has(.rkp-top__tools) .rkp-top__head{grid-area:head;min-width:0}
  .rkp-top:has(.rkp-top__tools) .rkp-top__global{grid-area:global;margin-left:0;justify-self:end}
  .rkp-top:has(.rkp-top__tools) .rkp-top__tools{grid-area:tools;flex-wrap:wrap}

  /* board: equal columns that compress to fit the viewport — no h-scroll.
     keeps grid-auto-flow:column from the base rule, just drops the 280px min. */
  .rkp-board{grid-auto-columns:minmax(0,1fr)}
  .rkp-viewport{overflow-x:hidden}
}

/* ============================================================
   v4.1.4 — project toolbar moves OUT of the header into its own bar
   - header returns to a single row at its original height (title + global)
   - search / view-switch / filters / +New task now live in .rkp-subbar below it
   - those toolbar controls are made smaller (desktop)
   - other views: undo the v4.1.3 two-row header so their action button sits
     back on the title row (header height stays equal as before)
   ============================================================ */
@media(min-width:881px){
  /* the project header no longer contains tools; the only remaining
     :has(.rkp-top__tools) matches are simple single-button views — keep
     those on one row instead of the v4.1.3 grid. */
  .rkp-top:has(.rkp-top__tools){display:flex}
}

/* toolbar strip directly beneath the top bar (outside the header) */
.rkp-subbar{padding:10px 24px;border-bottom:1px solid var(--line)}
.rkp-subbar .rkp-top__tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rkp-subbar [data-new-task]{margin-left:auto}
@media(max-width:880px){ .rkp-subbar{padding:10px 16px} }

/* smaller toolbar controls (desktop) */
@media(min-width:881px){
  .rkp-subbar .rkp-seg{padding:2px}
  .rkp-subbar .rkp-seg button{padding:5px 11px;font-size:12px}
  .rkp-subbar .rkp-filter{padding:6px 9px;font-size:12px}
  .rkp-subbar .rkp-search{padding:6px 10px;font-size:12px;width:160px}
  .rkp-subbar .rkp-search:focus{width:200px}
  .rkp-subbar .rkp-btn{padding:7px 13px;font-size:12px}
}

/* ============================================================
   v4.2.0 — full responsive pass
   - zero horizontal scroll at every breakpoint (phone → 4K)
   - tablet/phone: compact sizing + row→column reflows
   - board (project Kanban) AND CRM pipeline share .rkp-board → stack on tablet
   - task list table reflows into stacked cards on phones
   - large screens (≥2000px): content centered so it reads like an app
   Append-only; later rules win.
   ============================================================ */

/* --- 1. hard guard: nothing scrolls sideways inside the app --- */
.rkp-viewport{overflow-x:hidden}
.rkp-main,.rkp-col,.rkp-card,.rkp-card-panel,.rkp-listwrap,.rkp-cal__cell{min-width:0}

/* --- 2. Kanban board + CRM pipeline: stack vertically on tablet & below --- */
@media(max-width:880px){
  .rkp-board{grid-auto-flow:row;grid-auto-columns:auto;overflow-x:hidden;height:auto;gap:12px}
  .rkp-col{max-height:none}
  .rkp-col__body{max-height:none}
}

/* --- 3. task list table → stacked cards on phones (no 560px side-scroll) --- */
@media(max-width:640px){
  .rkp-listwrap{overflow-x:hidden}
  .rkp-list{min-width:0;width:100%}
  .rkp-list thead{display:none}
  .rkp-list tbody,.rkp-list tr,.rkp-list td{display:block}
  .rkp-list tr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:12px 14px}
  .rkp-list td{padding:0;border:none;font-size:12.5px}
  .rkp-list td.rkp-lt__title{flex:1 1 100%;font-size:15px;font-weight:700;margin-bottom:2px}
  .rkp-list tbody tr:last-child{border-bottom:none}
}

/* --- 4. compact spacing, tablet → small phone --- */
@media(max-width:880px){
  .rkp-viewport{padding:14px}
  .rkp-card-panel{padding:14px}
  .rkp-stats{gap:10px}
  .rkp-col__head{padding:11px 13px}
  .rkp-col__body{padding:0 10px 4px;gap:8px}
}
@media(max-width:640px){
  .rkp-viewport{padding:11px}
  .rkp-card-panel{padding:12px;border-radius:12px}
  .rkp-board{gap:10px}
}
@media(max-width:440px){
  .rkp-viewport{padding:9px}
  .rkp-subbar{padding:9px 12px}
}

/* --- 5. invoice line: single column on small phones (was 5 fixed columns) --- */
@media(max-width:560px){
  .rkp-invline{grid-template-columns:1fr;gap:6px;padding:10px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px}
  .rkp-invline input{width:100%}
}

/* --- 6. large screens / 4K: center the content column (chrome stays aligned
   because .rkp-main is a flex column — its padding insets header, toolbar
   and viewport together). max() keeps normal desktops untouched. --- */
@media(min-width:2000px){
  .rkp-main{
    padding-left:max(0px,calc((100% - 1980px)/2));
    padding-right:max(0px,calc((100% - 1980px)/2));
  }
}

/* ============================================================
   v4.3.0 — custom sign-in screen: a glass login card over the
   heavily-blurred, non-interactive app shell. Append-only.
   ============================================================ */
.rkp-sk{background:rgba(255,255,255,.06);border-radius:6px}

/* blurred, dimmed app behind the login (decorative, not interactive) */
.rkp-login-bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;user-select:none;
  filter:blur(16px) saturate(1.05) brightness(.62);transform:scale(1.06);transform-origin:center}
.rkp-login-bg .rkp-app{height:100vh}

/* full-screen scrim + centering for the card */
.rkp-login{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(120% 120% at 50% 0%,rgba(0,87,255,.12),transparent 60%),rgba(3,4,10,.55);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}

.rkp-login__card{width:100%;max-width:380px;padding:34px 30px;border:1px solid var(--line);border-radius:18px;
  background:rgba(14,17,27,.62);backdrop-filter:blur(28px) saturate(1.3);-webkit-backdrop-filter:blur(28px) saturate(1.3);
  box-shadow:0 40px 100px -30px rgba(0,0,0,.8);animation:rkplogin .42s cubic-bezier(.22,1,.36,1)}
@keyframes rkplogin{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}

.rkp-login__logo{height:30px;width:auto;display:block;margin-bottom:22px}
.rkp-login__h{font-size:22px;font-weight:800;letter-spacing:-.02em;margin-bottom:4px}
.rkp-login__sub{font-size:13.5px;line-height:1.5;color:var(--muted);margin-bottom:22px}

.rkp-login__field{display:block;margin-bottom:14px}
.rkp-login__field span{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:6px}
.rkp-login__field input{width:100%;box-sizing:border-box;background:rgba(255,255,255,.04);border:1px solid var(--line);
  color:#fff;font-family:inherit;font-size:14px;padding:12px 13px;border-radius:11px;outline:none;
  transition:border-color .14s,box-shadow .14s}
.rkp-login__field input:focus{border-color:rgba(0,87,255,.6);box-shadow:0 0 0 3px rgba(0,87,255,.18)}

.rkp-login__row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 20px;font-size:13px}
.rkp-login__remember{display:flex;align-items:center;gap:8px;color:var(--muted);cursor:pointer;user-select:none}
.rkp-login__remember input{width:16px;height:16px;accent-color:var(--blue)}
.rkp-login__forgot{color:#7aa8ff;text-decoration:none;white-space:nowrap}
.rkp-login__forgot:hover{text-decoration:underline}

.rkp-login__btn{width:100%;border:none;color:#fff;font-family:inherit;font-weight:700;font-size:15px;padding:13px;
  border-radius:12px;cursor:pointer;background:linear-gradient(135deg,#0a63ff,#0047d6);
  box-shadow:0 14px 30px -12px rgba(0,87,255,.8);transition:transform .14s,filter .14s}
.rkp-login__btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.rkp-login__btn:disabled{opacity:.65;cursor:default;transform:none;filter:none}

.rkp-login__err{display:none;background:rgba(220,38,38,.14);border:1px solid rgba(220,38,38,.4);color:#fca5a5;
  font-size:13px;line-height:1.45;padding:10px 12px;border-radius:10px;margin-bottom:16px}
.rkp-login__err.is-show{display:block}
.rkp-login__foot{margin-top:18px;text-align:center;font-size:12px;color:var(--faint)}

@media(max-width:440px){
  .rkp-login{padding:14px}
  .rkp-login__card{padding:26px 20px;border-radius:16px}
  .rkp-login-bg{filter:blur(12px) brightness(.6)}
}

/* ============================================================
   v4.3.1 — enforce the 1px-corner rule on all form controls,
   inputs and the login/public forms (true circles stay round).
   Append-only; later rules win.
   ============================================================ */
/* any input / textarea / select in the app or login/public pages */
.rkp input,.rkp textarea,.rkp select,
#rkp-app input,#rkp-app textarea,#rkp-app select{border-radius:1px}
/* toolbar form controls that were still rounded */
.rkp-search,.rkp-filter,.rkp-seg,.rkp-seg button{border-radius:1px}
/* sign-in form: card, fields, button, error — match specificity so they win */
.rkp-login__card,.rkp-login__err,.rkp-login__btn,.rkp-login__field input{border-radius:1px}
/* public form container + submit */
.rkp-pubform,.rkp-pubform .rkp-btn{border-radius:1px}

/* ============================================================
   v4.4.0 — mobile scroll fix, full-screen mobile/tablet search,
   login password show/hide. Append-only; later rules win.
   ============================================================ */

/* ---- 1. MOBILE/TABLET VERTICAL SCROLL FIX ----
   The document body is overflow:hidden, so scrolling lived inside .rkp-viewport
   while nested .rkp-col__body scrollers fought touch on the stacked board.
   Make #rkp-app the single scroll container and drop the inner scrollers, and
   keep the top bar pinned. */
@media(max-width:880px){
  .rkp-app{height:100vh;height:100dvh}
  #rkp-app{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  .rkp-main{overflow:visible}
  .rkp-viewport{overflow:visible}
  .rkp-col__body{overflow:visible;max-height:none}
  .rkp-top{position:sticky;top:0;z-index:45;background:rgba(6,8,16,.74);
    backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2)}
}

/* ---- 2. FULL-SCREEN SEARCH (mobile + tablet) ----
   close button on top, one centered input with a search icon inside it. */
.rkp-topsearch__close{display:none}
.rkp-topsearch__bar{display:contents}
@media(max-width:880px){
  .rkp-topsearch.is-open .rkp-topsearch__field{
    position:fixed;inset:0;z-index:140;width:100%;max-width:100%;border:none;box-shadow:none;
    display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
    padding:72px 18px 18px;gap:0;
    background:rgba(3,4,10,.84);backdrop-filter:blur(22px) saturate(1.2);-webkit-backdrop-filter:blur(22px) saturate(1.2);
    animation:rkpfade .16s ease;
  }
  .rkp-topsearch__close{display:flex;position:absolute;top:14px;right:14px;width:42px;height:42px;
    align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid var(--line);
    color:#fff;border-radius:1px;cursor:pointer}
  .rkp-topsearch__close svg{width:20px;height:20px}
  .rkp-topsearch.is-open .rkp-topsearch__bar{display:flex;position:relative;align-items:center;width:min(560px,92vw)}
  .rkp-topsearch.is-open .rkp-topsearch__ic{position:absolute;left:14px;width:18px;height:18px}
  .rkp-topsearch.is-open .rkp-topsearch__ic svg{width:18px;height:18px}
  .rkp-topsearch.is-open .rkp-topsearch__field input,
  .rkp-topsearch.is-open .rkp-topsearch__field input:focus{
    width:100%;font-size:16px;padding:15px 16px 15px 44px;background:rgba(255,255,255,.06);
    border:1px solid var(--line);border-radius:1px}
  .rkp-topsearch.is-open .rkp-gsearch__results{position:static;width:min(560px,92vw);margin-top:10px;
    min-width:0;max-height:62vh;overflow-y:auto;background:transparent;border:none;box-shadow:none}
}

/* ---- 3. LOGIN: password show/hide eye ---- */
.rkp-login__pw{position:relative;display:block}
.rkp-login__pw input{padding-right:46px}
.rkp-login__eye{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:36px;height:36px;
  display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--muted);
  cursor:pointer;border-radius:1px;transition:color .14s}
.rkp-login__eye:hover{color:#fff}
.rkp-login__eye svg{width:18px;height:18px}

/* ============================================================
   v4.4.1 — fix: full-screen mobile search overlay was trapped inside the
   top bar. The v4.4.0 sticky top bar used backdrop-filter, which makes an
   element the containing block for position:fixed descendants — so the
   fixed search overlay only covered the top bar instead of the viewport.
   Use a solid sticky-bar background (no backdrop-filter) to release it.
   ============================================================ */
@media(max-width:880px){
  .rkp-top{background:rgba(6,8,16,.94);backdrop-filter:none;-webkit-backdrop-filter:none}
  /* reassert the overlay's own scrim + heavy blur now that it fills the screen */
  .rkp-topsearch.is-open .rkp-topsearch__field{
    background:rgba(3,4,10,.9);
    backdrop-filter:blur(26px) saturate(1.2);-webkit-backdrop-filter:blur(26px) saturate(1.2);
  }
}

/* ============================================================
   v4.4.2 — remove stray "yellow" outlines.
   Interactive elements had no focus style, so the browser drew its default
   focus ring in the OS accent colour (amber/yellow on some systems) when
   clicked or tabbed. Suppress that; show a subtle brand-blue ring only for
   keyboard focus (accessible). Also kill Chrome's yellow autofill fill.
   ============================================================ */
.rkp :focus{outline:none}
.rkp :focus-visible{outline:2px solid rgba(0,87,255,.55);outline-offset:1px;border-radius:1px}

/* Chrome/Safari autofill paints inputs yellow — keep them on-theme */
.rkp input:-webkit-autofill,
.rkp input:-webkit-autofill:hover,
.rkp input:-webkit-autofill:focus,
.rkp input:-webkit-autofill:active{
  -webkit-text-fill-color:#fff;
  -webkit-box-shadow:0 0 0 1000px rgba(255,255,255,.04) inset;
  box-shadow:0 0 0 1000px rgba(255,255,255,.04) inset;
  caret-color:#fff;
  transition:background-color 99999s ease 0s;
}

/* ============================================================
   v4.4.3 — fix the amber "yellow line" down the left edge.
   The Home "Assigned to you" row (.rkp-home__task) had no positioning, so its
   absolute 3px priority bar (.rkp-card__pr) anchored to the viewport and
   painted a full-height amber stripe over the sidebar. Anchor it to the row.
   ============================================================ */
.rkp-home__task{position:relative;overflow:hidden}

/* ============================================================
   v4.5.0 — unique gradient priority colours + richer project cards
   + admin-configurable client tabs (CSS for the toggles).
   ============================================================ */

/* priority indicators — a distinct gradient per level (bars, dots, fills) */
.rkp-pr--low,.rkp-fill--pr-low{background:linear-gradient(160deg,#3ddc97,#0ea371)}
.rkp-pr--medium,.rkp-fill--pr-medium{background:linear-gradient(160deg,#ffd14d,#f59e0b)}
.rkp-pr--high,.rkp-fill--pr-high{background:linear-gradient(160deg,#ff9d5c,#ff5d8f)}
.rkp-pr--urgent,.rkp-fill--pr-urgent{background:linear-gradient(160deg,#ff5470,#c026d3)}

/* project cards — task stats + project-manager footer */
.rkp-projcard{display:flex;flex-direction:column;gap:8px}
.rkp-projcard__name{margin-bottom:0}
.rkp-projcard__desc{margin-bottom:0;min-height:0}
.rkp-projcard__stats{display:flex;flex-wrap:wrap;gap:7px}
.rkp-projstat{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:1px;padding:4px 9px}
.rkp-projstat b{color:#fff;font-weight:800}
.rkp-projstat--doing{color:#9ec2ff;background:rgba(0,87,255,.12);border-color:rgba(0,87,255,.28)}
.rkp-projstat--doing b{color:#cfe0ff}
.rkp-projcard__foot{display:flex;align-items:center;gap:8px;margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
.rkp-projcard__pmav{width:24px;height:24px;font-size:10px;flex:0 0 24px}
.rkp-projcard__pm{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* client-tabs toggle grid in Settings */
.rkp-cltabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px 16px;margin-top:6px}

/* ============================================================
   v4.6.0 — Brand-Forward treatment, app-wide.
   Black-tint glass surfaces; on hover the box border drops and a
   half-height, vertically-centred blue→dark-blue rail appears on the
   left (drawn as a background layer so it never clashes with existing
   ::before/.bar accents). Search collapses to an icon. Tokens (1px
   radius, palette, galactic bg, glass blur) are unchanged.
   ============================================================ */

/* ---- tile surfaces: black glass default + hover rail ---- */
.rkp-card,.rkp-projcard,.rkp-stat,.rkp-home__task,.rkp-ms__task{
  background-color:rgba(0,0,0,.42);background-image:none;
  backdrop-filter:blur(10px) saturate(1.06);-webkit-backdrop-filter:blur(10px) saturate(1.06);
}
.rkp-card:hover,.rkp-projcard:hover,.rkp-stat:hover,.rkp-home__task:hover,.rkp-ms__task:hover{
  border-color:transparent;
  background-color:rgba(0,0,0,.55);
  background-image:linear-gradient(180deg,#3b82ff,#0047d6 55%,#001a5e);
  background-repeat:no-repeat;background-position:left center;background-size:3px 50%;
  box-shadow:0 16px 40px -24px rgba(0,40,150,.7);
}

/* ---- list rows: hover rail only (no default tiling) ---- */
.rkp-inbox__item:hover{
  background-color:rgba(0,0,0,.3);
  background-image:linear-gradient(180deg,#3b82ff,#0047d6 55%,#001a5e);
  background-repeat:no-repeat;background-position:left center;background-size:3px 50%;
  border-color:transparent;
}

/* ---- panels & columns: black glass background ---- */
.rkp-card-panel,.rkp-col,.rkp-drawer{background-color:rgba(0,0,0,.4);background-image:none}

/* ---- top-bar icon buttons: black glass; hover clears the fill
   (eyebrow-like) + adds the rail; border removed ---- */
.rkp-topbtn{position:relative;background-color:rgba(0,0,0,.4);background-image:none}
.rkp-topbtn:hover{
  color:#fff;border-color:transparent;background-color:transparent;
  background-image:linear-gradient(180deg,#3b82ff,#0047d6 55%,#001a5e);
  background-repeat:no-repeat;background-position:left center;background-size:3px 50%;
}

/* ---- search collapses to an icon on desktop too; opens as a dropdown ---- */
@media(min-width:881px){
  .rkp-searchbtn{display:inline-flex}
  .rkp-topsearch__field{display:none}
  .rkp-topsearch{position:relative}
  .rkp-topsearch.is-open .rkp-topsearch__field{
    display:flex;flex-direction:column;gap:0;padding:0;
    position:absolute;top:calc(100% + 10px);right:0;z-index:120;width:340px;max-width:80vw;
    background:rgba(0,0,0,.62);backdrop-filter:blur(22px) saturate(1.15);-webkit-backdrop-filter:blur(22px) saturate(1.15);
    border:1px solid var(--line);border-radius:1px;box-shadow:0 30px 70px -30px rgba(0,0,0,.85);
  }
  .rkp-topsearch.is-open .rkp-topsearch__bar{display:flex;position:relative;width:100%}
  .rkp-topsearch.is-open .rkp-topsearch__ic{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px}
  .rkp-topsearch.is-open .rkp-topsearch__ic svg{width:16px;height:16px}
  .rkp-topsearch.is-open .rkp-topsearch__field input{width:100%;padding:13px 14px 13px 36px;background:transparent;border:none;font-size:14px}
  .rkp-topsearch.is-open .rkp-gsearch__results{position:static;width:100%;max-height:50vh;overflow-y:auto;border-top:1px solid var(--line)}
  .rkp-topsearch__close{display:none}
}

/* ============================================================
   v4.7.0 — pixel-clean responsiveness across the whole range
   (smallest phone → 4K). The sidebar single-open accordion is
   already enforced by state.navOpen (one key, not an array).
   ============================================================ */

/* title never overflows even when the route name is long ("CRM Pipeline") */
.rkp-top__head{min-width:0}
.rkp-top__head h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 4K / ultra-wide: slightly wider sidebar + more breathing room */
@media(min-width:1700px){
  .rkp-app{grid-template-columns:300px 1fr}
  .rkp-top{padding:24px 30px}
  .rkp-viewport{padding:28px 32px}
}

/* laptops: 4-col stats start to feel cramped — drop to 2 earlier */
@media(max-width:1180px){ .rkp-stats{grid-template-columns:repeat(2,1fr)} }

/* phone: hide Team & Settings from the top bar so Search + Bell + Avatar
   stay comfortable next to the page title and burger */
@media(max-width:640px){
  .rkp-topbtn[data-nav="team"],.rkp-topbtn[data-nav="settings"]{display:none}
  .rkp-viewport{padding:18px}
  .rkp-stats{gap:10px}
  .rkp-stats .rkp-stat{padding:14px}
}

/* small phone */
@media(max-width:430px){
  .rkp-stats{grid-template-columns:1fr;gap:8px}
  .rkp-top{gap:7px;padding:14px}
  .rkp-top__head h1{font-size:17px}
  .rkp-topbtn{width:34px;height:34px}
  .rkp-topbtn svg{width:18px;height:18px}
  .rkp-viewport{padding:14px}
  .rkp-subbar{padding:10px 12px;gap:8px}
  .rkp-cal__cell{min-height:58px;padding:5px}
}

/* smallest phone (≈320px) */
@media(max-width:340px){
  .rkp-top{padding:12px;gap:6px}
  .rkp-top__head h1{font-size:16px}
  .rkp-topbtn{width:32px;height:32px}
  .rkp-topbtn svg{width:17px;height:17px}
  .rkp-viewport{padding:12px}
  .rkp-subbar{padding:9px 10px;gap:6px}
}

/* ============================================================
   v4.7.1 — priority palette: brand-tinted (low → urgent).
   Blue → teal → amber → rose. Applied to bars/dots/fills.
   ============================================================ */
.rkp-pr--low,.rkp-fill--pr-low{background:linear-gradient(160deg,#60a5fa,#0a63ff)}
.rkp-pr--medium,.rkp-fill--pr-medium{background:linear-gradient(160deg,#5eead4,#0d9488)}
.rkp-pr--high,.rkp-fill--pr-high{background:linear-gradient(160deg,#fbbf24,#d97706)}
.rkp-pr--urgent,.rkp-fill--pr-urgent{background:linear-gradient(160deg,#fb7185,#be123c)}

/* ============================================================
   v4.8.0 — priority indicator style: pill label.
   Replaces the 3px left bar with an inline uppercase chip
   ("LOW / MED / HIGH / URG") in the priority colour.
   List view keeps its priority column (pill hidden there).
   Inbox + message-task contexts keep a small dot to stay compact.
   The workload/report stacked fills (.rkp-fill--pr-*) remain
   as the brand-tinted gradients from v4.7.1.
   ============================================================ */

/* priority colour variables (gradients + chip tones) */
.rkp-pr--low{--prc-grad:linear-gradient(160deg,#60a5fa,#0a63ff);--prc-s:#60a5fa;--prc-bg:rgba(59,130,246,.14);--prc-bd:rgba(59,130,246,.35)}
.rkp-pr--medium{--prc-grad:linear-gradient(160deg,#5eead4,#0d9488);--prc-s:#5eead4;--prc-bg:rgba(20,184,166,.14);--prc-bd:rgba(20,184,166,.35)}
.rkp-pr--high{--prc-grad:linear-gradient(160deg,#fbbf24,#d97706);--prc-s:#fbbf24;--prc-bg:rgba(245,158,11,.14);--prc-bd:rgba(245,158,11,.35)}
.rkp-pr--urgent{--prc-grad:linear-gradient(160deg,#fb7185,#be123c);--prc-s:#fb7185;--prc-bg:rgba(244,63,94,.14);--prc-bd:rgba(244,63,94,.35)}

/* base pill — overrides the absolute 3px bar */
.rkp-card__pr{
  position:static;left:auto;top:auto;right:auto;bottom:auto;
  width:auto;height:auto;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:10.5px;font-weight:800;letter-spacing:.08em;font-family:inherit;
  padding:3px 8px;border:1px solid var(--prc-bd);background:var(--prc-bg);color:var(--prc-s);
  border-radius:1px;min-width:48px;flex-shrink:0;margin:0 0 8px;
}
.rkp-card__pr.rkp-pr--low::before{content:"LOW"}
.rkp-card__pr.rkp-pr--medium::before{content:"MED"}
.rkp-card__pr.rkp-pr--high::before{content:"HIGH"}
.rkp-card__pr.rkp-pr--urgent::before{content:"URG"}

/* inside flex rows the pill is a flex item — no bottom margin needed */
.rkp-home__task .rkp-card__pr,.rkp-lt__title .rkp-card__pr,
.rkp-inbox__item .rkp-card__pr,.rkp-ms__task .rkp-card__pr{margin:0}

/* list view already shows priority in its own column — hide the pill there */
.rkp-lt__title .rkp-card__pr{display:none}

/* keep a compact dot in inbox feed + message task chips */
.rkp-inbox__item .rkp-card__pr,.rkp-ms__task .rkp-card__pr{
  display:inline-block;width:8px;height:8px;border-radius:50%;padding:0;border:none;
  background:var(--prc-grad);min-width:0
}
.rkp-inbox__item .rkp-card__pr::before,.rkp-ms__task .rkp-card__pr::before{content:none;display:none}

/* ============================================================
   v4.8.1 — force the priority pill to use the 1px brand radius
   (an earlier dot-style rule was rounding it on home-task rows).
   ============================================================ */
.rkp .rkp-home__task .rkp-card__pr,
.rkp .rkp-lt__title .rkp-card__pr,
.rkp .rkp-card .rkp-card__pr{border-radius:1px}

/* ============================================================
   v4.8.2 — inbox: a task notification showed two stacked dots
   (leading priority dot + project dot). Drop the priority dot and
   keep the project dot beside its name; pad the body so task rows
   stay aligned with comment rows (which lead with a 26px avatar).
   ============================================================ */
.rkp-inbox__item .rkp-card__pr{display:none}
.rkp-inbox__item:has(.rkp-card__pr) .rkp-inbox__body{padding-left:38px}

/* ============================================================
   v4.8.3 — inbox priority shown as a small pill at the end of the
   title line (instead of the leading dot). The leading dot stays
   hidden purely to keep task rows aligned with comment rows.
   ============================================================ */
.rkp-prpill{display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;letter-spacing:.07em;font-family:inherit;
  padding:2px 7px;border:1px solid var(--prc-bd);background:var(--prc-bg);color:var(--prc-s);border-radius:1px;flex-shrink:0;margin-left:auto;line-height:1.5}
.rkp-prpill.rkp-pr--low::before{content:"LOW"}
.rkp-prpill.rkp-pr--medium::before{content:"MED"}
.rkp-prpill.rkp-pr--high::before{content:"HIGH"}
.rkp-prpill.rkp-pr--urgent::before{content:"URG"}

/* ============================================================
   v4.9.0 — interactive Gantt (Timeline). Drag bars to move,
   drag the right edge to change the due date; dependency arrows
   drawn from each blocker to the tasks it blocks. Horizontal
   scroll keeps it usable from the smallest phone up to 4K.
   ============================================================ */
.rkp-gantt-wrap{padding:0;overflow:hidden}
.rkp-gantt__hint{display:flex;align-items:center;gap:8px;padding:11px 16px;border-bottom:1px solid var(--line);font-size:12px;color:var(--faint)}
.rkp-gantt__hint svg{width:16px;height:16px;flex:0 0 16px;color:#9ec2ff}
.rkp-gantt{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
.rkp-gantt__inner{position:relative;min-width:100%}
.rkp-gantt__head{position:absolute;left:0;top:0;border-bottom:1px solid var(--line);background:rgba(6,8,16,.55)}
.rkp-gantt__corner{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:center;padding:0 14px;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);border-right:1px solid var(--line);z-index:2}
.rkp-gantt__ticks{position:absolute;top:0}
.rkp-gantt__tick{position:absolute;top:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;border-left:1px solid rgba(255,255,255,.05)}
.rkp-gantt__tick b{font-size:10.5px;font-weight:600;color:var(--muted)}
.rkp-gantt__tick i{position:absolute;top:6px;left:4px;font-size:10px;font-weight:800;letter-spacing:.03em;color:#9ec2ff;font-style:normal;white-space:nowrap}
.rkp-gantt__tick.wknd{background:rgba(255,255,255,.025)}
.rkp-gantt__grow{position:absolute;left:0;display:flex;align-items:center;gap:8px;height:32px;padding-left:14px;font-size:12.5px;font-weight:800;color:#fff;border-bottom:1px solid var(--line);background:rgba(255,255,255,.025)}
.rkp-gantt__row{position:absolute;left:0;height:38px;border-bottom:1px solid rgba(255,255,255,.04)}
.rkp-gantt__label{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:center;padding:0 12px;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid var(--line);background:rgba(0,0,0,.3);z-index:2;user-select:none}
.rkp-gantt__bar{position:absolute;top:7px;height:24px;border-radius:1px;display:flex;align-items:center;padding:0 9px;cursor:grab;box-shadow:0 6px 16px -8px rgba(0,0,0,.7);touch-action:none;user-select:none;z-index:3}
.rkp-gantt__bar:hover{filter:brightness(1.08)}
.rkp-gantt__bartx{font-size:11px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.rkp-gantt__grip{position:absolute;right:0;top:0;bottom:0;width:11px;cursor:ew-resize;border-radius:0 1px 1px 0}
.rkp-gantt__grip:hover{background:rgba(255,255,255,.25)}
.rkp-gantt__bar.is-blocked{outline:1px dashed rgba(255,255,255,.55);outline-offset:1px;opacity:.9}
.rkp-gantt__bar.is-dragging{box-shadow:0 14px 32px -8px rgba(0,40,150,.9);z-index:6;filter:brightness(1.1)}
.rkp-gantt__bar.rkp-pr-bg--low{background:linear-gradient(160deg,#60a5fa,#0a63ff)}
.rkp-gantt__bar.rkp-pr-bg--medium{background:linear-gradient(160deg,#5eead4,#0d9488)}
.rkp-gantt__bar.rkp-pr-bg--high{background:linear-gradient(160deg,#fbbf24,#d97706)}
.rkp-gantt__bar.rkp-pr-bg--urgent{background:linear-gradient(160deg,#fb7185,#be123c)}
.rkp-gantt__today{position:absolute;top:0;width:2px;background:linear-gradient(180deg,#fb7185,rgba(251,113,133,.15));z-index:1;pointer-events:none}
.rkp-gantt__arrows{position:absolute;left:0;top:0;pointer-events:none;z-index:2;color:rgba(158,194,255,.6);overflow:visible}
.rkp-gantt__arrows path{fill:none;stroke:currentColor;stroke-width:1.5}
.rkp-gantt__arrows path[marker-end],.rkp-gantt__arrows>path{marker-end:url(#rkp-arrowh)}
.rkp-gantt__arrows marker path{fill:currentColor;stroke:none;marker-end:none}
@media(max-width:560px){
  .rkp-gantt__hint{font-size:11px;padding:10px 12px}
}

/* ============================================================
   v4.10.0 — custom task statuses editor (Settings). Status
   colours themselves are injected at runtime from RKP.statusColors
   so renamed/added statuses are styled everywhere automatically.
   ============================================================ */
.rkp-streditor{display:flex;flex-direction:column;gap:8px}
.rkp-streditor__row{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.3)}
.rkp-streditor__ord{display:flex;flex-direction:column;gap:1px}
.rkp-streditor__ord .rkp-iconbtn{width:20px;height:15px;font-size:8px;line-height:1;padding:0}
.rkp-streditor__color{width:30px;height:30px;min-width:30px;padding:0;border:1px solid var(--line);border-radius:1px;background:none;cursor:pointer}
.rkp-streditor__color::-webkit-color-swatch-wrapper{padding:2px}
.rkp-streditor__color::-webkit-color-swatch{border:none;border-radius:1px}
.rkp-streditor__label{flex:1;min-width:0}
.rkp-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.35);color:var(--muted);font-size:12px;flex-shrink:0;transition:color .15s,border-color .15s}
.rkp-iconbtn:hover{color:#fff;border-color:rgba(255,255,255,.25)}
.rkp-streditor__del:hover{color:#fb7185;border-color:rgba(251,113,133,.4)}
@media(max-width:560px){
  .rkp-streditor__row{flex-wrap:wrap;gap:8px}
  .rkp-streditor__label{flex:1 1 100%;order:3}
}

/* ============================================================
   v4.12.0 — profitability report (Reports) + cost rates.
   ============================================================ */
.rkp-ptbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rkp-ptbl{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
.rkp-ptbl th{text-align:left;font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:0 12px 10px}
.rkp-ptbl th:not(:first-child),.rkp-ptbl td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
.rkp-ptbl td{padding:11px 12px;border-top:1px solid var(--line);white-space:nowrap}
.rkp-ptbl td:first-child{white-space:normal}
.rkp-ptbl tbody tr:hover td{background:rgba(0,0,0,.28)}
.rkp-ptbl__tot td{border-top:1px solid rgba(255,255,255,.18);font-weight:800}
.rkp-marg{display:inline-block;font-size:11.5px;font-weight:800;padding:2px 8px;border-radius:1px;border:1px solid transparent}
.rkp-marg--good{color:#5fd6a4;background:rgba(29,158,117,.16);border-color:rgba(29,158,117,.4)}
.rkp-marg--ok{color:#fbbf24;background:rgba(245,158,11,.16);border-color:rgba(245,158,11,.4)}
.rkp-marg--low{color:#fb7185;background:rgba(244,63,94,.16);border-color:rgba(244,63,94,.4)}

/* ============================================================
   v4.13.0 — customizable personal dashboard (Home widgets).
   ============================================================ */
.rkp-dashw{margin-bottom:6px}
.rkp-dashw:last-child{margin-bottom:0}
.rkp-dashedit{display:flex;flex-direction:column;gap:8px}
.rkp-dashrow{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.3)}

/* ============================================================
   v4.14.0 — integrations: calendar feed (iCal), webhooks, REST.
   ============================================================ */
.rkp-icalrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rkp-icalrow input{flex:1;min-width:220px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.rkp-apilist{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.rkp-apilist code{display:block;padding:7px 10px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.32);font-size:12px;color:var(--text);white-space:nowrap;overflow-x:auto}
textarea.rkp-filter{width:100%;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.5}

/* ============================================================
   v4.15.0 — security: 2FA enrollment + login OTP field.
   ============================================================ */
.rkp-2fa-on{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rkp-2fa-secret{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:18px;letter-spacing:2px;font-weight:700;color:var(--text);background:rgba(0,0,0,.34);border:1px solid var(--line);border-radius:1px;padding:10px 12px;margin-top:6px;user-select:all;word-break:break-all}
.rkp-2fa-uri{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;width:100%;margin-top:8px}
.rkp-2fa-confirm{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:6px}
.rkp-2fa-confirm input[data-2fa-code]{max-width:140px;font-family:ui-monospace,monospace;letter-spacing:3px;text-align:center}
.rkp-2fa-err{display:none;margin-top:8px;color:#ff6b6b;font-size:13px}
.rkp-2fa-err.is-show{display:block}
.rkp-login__otp input{text-align:center;letter-spacing:6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:18px}

/* ============================================================
   v4.16.0 — AI assistant view.
   ============================================================ */
.rkp-ai-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rkp-ai-row select{flex:1;min-width:200px}
.rkp-ai-out{margin-top:12px}
.rkp-ai-out:empty{margin-top:0}
.rkp-ai-text{border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.32);padding:14px 16px;line-height:1.65;color:var(--text);font-size:14px}
.rkp-ai-loading{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;padding:6px 0}
.rkp-ai-err{display:none;color:#ff6b6b;font-size:13px;padding:6px 0}
.rkp-ai-err.is-show{display:block}

/* ============================================================
   v4.18.0 — CRM: conversation timeline (contacts & deals).
   ============================================================ */
.rkp-convo{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.rkp-convo__compose{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.rkp-convo__row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rkp-convo__row select{max-width:180px}
.rkp-convo__attach{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.3);cursor:pointer;font-size:13px;color:var(--text)}
.rkp-convo__attach:hover{background:rgba(10,99,255,.16)}
.rkp-convo__attname{font-size:12px;color:var(--muted);word-break:break-all}
.rkp-convo__feed{display:flex;flex-direction:column;gap:2px}
.rkp-convo__item{display:flex;gap:10px;align-items:flex-start;padding:10px 4px;border-bottom:1px solid rgba(255,255,255,.05);position:relative}
.rkp-convo__item:hover{background:rgba(255,255,255,.02)}
.rkp-convo__ic{width:26px;height:26px;flex:0 0 26px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(10,99,255,.16);font-size:13px}
.rkp-convo__main{flex:1;min-width:0}
.rkp-convo__meta{font-size:12px;color:var(--muted)}
.rkp-convo__meta strong{color:var(--text)}
.rkp-convo__meta em{font-style:normal;opacity:.7}
.rkp-convo__body{margin-top:3px;font-size:13.5px;line-height:1.55;color:var(--text);white-space:normal;word-break:break-word}
.rkp-convo__file{display:inline-block;margin-top:5px;font-size:12.5px;color:#5b9bff;text-decoration:none}
.rkp-convo__file:hover{text-decoration:underline}
.rkp-convo__del{position:absolute;top:8px;right:2px;background:none;border:0;color:var(--muted);cursor:pointer;font-size:12px;opacity:0;transition:opacity .15s}
.rkp-convo__item:hover .rkp-convo__del{opacity:.7}
.rkp-convo__del:hover{opacity:1;color:#ff6b6b}

/* ============================================================
   v4.19.0 — CRM: leads queue, assignment, sales roles.
   ============================================================ */
.rkp-leadlist{display:flex;flex-direction:column;gap:2px}
.rkp-lead{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:11px 12px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.28);cursor:pointer;color:var(--text)}
.rkp-lead:hover{background:rgba(10,99,255,.12);border-color:rgba(10,99,255,.4)}
.rkp-lead__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rkp-lead__title{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-lead__sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-lead__stage{flex:0 0 auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 8px;border-radius:1px;background:rgba(255,255,255,.08);color:var(--text)}
.rkp-st--lead{background:rgba(148,163,184,.22)}
.rkp-st--qualified{background:rgba(10,99,255,.22);color:#9bc0ff}
.rkp-st--proposal{background:rgba(245,158,11,.2);color:#ffce80}
.rkp-st--won{background:rgba(29,158,117,.22);color:#7fe3bf}
.rkp-st--lost{background:rgba(229,72,77,.2);color:#ff9ba0}
.rkp-lead__val{flex:0 0 auto;font-variant-numeric:tabular-nums;font-size:13px;color:var(--muted);min-width:56px;text-align:right}
.rkp-lead__own{flex:0 0 auto;display:flex;align-items:center;gap:7px;min-width:120px;justify-content:flex-end}
.rkp-lead__owner{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.rkp-lead__unassigned{font-size:12px;color:#ffce80;font-weight:600}
.rkp-assign{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.rkp-assign__cur{font-size:13px;color:var(--muted);margin-bottom:10px}
.rkp-assign__cur strong{color:var(--text)}
.rkp-assign__ctl{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.rkp-assign__ctl select{max-width:170px}
.rkp-assign__ctl input{flex:1;min-width:160px}
.rkp-assign__hist summary{cursor:pointer;font-size:13px;color:var(--muted);padding:4px 0}
.rkp-assign__h{display:flex;flex-direction:column;gap:1px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px}
@media (max-width:600px){.rkp-lead__val,.rkp-lead__owner{display:none}.rkp-lead__own{min-width:auto}}

/* ============================================================
   v4.20.0 — multi-workspace: switcher, clock, currency.
   ============================================================ */
.rkp-wsswitch{position:relative;margin:0 12px 10px}
.rkp-wsswitch__btn{display:flex;align-items:center;gap:8px;width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.34);color:var(--text);cursor:pointer;font-size:13px;font-weight:600}
.rkp-wsswitch__btn:hover{border-color:rgba(10,99,255,.5)}
.rkp-wsswitch__sym{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:linear-gradient(180deg,#0a63ff,#0047d6);color:#fff;font-size:12px;flex:0 0 20px}
.rkp-wsswitch__name{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-wsswitch__chev{opacity:.6;font-size:11px}
.rkp-wsswitch__menu{display:none;position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:40;background:rgba(12,16,28,.98);border:1px solid var(--line);border-radius:1px;box-shadow:0 14px 40px rgba(0,0,0,.5);overflow:hidden}
.rkp-wsswitch.is-open .rkp-wsswitch__menu{display:block}
.rkp-wsopt{display:flex;align-items:center;gap:9px;width:100%;padding:10px 11px;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.05);color:var(--text);cursor:pointer;font-size:13px;text-align:left}
.rkp-wsopt:last-child{border-bottom:0}
.rkp-wsopt:hover{background:rgba(10,99,255,.14)}
.rkp-wsopt.is-active{background:rgba(10,99,255,.1)}
.rkp-wsopt__sym{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.1);font-size:12px;flex:0 0 20px}
.rkp-wsopt span:nth-child(2){flex:1}
.rkp-wsopt__chk{color:#5b9bff;font-weight:700}
.rkp-wsswitch--mini{margin:0 0 10px;display:flex;justify-content:center}
.rkp-wsswitch--mini .rkp-wsswitch__btn{width:38px;height:38px;justify-content:center;padding:0;font-size:14px}
.rkp-wsswitch--mini .rkp-wsswitch__menu{left:50%;right:auto;transform:translateX(-50%);min-width:170px}
.rkp-clock{font-variant-numeric:tabular-nums;font-size:13px;color:var(--muted);padding:0 4px;white-space:nowrap;align-self:center}
@media (max-width:760px){.rkp-clock{display:none}}

/* ============================================================
   v4.21.0 — project detail tabs + per-project files.
   ============================================================ */
.rkp-ptabs{display:flex;gap:2px;padding:0 20px;border-bottom:1px solid var(--line);overflow-x:auto;background:rgba(0,0,0,.18)}
.rkp-ptab{padding:12px 14px;background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);cursor:pointer;font-size:13px;font-weight:600;white-space:nowrap}
.rkp-ptab:hover{color:var(--text)}
.rkp-ptab.is-active{color:var(--text);border-bottom-color:#0a63ff}
.rkp-pbody{display:flex;flex-direction:column;min-height:0;flex:1}
/* files */
.rkp-filehead{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:14px;flex-wrap:wrap}
.rkp-fileup{cursor:pointer}
.rkp-filelist{display:flex;flex-direction:column;gap:2px}
.rkp-filerow{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.28)}
.rkp-filerow:hover{border-color:rgba(10,99,255,.35)}
.rkp-filerow__ic{font-size:18px;flex:0 0 auto}
.rkp-filerow__name{flex:1;min-width:0;color:var(--text);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-filerow__name:hover{color:#5b9bff;text-decoration:underline}
.rkp-filerow__meta{flex:0 0 auto;font-size:12px;color:var(--muted);white-space:nowrap}
/* overview / budget */
.rkp-ovgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.rkp-ovcard{border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.3);padding:14px}
.rkp-ovcard__k{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}
.rkp-ovcard__v{font-size:24px;font-weight:800;margin-bottom:6px}
.rkp-prog{height:7px;border-radius:1px;background:rgba(255,255,255,.1);overflow:hidden;margin:4px 0}
.rkp-prog span{display:block;height:100%;background:#0a63ff;border-radius:1px}
.rkp-prog--lg{height:12px}
.rkp-ovstats{display:flex;flex-wrap:wrap;gap:14px}
.rkp-ovstat{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--muted)}
.rkp-ovstat strong{color:var(--text)}
.rkp-ovstat__dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.rkp-avrow{display:flex;gap:6px;flex-wrap:wrap}
/* timeline */
.rkp-tlhead{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:10px}
.rkp-tlrow{display:grid;grid-template-columns:180px 1fr;gap:12px;align-items:center;padding:5px 0}
.rkp-tlrow__lbl{text-align:left;background:none;border:0;color:var(--text);font-size:13px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0}
.rkp-tlrow__lbl:hover{color:#5b9bff}
.rkp-tlrow__track{position:relative;height:18px;background:rgba(255,255,255,.05);border-radius:1px}
.rkp-tlbar{position:absolute;top:3px;height:12px;border-radius:1px;min-width:3px}
/* settings rows */
.rkp-setrow{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:14px}
.rkp-setrow span{color:var(--muted)}
@media (max-width:600px){.rkp-tlrow{grid-template-columns:110px 1fr}.rkp-filerow__meta{display:none}}

/* ============================================================
   v4.22.0 — CRM enrichment: stats strip, probability, negotiation.
   ============================================================ */
.rkp-statstrip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.rkp-statx{border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.3);padding:13px 15px;display:flex;flex-direction:column;gap:3px}
.rkp-statx__k{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.rkp-statx__v{font-size:22px;font-weight:800}
.rkp-statx__s{font-size:12px;color:var(--muted)}
.rkp-deal__prob{font-size:11px;font-weight:700;color:#9bc0ff;background:rgba(10,99,255,.16);border-radius:1px;padding:2px 6px;margin-left:8px;vertical-align:middle}
.rkp-st--negotiation{background:rgba(168,85,247,.2);color:#d6b4ff}

/* ============================================================
   v4.23.0 — retainers.
   ============================================================ */
.rkp-retainerlist{display:flex;flex-direction:column;gap:2px}
.rkp-retainer{display:flex;align-items:center;gap:16px;padding:12px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.28);cursor:pointer}
.rkp-retainer:hover{border-color:rgba(10,99,255,.35)}
.rkp-retainer__main{flex:1;min-width:0}
.rkp-retainer__client{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-retainer__sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-retainer__usage{flex:0 0 200px;max-width:40%}
.rkp-retainer__bar{height:8px;border-radius:1px;background:rgba(255,255,255,.1);overflow:hidden;margin-bottom:4px}
.rkp-retainer__bar span{display:block;height:100%;border-radius:1px}
.rkp-retainer__hrs{font-size:12px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.rkp-retainer__hrs.is-over{color:#ff9ba0;font-weight:700}
@media (max-width:600px){.rkp-retainer__usage{flex-basis:120px}}

/* ============================================================
   v4.24.0 — fixed-price model: retainer fees (no hourly usage).
   ============================================================ */
.rkp-retainer__amt{flex:0 0 auto;text-align:right;min-width:140px}
.rkp-retainer__fee{font-weight:800;font-size:16px}
.rkp-retainer__per{font-size:12px;color:var(--muted);font-weight:600}
.rkp-retainer__mrr{font-size:12px;color:var(--muted)}
@media (max-width:600px){.rkp-retainer__amt{min-width:90px}}

/* ============================================================
   v4.27.0 — project overview tags + Rankrix service tags.
   ============================================================ */
.rkp-tagrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rkp-svctags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 4px}
.rkp-svctags__lbl{flex-basis:100%;font-size:12px;color:var(--muted);margin-bottom:2px}
.rkp-svctag{font-size:12px;font-weight:600;padding:5px 10px;border-radius:1px;cursor:pointer;color:var(--c,#0a63ff);background:transparent;border:1px solid var(--c,#0a63ff);opacity:.72;transition:opacity .12s,background .12s}
.rkp-svctag:hover{opacity:1}
.rkp-svctag.on{opacity:1;color:#fff;background:var(--c,#0a63ff)}
.rkp-svctag.on::before{content:"✓ "}

/* ============================================================
   v4.28.0 — products catalog + invoice discounts.
   ============================================================ */
.rkp-prodlist{display:flex;flex-direction:column;gap:2px}
.rkp-prodrow{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.28);cursor:pointer}
.rkp-prodrow:hover{border-color:rgba(10,99,255,.35)}
.rkp-prodrow__main{flex:1;min-width:0}
.rkp-prodrow__name{font-weight:600;font-size:14px}
.rkp-prodrow__desc{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-prodrow__price{font-weight:800;font-variant-numeric:tabular-nums}
/* invoice line: product · desc · qty · price · discount · amount */
.rkp-invline{display:grid;grid-template-columns:1.3fr 1.6fr 64px 90px 90px auto 24px;gap:6px;align-items:center;margin-bottom:6px}
.rkp-invline > input,.rkp-invline > select{min-width:0}
.rkp-invline__prod{font-size:12px}
.rkp-invline__disc{color:#ff9ba0}
.rkp-invline__amt{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;font-size:13px}
@media (max-width:720px){.rkp-invline{grid-template-columns:1fr 1fr;}.rkp-invline__amt{grid-column:1/2}}

/* ============================================================
   v4.29.0 — command palette (⌘K).
   ============================================================ */
.rkp-cmdk-trigger{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 10px;border:1px solid var(--line);border-radius:1px;background:rgba(0,0,0,.32);color:var(--muted);cursor:pointer;font-size:13px}
.rkp-cmdk-trigger:hover{border-color:rgba(10,99,255,.5);color:var(--ink)}
.rkp-cmdk-trigger__ic{display:inline-flex;width:15px;height:15px}
.rkp-cmdk-trigger__ic svg{width:15px;height:15px}
.rkp-cmdk-trigger__kbd,kbd.rkp-cmdk-trigger__kbd{font-family:inherit;font-size:11px;color:var(--faint);border:1px solid var(--line);border-radius:1px;padding:1px 5px;background:rgba(255,255,255,.04)}
@media (max-width:760px){.rkp-cmdk-trigger__txt,.rkp-cmdk-trigger__kbd{display:none}.rkp-cmdk-trigger{padding:0 9px}}
/* overlay */
.rkp-cmdk{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-start;justify-content:center}
.rkp-cmdk[hidden]{display:none}
.rkp-cmdk__scrim{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.rkp-cmdk__box{position:relative;width:min(640px,calc(100vw - 28px));margin-top:11vh;background:rgba(14,18,30,.98);border:1px solid var(--line);border-radius:2px;box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden;display:flex;flex-direction:column;max-height:70vh}
.rkp-cmdk__input{border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);font-size:16px;padding:16px 18px;outline:none;font-family:inherit}
.rkp-cmdk__input::placeholder{color:var(--faint)}
.rkp-cmdk__results{overflow-y:auto;padding:6px;flex:1}
.rkp-cmdk__grp{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);padding:10px 12px 4px}
.rkp-cmdk__item{display:flex;align-items:center;gap:11px;width:100%;text-align:left;padding:9px 12px;border:0;background:none;color:var(--ink);cursor:pointer;border-radius:1px;font-size:14px}
.rkp-cmdk__item.is-sel{background:rgba(10,99,255,.18)}
.rkp-cmdk__ic{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;flex:0 0 22px;border-radius:1px;background:rgba(255,255,255,.06);font-size:13px}
.rkp-cmdk__lbl{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkp-cmdk__lbl em{color:var(--faint);font-style:normal;font-size:12px}
.rkp-cmdk__none{padding:22px 16px;color:var(--muted);text-align:center;font-size:14px}
.rkp-cmdk__foot{display:flex;gap:16px;padding:9px 16px;border-top:1px solid var(--line);color:var(--faint);font-size:11px}
@media (max-width:600px){.rkp-cmdk__box{margin-top:0;width:100vw;height:100%;max-height:100vh;border:0;border-radius:0}.rkp-cmdk__foot{display:none}}

/* ============================================================
   v4.31.0 — quotes (invoice/quote tabs + quote badges).
   ============================================================ */
.rkp-segwrap{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:2px;background:rgba(0,0,0,.3);margin-bottom:14px}
.rkp-seg{display:inline-flex;align-items:center;gap:7px;padding:7px 16px;border:0;background:none;color:var(--muted);cursor:pointer;border-radius:1px;font-size:13px;font-weight:600}
.rkp-seg.is-on{background:var(--grad,linear-gradient(135deg,#0a63ff,#0047d6));color:#fff}
.rkp-segn{font-size:11px;opacity:.7;background:rgba(255,255,255,.12);padding:0 6px;border-radius:1px}
.rkp-seg.is-on .rkp-segn{background:rgba(255,255,255,.22);opacity:.95}
.rkp-badge.rkp-quote--draft{background:rgba(148,163,184,.16);color:#cbd5e1}
.rkp-badge.rkp-quote--sent{background:rgba(10,99,255,.16);color:#7aa7ff}
.rkp-badge.rkp-quote--accepted{background:rgba(29,158,117,.18);color:#34d399}
.rkp-badge.rkp-quote--declined{background:rgba(239,68,68,.16);color:#f87171}

/* ============================================================
   v4.32.0 — Won deal -> project.
   ============================================================ */
.rkp-winbox{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding:11px 13px;border:1px solid rgba(29,158,117,.4);border-radius:2px;background:rgba(29,158,117,.08)}
.rkp-winbox__done{font-weight:600;color:#34d399}
.rkp-winbox .rkp-soft{font-size:12px}

/* ============================================================
   v4.36.0 — demo data panel.
   ============================================================ */
.rkp-demook{font-weight:600;color:#34d399;margin-bottom:10px;font-size:13px}
.rkp-democreds{margin-top:4px}
.rkp-democreds code{font-size:12px}

/* ============================================================
   v4.38.0 — client welcome banner + responsive QA safeguards.
   ============================================================ */
.rkp-welcome{position:relative;margin:0 0 16px;padding:16px 42px 16px 16px;background:linear-gradient(180deg,rgba(10,99,255,.16),rgba(10,99,255,.06));border:1px solid rgba(10,99,255,.38);border-radius:2px;backdrop-filter:blur(8px)}
.rkp-welcome__h{font-weight:700;font-size:15px;margin-bottom:4px;color:#eaf1ff}
.rkp-welcome__b{font-size:13px;line-height:1.55;color:#c9d6ee;white-space:pre-wrap}
.rkp-welcome__x{position:absolute;top:8px;right:8px;width:26px;height:26px;border:0;border-radius:2px;background:rgba(255,255,255,.06);color:#c9d6ee;cursor:pointer;font-size:13px;line-height:1}
.rkp-welcome__x:hover{background:rgba(255,255,255,.12);color:#fff}

/* Make any data table wrapper scroll horizontally rather than overflow the viewport. */
.rkp-listwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rkp-listwrap .rkp-list{min-width:520px}

/* Project tab bar: allow horizontal scroll on small screens instead of wrapping/clipping. */
.rkp-ptabs{overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;scrollbar-width:thin}
.rkp-ptabs::-webkit-scrollbar{height:4px}
.rkp-ptabs .rkp-ptab{flex:0 0 auto}

@media (max-width:560px){
  /* Drawers/editors go full-width on phones. */
  .rkp-drawer{max-width:100%!important;width:100%!important}
  /* Overview cards stack cleanly. */
  .rkp-ovgrid{grid-template-columns:1fr 1fr}
  /* Stat tiles two-up. */
  .rkp-stats{grid-template-columns:1fr 1fr}
}
@media (max-width:380px){
  .rkp-ovgrid,.rkp-stats{grid-template-columns:1fr}
}

/* ============================================================
   v4.42.0 — per-project client access controls.
   ============================================================ */
.rkp-cperms{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 4px}
.rkp-cperm{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:6px 10px;border:1px solid rgba(255,255,255,.14);border-radius:2px;background:rgba(255,255,255,.04);cursor:pointer;user-select:none}
.rkp-cperm input{accent-color:#0a63ff;margin:0}
.rkp-cperm:hover{border-color:rgba(10,99,255,.5)}

/* ============================================================
   v4.43.0 — item privacy (private to agency).
   ============================================================ */
.rkp-privtoggle{display:flex;align-items:center;gap:8px;margin:12px 0 2px;padding:9px 12px;border:1px solid rgba(233,97,59,.35);border-radius:2px;background:rgba(233,97,59,.08);font-size:13px;cursor:pointer;user-select:none}
.rkp-privtoggle input{accent-color:#e9613b;margin:0}
.rkp-card.is-private{border-left:2px solid rgba(233,97,59,.7)}
.rkp-priv{filter:grayscale(.1)}
.rkp-notecard.is-private,.rkp-thread.is-private{border-left:2px solid rgba(233,97,59,.6)}

/* ============================================================
   v4.44.0 — branded inline icon alignment.
   ============================================================ */
.rkp-i{vertical-align:-.15em;flex:0 0 auto}
.rkp-mini .rkp-i,.rkp-mschip .rkp-i{vertical-align:-.18em}
.rkp-privtoggle .rkp-i{vertical-align:-.2em}
.rkp-burger .rkp-i{vertical-align:middle}

/* ============================================================
   v4.47.0 — expenses & profitability (tables, tags, section heads).
   ============================================================ */
.rkp-secthead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.rkp-secthead h3{margin:0;font-size:15px;font-weight:700;letter-spacing:-.01em}
.rkp-tablewrap{overflow-x:auto;border:1px solid rgba(255,255,255,.08);border-radius:2px;background:rgba(0,0,0,.22)}
.rkp-table{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
.rkp-table thead th{text-align:left;font-weight:600;color:rgba(255,255,255,.55);font-size:11px;text-transform:uppercase;letter-spacing:.04em;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08)}
.rkp-table tbody td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}
.rkp-table tbody tr:last-child td{border-bottom:0}
.rkp-table tbody tr:hover{background:rgba(255,255,255,.03)}
.rkp-tag{display:inline-block;font-size:11px;padding:2px 8px;border-radius:2px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.7);margin-left:6px;vertical-align:middle}
.rkp-tag--ok{background:rgba(29,158,117,.16);color:#5fd6ab}

/* ============================================================
   v4.48.0 — project health (RAG) + portfolio.
   ============================================================ */
.rkp-hdot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;vertical-align:middle;flex:0 0 auto}
.rkp-hbadge{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:2px;letter-spacing:.01em;white-space:nowrap}
.rkp-hbadge--on_track{background:rgba(29,158,117,.16);color:#5fd6ab}
.rkp-hbadge--at_risk{background:rgba(217,154,29,.18);color:#e8c06a}
.rkp-hbadge--off_track{background:rgba(233,97,59,.18);color:#f0a18a}
.rkp-ovhealth{display:flex;align-items:center;gap:12px;margin:0 0 14px;flex-wrap:wrap}
.rkp-ovhealth__note{font-size:13px;color:var(--muted)}
.rkp-pffilters{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.rkp-pfchip{font:inherit;font-size:13px;padding:6px 12px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.04);color:var(--muted);cursor:pointer}
.rkp-pfchip b{color:#fff;margin-left:2px}
.rkp-pfchip.on{border-color:rgba(10,99,255,.6);background:rgba(10,99,255,.14);color:#fff}
.rkp-pfrow__health{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rkp-pfrow__profit{font-size:13px;font-weight:700;display:flex;flex-direction:column;line-height:1.15}
.rkp-pfrow__profit em{font-style:normal;font-size:10px;color:var(--faint);font-weight:600}
.rkp-pfrow__note{display:block;font-style:normal;font-size:11px;color:var(--faint);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
@media(max-width:760px){.rkp-pfhead{display:none}.rkp-pfrow{grid-template-columns:14px 1fr auto;gap:8px}.rkp-pfrow__prog,.rkp-pfrow__budget{display:none}}

/* ============================================================
   v4.49.0 — comment attachments, autosave, client region.
   ============================================================ */
.rkp-comments__row{display:flex;align-items:center;gap:10px;margin-top:8px}
.rkp-comments__clip{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--line);border-radius:2px;cursor:pointer;color:var(--muted);flex:0 0 auto}
.rkp-comments__clip:hover{border-color:rgba(10,99,255,.5);color:#fff}
.rkp-comments__pending{flex:1;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rkp-comments__rm{background:none;border:none;color:var(--muted);cursor:pointer;padding:2px;display:inline-flex}
.rkp-comments__rm:hover{color:#e9613b}
.rkp-comments__row .rkp-btn--sm{margin-left:auto}
.rkp-comment__file{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:12px;color:#7fa8ff;text-decoration:none;background:rgba(10,99,255,.1);padding:4px 8px;border-radius:2px}
.rkp-comment__file:hover{background:rgba(10,99,255,.18)}
.rkp-autosave{font-size:12px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.rkp-autosave.is-saved{color:#5fd6ab}
.rkp-autosave::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.7}
