/* ============================================================
   KOJOH UI, marketplace pages
   Monochrome. Accent is the text colour itself.
   ============================================================ */

:root{
  --brand:#1C1A1E;
  --brand-ink:#1C1A1E;
  --brand-soft:#EFECE4;
  --brand-line:#DFDACE;
}
[data-theme="dark"]{
  --brand:#EDEBE6;
  --brand-ink:#EDEBE6;
  --brand-soft:#232127;
  --brand-line:#34313A;
}

.ds-wide{max-width:64rem;}

/* ------------------------------------------------------------ toasts */
.k-toasts{
  position:fixed; right:1.25rem; bottom:1.25rem; z-index:1200;
  display:flex; flex-direction:column; gap:0.5rem; max-width:22rem;
  pointer-events:none;
}
.k-toast{
  display:flex; align-items:center; gap:0.75rem;
  background:#1C1A1E; color:#FFFFFF; font-size:0.8125rem; line-height:1.4;
  padding:0.7rem 0.95rem; border-radius:0.75rem; box-shadow:0 10px 28px rgba(0,0,0,0.22);
  pointer-events:auto; animation:kToastIn 0.24s cubic-bezier(.2,.8,.2,1) both;
}
[data-theme="dark"] .k-toast{background:#EDEBE6; color:#1C1A1E;}
.k-toast-error{background:#B3261E !important; color:#FFFFFF !important;}
.k-toast-out{animation:kToastOut 0.2s ease both;}
.k-toast-btn{
  margin-left:auto; flex-shrink:0; background:none; border:none; cursor:pointer;
  font:inherit; font-weight:700; color:inherit; text-decoration:underline; padding:0.1rem 0.2rem;
}
@keyframes kToastIn{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;}}
@keyframes kToastOut{to{opacity:0; transform:translateY(6px);}}
@media (max-width:640px){
  .k-toasts{left:1rem; right:1rem; bottom:calc(1rem + env(safe-area-inset-bottom)); max-width:none;}
}

/* ------------------------------------------------------------ chips */
.k-chiprow{display:flex; flex-wrap:wrap; gap:0.45rem; margin:0 0 1.5rem;}
.k-chip{
  font-size:0.75rem; font-weight:600; letter-spacing:0.01em;
  padding:0.28rem 0.7rem; border-radius:999px;
  border:1px solid var(--line); background:var(--card); color:var(--muted);
}
.k-chip-brand{
  background:var(--brand); border-color:var(--brand); color:var(--bg);
}

/* ------------------------------------------------------------ text bits */
.k-sub{color:var(--muted); font-size:0.8125rem; line-height:1.6; margin:0 0 0.9rem;}
.k-sub-tight{margin:0.7rem 0 0;}
.k-err{color:#C62828;}
[data-theme="dark"] .k-err{color:#FF8A80;}

/* ------------------------------------------------------------ cards */
.k-card-soft{background:var(--brand-soft); border-color:var(--brand-line);}
.k-card-brand{background:var(--brand-soft); border-color:var(--brand-line); border-left:3px solid var(--brand);}

/* ------------------------------------------------------------ animated header strip */
.k-hero{
  position:relative; overflow:hidden;
  margin:0 0 1.5rem; padding:1.15rem 1.35rem;
  border:1px solid var(--line); border-radius:var(--radius); background:var(--card);
}
.k-hero-svg{display:block; width:100%; max-width:100%; height:auto; color:var(--text);}
.k-hero-row{
  transform-box:fill-box; transform-origin:left center;
  animation:kRowIn 0.55s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes kRowIn{
  from{transform:scaleX(0); opacity:0;}
  to{transform:scaleX(1); opacity:1;}
}
.k-hero-caret{animation:kBlink 1.15s steps(1, end) infinite;}
@keyframes kBlink{0%,49%{opacity:1;} 50%,100%{opacity:0;}}
.k-hero-sweep{
  position:absolute; top:0; bottom:0; width:38%;
  background:linear-gradient(90deg, transparent, rgba(0,0,0,0.055), transparent);
  transform:translateX(-120%);
  animation:kSweep 6.5s cubic-bezier(.4,0,.2,1) infinite 2s;
  pointer-events:none;
}
[data-theme="dark"] .k-hero-sweep{
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.055), transparent);
}
@keyframes kSweep{0%{transform:translateX(-120%);} 55%,100%{transform:translateX(320%);}}
.k-hero-foot{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  margin-top:0.7rem; font-size:0.6875rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--muted); font-family:'Space Grotesk',sans-serif; font-weight:600;
}
.k-hero-live{display:inline-flex; align-items:center; gap:0.4rem;}
.k-hero-livedot{
  width:0.4rem; height:0.4rem; border-radius:50%; background:var(--brand);
  animation:kLive 1.8s ease-in-out infinite;
}
@keyframes kLive{0%,100%{opacity:1; transform:scale(1);} 50%{opacity:0.3; transform:scale(0.7);}}

/* ------------------------------------------------------------ scroll reveal */
.k-reveal{opacity:0; transform:translateY(14px); transition:opacity 0.5s ease, transform 0.5s ease;}
.k-reveal.k-in{opacity:1; transform:none;}

@media (prefers-reduced-motion:reduce){
  .k-hero-row, .k-hero-caret, .k-hero-sweep, .k-hero-livedot{animation:none;}
  .k-reveal{opacity:1; transform:none; transition:none;}
}

/* ------------------------------------------------------------ buttons */
.k-btn{
  font-family:inherit; font-size:0.8125rem; font-weight:600; cursor:pointer;
  padding:0.55rem 1rem; border-radius:999px;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  text-decoration:none; display:inline-block; line-height:1.3; text-align:center;
  transition:background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
}
.k-btn:hover{border-color:var(--brand);}
.k-btn:disabled{opacity:0.4; cursor:default;}
.k-btn:disabled:hover{border-color:var(--line);}
.k-btn-brand{background:var(--brand); border-color:var(--brand); color:var(--bg);}
.k-btn-brand:hover{background:var(--brand); border-color:var(--brand); opacity:0.86;}
.k-btn-lg{font-size:0.9375rem; padding:0.75rem 1.6rem;}
.k-btn-block{display:block; width:100%;}
.k-btn-quiet{background:transparent; border-style:dashed; color:var(--muted); margin-top:0.75rem;}
.k-btnrow{display:flex; flex-wrap:wrap; gap:0.55rem; margin-top:1rem;}
.k-btnrow .k-btn-quiet{margin-top:0;}

/* ------------------------------------------------------------ column list */
.k-collist{display:grid; grid-template-columns:repeat(auto-fill, minmax(15rem, 1fr)); gap:0.5rem;}
.k-col{
  padding:0.55rem 0.7rem; border:1px solid var(--line); border-radius:0.6rem;
  background:var(--bg); min-width:0;
}
.k-col-extra{display:none;}
.k-collist-open .k-col-extra{display:block;}
.k-col-name{
  display:block; font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:0.8125rem; color:var(--text);
}
.k-col-desc{display:block; font-size:0.75rem; color:var(--muted); margin-top:1px; line-height:1.45;}
.k-col-locked{
  display:flex; align-items:center; gap:0.5rem;
  margin-top:0.85rem; padding:0.7rem 0.85rem;
  border:1px dashed var(--line); border-radius:0.6rem;
  font-size:0.8125rem; color:var(--muted); background:var(--brand-soft);
}
.k-col-locked svg{flex-shrink:0;}

/* ------------------------------------------------------------ data tables */
.k-tablewrap{
  overflow:auto; border:1px solid var(--line); border-radius:0.7rem; background:var(--card);
  -webkit-overflow-scrolling:touch;
}
.k-tablewrap-short{max-height:22rem;}
.k-table{border-collapse:collapse; font-size:0.75rem; white-space:nowrap; width:max-content; min-width:100%;}
.k-table th{
  position:sticky; top:0; z-index:2;
  background:var(--brand-soft); color:var(--text);
  font-family:'Space Grotesk',sans-serif; font-weight:700; text-align:left;
  padding:0.55rem 0.7rem; border-bottom:1px solid var(--brand-line);
}
.k-table td{
  padding:0.45rem 0.7rem; border-bottom:1px solid var(--line); color:var(--text);
  max-width:18rem; overflow:hidden; text-overflow:ellipsis;
}
.k-table tbody tr:hover td{background:var(--brand-soft);}
.k-cell-empty{color:var(--muted); font-style:italic; opacity:0.55;}
.k-rownum{
  position:sticky; left:0; z-index:1;
  background:var(--bg); color:var(--muted); font-weight:600; text-align:right;
}
.k-table tbody tr:hover .k-rownum{background:var(--brand-soft);}
.k-table thead th:first-child{left:0; z-index:3;}

/* ------------------------------------------------------------ task lists */
.k-tasklist{display:flex; flex-direction:column; gap:0.5rem;}
.k-task{
  display:flex; align-items:flex-start; gap:0.6rem;
  padding:0.6rem 0.8rem; background:var(--bg); border:1px solid var(--line);
  border-radius:0.6rem; font-size:0.875rem; line-height:1.55;
}
.k-task-id{
  flex-shrink:0; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.6875rem;
  color:var(--text); background:var(--brand-soft); border:1px solid var(--brand-line);
  border-radius:5px; padding:0.1rem 0.42rem; margin-top:0.12rem; min-width:1.6rem; text-align:center;
}
.k-task code{
  font-size:0.8125rem; background:var(--brand-soft); border:1px solid var(--brand-line);
  border-radius:4px; padding:0.05rem 0.3rem;
}
.k-task-ghost{min-height:2.6rem;}
.k-task-ghost .k-task-id{min-width:1.6rem; height:1.05rem;}
.k-task-ghost span:last-child{
  display:block; flex:1; height:0.7rem; border-radius:999px;
  background:var(--line); margin-top:0.4rem;
}

/* ------------------------------------------------------------ locked block */
.k-locksec{position:relative; border-radius:var(--radius); overflow:hidden; margin-top:0.25rem;}
.k-lockblur{filter:blur(6px); pointer-events:none; user-select:none; opacity:0.9;}
.k-lockover{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  gap:0.7rem; text-align:center; padding:3.5rem 1.5rem 2rem;
  background:linear-gradient(180deg, rgba(244,241,234,0.7) 0%, rgba(244,241,234,0.95) 45%, rgba(244,241,234,1) 100%);
}
[data-theme="dark"] .k-lockover{
  background:linear-gradient(180deg, rgba(20,19,23,0.72) 0%, rgba(20,19,23,0.96) 45%, rgba(20,19,23,1) 100%);
}
.k-lockicon{
  width:3.4rem; height:3.4rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--brand); color:var(--bg);
  box-shadow:0 6px 22px rgba(0,0,0,0.18);
}
.k-lockhead{
  font-family:'Space Grotesk',sans-serif; font-size:1.375rem; font-weight:700;
  margin:0.2rem 0 0; color:var(--text);
}
.k-lockbody{max-width:32rem; font-size:0.875rem; line-height:1.65; color:var(--muted); margin:0;}
.k-lockprice{
  font-family:'Space Grotesk',sans-serif; font-size:2rem; font-weight:700;
  color:var(--text); margin:0.2rem 0 0.1rem;
}
.k-locknote{font-size:0.75rem; color:var(--muted); margin:0.1rem 0 0; max-width:26rem;}
.k-locknote a{color:var(--text); font-weight:600;}

/* ------------------------------------------------------------ file list */
.k-filelist{display:flex; flex-direction:column; gap:0.4rem;}
.k-file{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:0.6rem 0.85rem; border:1px solid var(--line); border-radius:0.6rem;
  background:var(--bg); text-decoration:none; color:var(--text);
  transition:border-color 0.15s ease, background 0.15s ease;
}
.k-file:hover{border-color:var(--brand); background:var(--brand-soft);}
.k-file-name{font-size:0.8125rem; font-weight:600; min-width:0; overflow:hidden; text-overflow:ellipsis;}
.k-file-meta{font-size:0.75rem; color:var(--muted); flex-shrink:0;}

/* ------------------------------------------------------------ dataset cards */
.k-dsgrid{display:grid; grid-template-columns:repeat(auto-fill, minmax(19rem, 1fr)); gap:1rem;}
.k-dscard{
  display:flex; flex-direction:column; gap:0.6rem;
  padding:1.2rem; border:1px solid var(--line); border-radius:var(--radius);
  background:var(--card); text-decoration:none; color:inherit;
  transition:border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.k-dscard:hover{
  border-color:var(--brand); transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(0,0,0,0.10);
}
.k-dscard-top{display:flex; flex-wrap:wrap; gap:0.35rem;}
.k-dscard-title{
  font-family:'Space Grotesk',sans-serif; font-size:1.0625rem; font-weight:700;
  line-height:1.35; margin:0;
}
.k-dscard-desc{font-size:0.8125rem; color:var(--muted); line-height:1.6; margin:0; flex:1;}
.k-dscard-foot{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:0.7rem; border-top:1px solid var(--line);
}
.k-dscard-price{font-family:'Space Grotesk',sans-serif; font-size:1.125rem; font-weight:700; color:var(--text);}
.k-dscard-go{font-size:0.8125rem; font-weight:600; color:var(--muted);}

/* ------------------------------------------------------------ modals */
.k-noscroll{overflow:hidden;}
.k-modal{
  position:fixed; inset:0; z-index:1000;   /* above the nav rail at 900 */
  display:flex; align-items:center; justify-content:center; padding:1.25rem;
  background:rgba(20,19,23,0.55); backdrop-filter:blur(3px);
  animation:kFade 0.18s ease both;
}
.k-modal[hidden]{display:none;}
@keyframes kFade{from{opacity:0;} to{opacity:1;}}

.k-modal-card{
  width:100%; max-width:74rem; height:min(86vh, 54rem);
  display:flex; flex-direction:column;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,0.28);
  animation:kPop 0.22s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes kPop{from{opacity:0; transform:translateY(14px) scale(0.985);} to{opacity:1; transform:none;}}
.k-modal-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem;
  padding:1rem 1.25rem; border-bottom:1px solid var(--line); background:var(--brand-soft);
}
.k-modal-headtext{min-width:0;}
.k-modal-title{
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.9375rem;
  color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.k-modal-sub{font-size:0.75rem; color:var(--muted); margin-top:2px;}
.k-modal-close{
  flex-shrink:0; width:2rem; height:2rem; border-radius:50%; cursor:pointer;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  font-size:1.25rem; line-height:1; font-family:inherit;
}
.k-modal-close:hover{background:var(--brand); border-color:var(--brand); color:var(--bg);}
.k-modal-body{flex:1; min-height:0; overflow:hidden; padding:0.75rem; display:flex;}
.k-modal-body .k-tablewrap{border:none; border-radius:0; flex:1; min-height:0; width:100%;}
.k-modal-body .k-modal-loading{flex:1;}
.k-modal-loading{padding:3rem 1rem; text-align:center; color:var(--muted); font-size:0.875rem;}
.k-modal-foot{
  display:flex; align-items:center; justify-content:center; gap:1rem;
  padding:0.85rem 1.25rem; border-top:1px solid var(--line); background:var(--bg);
}
.k-modal-page{font-size:0.8125rem; font-weight:600; color:var(--muted); min-width:9rem; text-align:center;}

/* small dialog, auth and payment */
.k-dialog{
  position:relative; width:100%; max-width:26rem;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:2rem 1.75rem 1.6rem; text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,0.3);
  animation:kPop 0.22s cubic-bezier(.2,.8,.2,1) both;
}
.k-dialog .k-modal-close{position:absolute; top:0.85rem; right:0.85rem;}
.k-dialog-icon{
  width:3rem; height:3rem; margin:0 auto 0.9rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--brand); color:var(--bg);
}
.k-dialog-title{
  font-family:'Space Grotesk',sans-serif; font-size:1.25rem; font-weight:700;
  margin:0 0 0.5rem; color:var(--text);
}
.k-dialog-text{font-size:0.875rem; line-height:1.6; color:var(--muted); margin:0 0 1.25rem;}
.k-dialog-actions{display:flex; flex-direction:column; gap:0.5rem;}
.k-dialog-note{font-size:0.75rem; color:var(--muted); margin:0.9rem 0 0; line-height:1.55;}

/* order summary inside the payment dialog */
.k-order{
  text-align:left; border:1px solid var(--line); border-radius:0.7rem;
  background:var(--bg); padding:0.9rem 1rem; margin:0 0 1.15rem;
}
.k-order-row{
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  font-size:0.8125rem; padding:0.3rem 0;
}
.k-order-row span:first-child{color:var(--muted); min-width:0;}
.k-order-row span:last-child{font-weight:600; text-align:right;}
.k-order-total{
  border-top:1px solid var(--line); margin-top:0.45rem; padding-top:0.6rem;
  font-family:'Space Grotesk',sans-serif;
}
.k-order-total span:first-child{color:var(--text); font-weight:700;}
.k-order-total span:last-child{font-size:1.25rem; font-weight:700;}
.k-strike{text-decoration:line-through; color:var(--muted); font-weight:400; margin-right:0.4rem;}

/* spinner on the pay button */
.k-spin{
  display:inline-block; width:0.85rem; height:0.85rem; vertical-align:-2px; margin-right:0.45rem;
  border:2px solid currentColor; border-right-color:transparent; border-radius:50%;
  animation:kSpin 0.7s linear infinite;
}
@keyframes kSpin{to{transform:rotate(360deg);}}

@media (max-width:640px){
  .k-modal{padding:0;}
  .k-modal-card{height:100vh; max-width:none; border-radius:0; border:none;}
  .k-dialog{max-width:none; border-radius:var(--radius) var(--radius) 0 0; margin-top:auto;}
  .k-modal:has(.k-dialog){align-items:flex-end; padding:0;}
  .k-lockover{padding:2.5rem 1.1rem 1.75rem;}
  .k-lockprice{font-size:1.625rem;}
  .k-collist{grid-template-columns:1fr;}
}

/* ------------------------------------------------------------ dataset head */
.k-dshead{margin:0 0 1.4rem;}
.k-dstitle{
  font-family:'Space Grotesk', sans-serif;
  font-size:clamp(1.65rem, 4.2vw, 2.55rem); font-weight:700; line-height:1.12;
  letter-spacing:-0.02em; color:var(--text); margin:0 0 0.6rem;
  min-height:1.12em;
}
.k-dstitle.k-typing::after{
  content:''; display:inline-block; width:0.06em; height:0.88em;
  background:currentColor; margin-left:0.06em; vertical-align:-0.08em;
  animation:kCaret 0.75s step-end infinite;
}
@keyframes kCaret{0%,100%{opacity:1;} 50%{opacity:0;}}
.k-dslead{color:var(--muted); font-size:0.95rem; line-height:1.62; max-width:52rem; margin:0 0 1.15rem;}

/* ------------------------------------------------------------ action row */
.k-actions{display:flex; flex-wrap:wrap; gap:0.55rem; align-items:center;}
.k-act{
  display:inline-flex; align-items:center; gap:0.45rem;
  font-family:inherit; font-size:0.8125rem; font-weight:600;
  padding:0.5rem 0.9rem; border-radius:999px; cursor:pointer;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  transition:border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
}
.k-act:hover{border-color:var(--brand);}
.k-act:active{transform:scale(0.97);}
.k-act svg{flex:none;}
.k-act.on{background:var(--brand); border-color:var(--brand); color:var(--bg);}
.k-act-count{
  font-variant-numeric:tabular-nums; font-size:0.75rem;
  padding-left:0.45rem; margin-left:0.1rem;
  border-left:1px solid var(--line); color:var(--muted);
}
.k-act.on .k-act-count{border-left-color:rgba(255,255,255,0.25); color:inherit; opacity:0.75;}
.k-act-primary{background:var(--brand); border-color:var(--brand); color:var(--bg);}
.k-act-primary:hover{opacity:0.88; border-color:var(--brand);}
.k-act[disabled]{opacity:0.5; cursor:default;}
.k-act-pop{animation:kBump 0.32s cubic-bezier(.2,1.5,.4,1);}
@keyframes kBump{0%{transform:scale(1);} 45%{transform:scale(1.14);} 100%{transform:scale(1);}}

/* ------------------------------------------------------------ tabs */
.k-tabs{
  display:flex; gap:0.15rem; margin:1.6rem 0 1.5rem;
  border-bottom:1px solid var(--line);
  overflow-x:auto;
  overflow-y:hidden;          /* without this the browser computes it as auto */
  scrollbar-width:none;
}
.k-tabs::-webkit-scrollbar{display:none;}
.k-tab{
  font-family:inherit; font-size:0.875rem; font-weight:600; white-space:nowrap;
  padding:0.7rem 1.05rem; background:none; border:none; cursor:pointer;
  color:var(--muted); border-bottom:2px solid transparent; margin-bottom:-1px;
  display:inline-flex; align-items:center; gap:0.4rem;
  transition:color 0.15s ease, border-color 0.15s ease;
}
.k-tab:hover{color:var(--text);}
.k-tab.on{color:var(--text); border-bottom-color:var(--brand);}
.k-tab-lock{opacity:0.55;}
.k-tabpanel[hidden]{display:none;}
.k-tabpanel{animation:kPanelIn 0.22s ease both;}
@keyframes kPanelIn{from{opacity:0; transform:translateY(5px);} to{opacity:1; transform:none;}}

/* ------------------------------------------------------------ data card layout */
.k-split{display:grid; grid-template-columns:minmax(0,1fr) 16.5rem; gap:1.25rem; align-items:start;}
.k-split > *{min-width:0;}
@media (max-width:900px){ .k-split{grid-template-columns:minmax(0,1fr);} }
.k-aside{display:flex; flex-direction:column; gap:1rem; position:sticky; top:1rem;}
@media (max-width:900px){ .k-aside{position:static;} }
.k-asidecard{
  border:1px solid var(--line); border-radius:14px; background:var(--card); padding:1.05rem 1.1rem;
}
.k-asidecard h3{
  font-size:0.6875rem; font-weight:700; letter-spacing:0.09em; text-transform:uppercase;
  color:var(--muted); margin:0 0 0.75rem;
}
.k-fact{display:flex; justify-content:space-between; gap:0.75rem; padding:0.4rem 0; font-size:0.8125rem;}
.k-fact + .k-fact{border-top:1px solid var(--line);}
.k-fact-k{color:var(--muted);}
.k-fact-v{font-weight:600; color:var(--text); font-variant-numeric:tabular-nums;}

/* ------------------------------------------------------------ tools */
.k-tools{display:flex; flex-direction:column; gap:0.7rem;}
.k-tool{display:flex; gap:0.7rem; align-items:flex-start;}
.k-tool-mark{
  flex:none; width:1.9rem; height:1.9rem; border-radius:8px;
  border:1px solid var(--line); background:var(--bg);
  display:grid; place-items:center; font-size:0.625rem; font-weight:700;
  letter-spacing:0.02em; color:var(--text);
}
.k-tool-name{font-size:0.8125rem; font-weight:600; color:var(--text); display:block;}
.k-tool-use{font-size:0.75rem; color:var(--muted); line-height:1.5;}

/* ------------------------------------------------------------ copy prompt */
.k-promptbar{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  border:1px dashed var(--line); border-radius:12px; padding:0.9rem 1rem; margin-top:0.9rem;
}
.k-promptbar p{margin:0; font-size:0.8125rem; color:var(--muted); line-height:1.55; max-width:32rem;}
.k-phase-tools{
  display:flex; flex-wrap:wrap; gap:0.35rem; margin:0 0 0.8rem;
}
.k-ptool{
  font-size:0.6875rem; font-weight:600; letter-spacing:0.02em;
  padding:0.2rem 0.55rem; border-radius:6px;
  border:1px solid var(--line); background:var(--bg); color:var(--muted);
}

@media (prefers-reduced-motion:reduce){
  .k-dstitle.k-typing::after{animation:none;}
  .k-tabpanel, .k-act-pop{animation:none;}
}

/* ------------------------------------------------------------ challenge tasks */
/* Shared by the challenge page and the Challenge tab on a dataset. */
.chal-phase-tasks{display:flex; flex-direction:column; gap:0.6rem; margin-top:0.9rem;}
.chal-task{
  display:flex; align-items:flex-start; gap:0.65rem;
  padding:0.7rem 0.85rem; background:var(--bg); border:1px solid var(--line);
  border-radius:0.65rem; transition:opacity 0.15s ease;
}
.chal-task.done{opacity:0.5;}
.chal-task-check{
  flex-shrink:0; width:1.1rem; height:1.1rem; margin-top:0.15rem;
  accent-color:var(--brand); cursor:pointer;
}
.chal-task-body{flex:1; font-size:0.875rem; line-height:1.55;}
.chal-task-id{
  display:inline-block; font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:0.6875rem; letter-spacing:0.02em; color:var(--muted);
  background:var(--card); border:1px solid var(--line); border-radius:5px;
  padding:0.05rem 0.4rem; margin-right:0.5rem; vertical-align:middle;
}
.chal-task.done .chal-task-body{text-decoration:line-through;}
.chal-progress-bar{
  height:8px; border-radius:999px; background:var(--bg); border:1px solid var(--line);
  overflow:hidden; margin-top:0.75rem;
}
.chal-progress-fill{height:100%; background:var(--brand); transition:width 0.25s ease; width:0%;}
.chal-badge{
  display:inline-block; font-size:0.75rem; font-weight:600; padding:0.2rem 0.65rem;
  border-radius:999px; border:1px solid var(--line); background:var(--bg); margin-right:0.4rem;
}
.chal-badge.premium{background:var(--brand); color:#FFFFFF; border-color:var(--brand);}

/* ------------------------------------------------------------ challenge submit */
.chal-submit-field{margin-bottom:0.9rem;}
.chal-submit-label{display:block; font-size:0.8125rem; font-weight:600; margin-bottom:0.35rem;}
.chal-submit-input{
  width:100%; font-family:inherit; font-size:0.875rem; padding:0.65rem 0.8rem;
  border-radius:0.6rem; border:1px solid var(--line); background:var(--bg); color:var(--text);
}
.chal-submit-input:focus{outline:2px solid var(--brand); outline-offset:-1px;}
.chal-submit-gate{font-size:0.75rem; color:var(--muted); margin-top:0.6rem;}
.chal-submit-err{font-size:0.8125rem; color:#B3261E; margin-top:0.7rem;}
.chal-frozen{
  border:1px solid var(--brand-line); background:var(--brand-soft); border-radius:0.75rem;
  padding:1rem 1.1rem;
}
.chal-frozen-head{display:flex; align-items:center; gap:0.5rem; font-weight:700; margin-bottom:0.5rem;}
.chal-frozen-head svg{flex-shrink:0;}
.chal-frozen-row{font-size:0.8125rem; margin:0.35rem 0; word-break:break-all;}
.chal-frozen-row a{color:var(--text);}
.chal-status{
  display:inline-block; font-size:0.75rem; font-weight:600; padding:0.2rem 0.65rem;
  border-radius:999px; border:1px solid var(--line); background:var(--bg); white-space:nowrap;
}
.chal-status-reviewed{background:var(--brand); border-color:var(--brand); color:#FFFFFF;}
.chal-points{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.15rem;}

/* ------------------------------------------------------------ leaderboard */
.lb-row{
  display:grid; grid-template-columns:2.4rem 1fr auto; align-items:center; gap:0.9rem;
  padding:0.75rem 0.4rem; border-bottom:1px solid var(--line);
}
.lb-row:last-child{border-bottom:none;}
.lb-row.lb-me{background:var(--brand-soft); border-radius:0.6rem; padding-left:0.7rem; padding-right:0.7rem;}
.lb-rank{
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1rem; color:var(--muted);
  text-align:center;
}
.lb-rank-top{
  width:1.9rem; height:1.9rem; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--brand); color:#FFFFFF; margin:0 auto;
}
.lb-name{font-weight:600; font-size:0.9375rem; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.lb-sub{font-size:0.75rem; color:var(--muted); margin-top:1px;}
.lb-pts{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem; text-align:right; white-space:nowrap;}
.lb-pts-sub{font-size:0.6875rem; color:var(--muted); text-align:right; font-weight:400;}

/* ------------------------------------------------------------ page jump */
.k-pagejump{display:inline-flex; align-items:center; gap:0.4rem; font-size:0.75rem; color:var(--muted);}
.k-pageinput{
  width:3.4rem; text-align:center; font-family:inherit; font-size:0.8125rem; font-weight:600;
  padding:0.35rem 0.4rem; border-radius:0.5rem; border:1px solid var(--line);
  background:var(--card); color:var(--text); font-variant-numeric:tabular-nums;
}
.k-pageinput:focus{outline:2px solid var(--brand); outline-offset:-1px;}
.k-pageinput::-webkit-outer-spin-button,
.k-pageinput::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.k-pageinput{-moz-appearance:textfield;}


/* ============================================================
   UX layer: focus, loading, feedback, mobile. Shared by every page.
   ============================================================ */

/* Keyboard focus is always visible, mouse clicks stay clean. */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible,
select:focus-visible, [tabindex]:focus-visible, label:focus-within > .chal-task-check{
  outline:2px solid var(--text); outline-offset:2px; border-radius:6px;
}
.folder:focus-visible, .k-dscard:focus-visible{outline-offset:4px; border-radius:var(--radius);}

/* The floating menu button on phones sits where the page title starts. */
@media (max-width:720px){
  .page-header{padding:1.15rem 1.25rem 0.75rem 4.25rem; min-height:3.9rem;}
  .page-wrap{padding:0 1.1rem;}
  .page-card{padding:1.25rem 1.1rem;}
  .page-input, .page-textarea, .page-search-input, .chal-submit-input, .k-pageinput, input[type="search"]{font-size:16px;}
}

/* ------------------------------------------------------------ skeletons */
.k-skel{
  position:relative; overflow:hidden; background:var(--line); border-radius:8px;
}
.k-skel::after{
  content:''; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.55), transparent);
  animation:kShimmer 1.3s ease-in-out infinite;
}
[data-theme="dark"] .k-skel::after{background:linear-gradient(90deg, transparent, rgba(255,255,255,0.07), transparent);}
@keyframes kShimmer{to{transform:translateX(100%);}}
.k-skel-line{height:0.75rem; margin:0.55rem 0;}
.k-skel-title{height:1.6rem; width:62%; margin:0.4rem 0 0.9rem; border-radius:10px;}
.k-skel-card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.3rem; margin-bottom:1rem;
}
.k-skel-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(17rem, 1fr)); gap:1rem;}
@media (prefers-reduced-motion:reduce){ .k-skel::after{animation:none;} }

/* ------------------------------------------------------------ breadcrumb */
.k-crumbs{
  display:flex; align-items:center; flex-wrap:wrap; gap:0.35rem;
  font-size:0.8125rem; color:var(--muted); margin:0 0 0.9rem;
}
.k-crumbs a{color:var(--muted); text-decoration:none; font-weight:600;}
.k-crumbs a:hover{color:var(--text); text-decoration:underline;}
.k-crumbs span[aria-hidden]{opacity:0.5;}

/* ------------------------------------------------------------ filter chips */
.k-filterbar{display:flex; flex-wrap:wrap; align-items:center; gap:0.45rem; margin:0 0 1.25rem;}
.k-fchip{
  font-family:inherit; font-size:0.8125rem; font-weight:600; cursor:pointer;
  padding:0.42rem 0.85rem; border-radius:999px; min-height:2.1rem;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  transition:background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.k-fchip:hover{border-color:var(--text);}
.k-fchip.on{background:var(--text); border-color:var(--text); color:var(--bg);}
.k-fchip-count{opacity:0.6; font-weight:500; margin-left:0.25rem; font-variant-numeric:tabular-nums;}
.k-sortsel{
  margin-left:auto; font-family:inherit; font-size:0.8125rem; font-weight:600;
  padding:0.42rem 0.75rem; border-radius:999px; border:1px solid var(--line);
  background:var(--card); color:var(--text); cursor:pointer; min-height:2.1rem;
}
@media (max-width:640px){
  .k-filterbar{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-right:-1.1rem; padding-right:1.1rem;}
  .k-filterbar::-webkit-scrollbar{display:none;}
  .k-fchip, .k-sortsel{flex-shrink:0;}
  .k-sortsel{margin-left:0;}
}

/* ------------------------------------------------------------ dataset card extras */
.k-dscard-desc{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.k-dscard-flag{
  display:inline-flex; align-items:center; gap:0.3rem;
  font-size:0.6875rem; font-weight:700; letter-spacing:0.02em;
  padding:0.22rem 0.6rem; border-radius:999px;
  background:var(--brand-soft); border:1px solid var(--brand-line); color:var(--text);
}
.k-dscard-flag-owned{background:#E7F3E8; border-color:#BFDDC2; color:#1F5A27;}
[data-theme="dark"] .k-dscard-flag-owned{background:#1E3321; border-color:#2F4F33; color:#A8D8AE;}
.k-dscard-flag-low{background:#FFF1D6; border-color:#F2D79C; color:#7A4A00;}
[data-theme="dark"] .k-dscard-flag-low{background:#3A2C10; border-color:#5A4518; color:#F3CF86;}
.k-dscard-go{display:inline-flex; align-items:center; gap:0.3rem; transition:gap 0.15s ease, color 0.15s ease;}
.k-dscard:hover .k-dscard-go{color:var(--text); gap:0.5rem;}

/* ------------------------------------------------------------ buy card */
.k-buy{
  border:1px solid var(--text); border-radius:16px; background:var(--card);
  padding:1.2rem 1.15rem 1.1rem; box-shadow:0 10px 30px rgba(0,0,0,0.06);
}
.k-buy-price{
  font-family:'Space Grotesk',sans-serif; font-size:1.9rem; font-weight:700; line-height:1;
  color:var(--text); display:flex; align-items:baseline; gap:0.5rem; flex-wrap:wrap;
}
.k-buy-was{font-size:0.95rem; font-weight:500; color:var(--muted); text-decoration:line-through;}
.k-buy-note{font-size:0.75rem; color:var(--muted); margin:0.4rem 0 0.9rem; line-height:1.5;}
.k-buy-list{list-style:none; display:flex; flex-direction:column; gap:0.45rem; margin:0 0 1rem; padding:0;}
.k-buy-list li{display:flex; gap:0.5rem; align-items:flex-start; font-size:0.8125rem; line-height:1.45; color:var(--text);}
.k-buy-list svg{flex-shrink:0; margin-top:0.12rem;}
.k-buy-stock{
  display:flex; align-items:center; justify-content:space-between; gap:0.5rem;
  font-size:0.75rem; color:var(--muted); margin-top:0.85rem;
}
.k-buy-stockbar{flex:1; height:5px; border-radius:999px; background:var(--line); overflow:hidden;}
.k-buy-stockbar span{display:block; height:100%; background:var(--text); border-radius:999px;}
.k-buy-stock.low{color:#9A5B00;}
.k-buy-stock.low .k-buy-stockbar span{background:#D98A00;}
.k-buy-owned{border-color:var(--brand-line); background:var(--brand-soft); box-shadow:none;}
.k-buy-owned .k-btn{width:100%; margin-top:0.45rem;}
.k-buy-ownedhead{display:flex; align-items:center; gap:0.5rem; font-weight:700; font-size:0.9375rem; margin-bottom:0.25rem;}

/* A buy bar that follows the reader on phones. */
.k-stickycta{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:880;
  padding:0.7rem 1rem calc(0.7rem + env(safe-area-inset-bottom));
  background:var(--card); border-top:1px solid var(--line);
  box-shadow:0 -8px 24px rgba(0,0,0,0.08);
  align-items:center; justify-content:space-between; gap:0.9rem;
  transform:translateY(110%); transition:transform 0.28s cubic-bezier(.2,.8,.2,1);
}
.k-stickycta.show{transform:none;}
.k-stickycta-price{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.2rem; line-height:1.1;}
.k-stickycta-sub{font-size:0.6875rem; color:var(--muted);}
.k-stickycta .k-btn{flex-shrink:0;}
@media (max-width:900px){
  .k-stickycta{display:flex;}
  body.has-stickycta .page-wrap{padding-bottom:5.5rem;}
}

/* ------------------------------------------------------------ library */
.k-lib{display:flex; flex-direction:column; gap:0.9rem;}
.k-libcard{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem 1.5rem; align-items:center;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.2rem 1.3rem;
}
.k-libcard-title{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.02rem; line-height:1.35; margin:0 0 0.3rem;}
.k-libcard-title a{color:inherit; text-decoration:none;}
.k-libcard-title a:hover{text-decoration:underline;}
.k-libcard-meta{display:flex; flex-wrap:wrap; gap:0.4rem; margin:0 0 0.75rem;}
.k-libcard-actions{display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:flex-end;}
.k-libcard-files{grid-column:1 / -1;}
.k-progline{display:flex; align-items:center; gap:0.7rem; font-size:0.75rem; color:var(--muted); font-variant-numeric:tabular-nums;}
.k-progline-bar{flex:1; max-width:18rem; height:6px; border-radius:999px; background:var(--bg); border:1px solid var(--line); overflow:hidden;}
.k-progline-bar span{display:block; height:100%; background:var(--text); border-radius:999px;}
@media (max-width:640px){
  .k-libcard{grid-template-columns:1fr; padding:1.1rem;}
  .k-libcard-actions{justify-content:stretch;}
  .k-libcard-actions > *{flex:1;}
}

/* ------------------------------------------------------------ challenge extras */
.chal-phase-head{display:flex; align-items:baseline; justify-content:space-between; gap:1rem;}
.chal-phase-count{
  flex-shrink:0; font-size:0.75rem; font-weight:700; color:var(--muted);
  font-variant-numeric:tabular-nums; padding:0.15rem 0.55rem; border-radius:999px;
  border:1px solid var(--line); background:var(--bg);
}
.chal-phase-count.full{background:var(--text); border-color:var(--text); color:var(--bg);}
.chal-task{cursor:pointer;}
.chal-task:hover{border-color:var(--muted);}
.chal-task:has(input:disabled){cursor:default;}
.chal-task:has(input:disabled):hover{border-color:var(--line);}
.chal-ready{
  display:none; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  margin-top:0.9rem; padding:0.8rem 0.95rem; border-radius:0.75rem;
  background:var(--text); color:var(--bg); font-size:0.8125rem; font-weight:600;
}
.chal-ready.show{display:flex;}
.chal-ready .k-btn{background:var(--bg); color:var(--text); border-color:var(--bg);}
.chal-stickyprog{
  position:sticky; top:0; z-index:5; margin:0 -0.25rem 1rem; padding:0.6rem 0.25rem;
  background:var(--bg); display:flex; align-items:center; gap:0.75rem;
  font-size:0.75rem; font-weight:600; color:var(--muted); font-variant-numeric:tabular-nums;
}
.chal-stickyprog .chal-progress-bar{flex:1; margin:0;}

/* ------------------------------------------------------------ leaderboard extras */
.lb-me-card{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  background:var(--text); color:var(--bg); border-radius:var(--radius); padding:1.1rem 1.3rem; margin-bottom:1.25rem;
}
.lb-me-card .lb-me-rank{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.9rem; line-height:1;}
.lb-me-card .lb-me-sub{font-size:0.8125rem; opacity:0.75; margin-top:0.25rem;}
.lb-me-card a{color:inherit; font-weight:700; font-size:0.8125rem;}
.lb-how{display:grid; grid-template-columns:repeat(auto-fit, minmax(12rem,1fr)); gap:0.75rem; margin-top:0.25rem;}
.lb-how div{border:1px solid var(--line); border-radius:0.8rem; padding:0.8rem 0.9rem; background:var(--bg); font-size:0.8125rem; line-height:1.5; color:var(--muted);}
.lb-how strong{display:block; color:var(--text); font-family:'Space Grotesk',sans-serif; margin-bottom:0.15rem;}

/* ------------------------------------------------------------ search extras */
.k-suggest{display:flex; flex-wrap:wrap; gap:0.4rem; margin:-0.6rem 0 1.4rem;}
.k-suggest-label{font-size:0.75rem; color:var(--muted); align-self:center; margin-right:0.2rem;}
.k-resultmeta{font-size:0.8125rem; color:var(--muted); margin:0 0 0.85rem;}
.page-search-wrap{transition:border-color 0.15s ease, box-shadow 0.15s ease;}
.page-search-wrap:focus-within{border-color:var(--text); box-shadow:0 0 0 3px var(--brand-soft);}
.k-search-clear{
  background:none; border:none; cursor:pointer; color:var(--muted); font-size:1.15rem; line-height:1;
  width:1.8rem; height:1.8rem; border-radius:50%; display:none; align-items:center; justify-content:center;
}
.k-search-clear:hover{background:var(--bg); color:var(--text);}
.k-search-clear.show{display:inline-flex;}

/* ------------------------------------------------------------ small screens: tap targets */
@media (max-width:640px){
  .k-btn{min-height:2.5rem;}
  .ds-item-bookmark{width:2.5rem; height:2.5rem;}
  .k-act{min-height:2.5rem;}
}


/* ------------------------------------------------------------ home */
.folder.is-soon .folder-body{filter:saturate(0.55); opacity:0.82;}
.folder.is-soon .folder-tab{filter:saturate(0.55);}
.folder.is-soon .folder-link{text-decoration:none; opacity:0.75; font-weight:600;}
.folder.is-soon:hover{transform:none;}
.folder.is-soon:hover .folder-body{opacity:0.92;}
.list-link{color:inherit; text-decoration:none; border-radius:10px; transition:background 0.15s ease;}
.list-link:hover{background:var(--bg);}
.list-link:hover .ds-name{text-decoration:underline; text-underline-offset:2px;}
.list-new{
  display:inline-block; margin-left:0.45rem; vertical-align:1px;
  font-size:0.625rem; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
  padding:0.08rem 0.4rem; border-radius:999px; background:var(--text); color:var(--bg);
}
.searchbox{transition:box-shadow 0.15s ease;}
.searchbox:focus-within{box-shadow:0 0 0 4px var(--brand-soft);}
.searchbox input::-webkit-search-cancel-button{display:none;}
.searchbox-hint{
  flex-shrink:0; font-family:inherit; font-size:0.6875rem; font-weight:600; color:var(--muted);
  border:1px solid var(--line); border-radius:6px; padding:0.1rem 0.45rem; background:var(--bg);
  opacity:0; transition:opacity 0.15s ease;
}
.searchbox:focus-within .searchbox-hint{opacity:1;}
@media (max-width:640px){ .searchbox-hint{display:none;} .searchbox input{font-size:16px;} }

.chal-submit-input.ok{border-color:#3E8E4F;}
.chal-submit-input.bad{border-color:#B3261E;}
.chal-submit-hint{font-size:0.75rem; margin:0.35rem 0 0; min-height:1em; color:var(--muted);}
.chal-submit-hint.ok{color:#2E7D32;}
.chal-submit-hint.bad{color:#B3261E;}
h2.chal-phase-head{display:flex; align-items:center; justify-content:space-between; gap:1rem;}

.k-savedwrap{position:relative; display:flex;}
.k-savedwrap .k-dscard{flex:1; padding-right:3.4rem;}
.k-saved-remove{
  position:absolute; top:0.95rem; right:0.95rem; width:2.3rem; height:2.3rem; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  transition:background 0.15s ease, color 0.15s ease;
}
.k-saved-remove:hover{background:var(--text); color:var(--bg); border-color:var(--text);}

/* ------------------------------------------------------------ printing */
/* A worksheet you can carry: phases, tasks and tick boxes, nothing else.
   The app frame is a light card floating on a near black html background,
   so every one of those surfaces has to be forced back to paper white. */
@media print{
  @page{margin:14mm 12mm;}

  html{background:#FFFFFF !important;}
  body{
    background:#FFFFFF !important; color:#000000 !important;
    margin:0 !important; border-radius:0 !important; min-height:0 !important;
  }

  .ksb-rail, .ksb-overlay, .ksb-mobile-trigger, .ksb-edge,
  .page-header, .topnav-wrap, .mobile-menu, .topbar,
  .k-modal, .k-tabs, .k-actions, .k-dslead, .k-hero, .k-aside,
  .k-btnrow, .k-noprint, .chal-progress-bar, .k-stickycta, .k-toasts, .chal-stickyprog, .chal-ready, .k-crumbs, .chal-phase-count{display:none !important;}

  .main, .page-wrap{
    max-width:none !important; width:auto !important;
    margin:0 !important; padding:0 !important; overflow:visible !important;
  }

  .k-printonly{display:block !important;}

  .k-dstitle, .page-lead h1{
    font-size:16pt !important; line-height:1.2 !important;
    margin:0 0 2mm !important; color:#000000 !important; min-height:0 !important;
  }
  .k-dstitle::after{display:none !important;}   /* the typing caret */
  .page-lead p{font-size:9pt !important; color:#000000 !important; margin:0 0 3mm !important;}

  /* Let a phase flow onto the next page. Holding a whole card together is
     what left half pages blank. Individual tasks still stay whole. */
  .page-card{
    break-inside:auto; page-break-inside:auto;
    border:none !important; border-radius:0 !important; box-shadow:none !important;
    background:#FFFFFF !important; padding:0 !important; margin:0 0 6mm !important;
  }
  .page-card h2{
    font-size:11.5pt !important; color:#000000 !important;
    margin:0 0 2mm !important; padding-bottom:1mm;
    border-bottom:1px solid #000000;
    break-after:avoid; page-break-after:avoid;
  }

  .chal-phase-tasks{gap:0 !important; margin-top:2mm !important;}
  .chal-task{
    break-inside:avoid; page-break-inside:avoid;
    background:#FFFFFF !important; border:none !important;
    border-bottom:1px solid #DDDDDD !important; border-radius:0 !important;
    padding:1.8mm 0 !important; gap:2.5mm !important; opacity:1 !important;
  }
  .chal-task-body{font-size:9pt !important; line-height:1.42 !important; color:#000000 !important;}
  .chal-task-id{
    background:#FFFFFF !important; border:1px solid #777777 !important;
    color:#000000 !important; font-size:7pt !important; padding:0 0.3rem !important;
  }
  .chal-task.done .chal-task-body{text-decoration:none !important;}

  /* Native checkboxes print inconsistently, so draw them. */
  .chal-task input[type="checkbox"]{
    -webkit-appearance:none; appearance:none;
    width:3.4mm; height:3.4mm; flex:none; margin-top:0.7mm;
    border:0.35mm solid #000000; border-radius:0.5mm; background:#FFFFFF;
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
  .chal-task input[type="checkbox"]:checked{background:#000000;}

  .k-phase-tools{margin:0 0 2mm !important;}
  .k-ptool{
    background:#FFFFFF !important; border:1px solid #999999 !important;
    color:#000000 !important; font-size:7pt !important;
  }

  #dsProgLabel, #chalProgressLabel{font-size:9pt !important; color:#000000 !important; margin:0 !important;}
  .chal-badge{border:1px solid #777777 !important; background:#FFFFFF !important; color:#000000 !important;}
  .chal-badge.premium{background:#FFFFFF !important; color:#000000 !important;}

  a{color:#000000 !important; text-decoration:none !important;}
  code{background:#F1F1F1 !important; color:#000000 !important;}
}
.k-printonly{display:none;}


/* ------------------------------------------------------------ character art */
.k-dscard-artwrap, .k-art-banner{
  background:#fff; border:1px solid var(--line); border-radius:calc(var(--radius) - 4px); overflow:hidden;
}
.k-dscard-artwrap{margin:-0.2rem -0.2rem 0.1rem;}
.k-dscard-art, .k-art-banner-img{display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover;}
.k-art-banner{margin:0 0 1.5rem;}
.k-art-banner-img{aspect-ratio:3/1; object-position:center 40%;}
@media (max-width:640px){ .k-art-banner-img{aspect-ratio:3/2;} }
.k-artask{position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:1rem; background:rgba(0,0,0,0.55);}
.k-artask-box{max-width:24rem; width:100%; padding:1.5rem; border-radius:var(--radius); background:var(--card); border:1px solid var(--line); text-align:center;}
.k-artask-box h2{margin:0 0 0.5rem; font-size:1.2rem;}
.k-artask-box p{margin:0 0 1rem; color:var(--muted); font-size:0.9rem; line-height:1.6;}
.k-artask-row{display:flex; gap:0.6rem; justify-content:center; margin-bottom:0.8rem;}
.k-artask-skip{background:none; border:0; color:var(--muted); font-size:0.8rem; cursor:pointer; text-decoration:underline;}