*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#f4f7fb;color:#172033}.top{background:linear-gradient(135deg,#0753a5,#06366f);color:#fff;padding:18px max(18px,calc((100% - 1050px)/2));display:flex;justify-content:space-between;align-items:center}.top h1{margin:0;font-size:28px}.top p{margin:3px 0 0;font-size:13px;opacity:.9}.ghost{border:1px solid #ffffff66;background:#ffffff12;color:#fff;border-radius:12px;padding:9px 14px}main{max-width:1050px;margin:auto;padding:20px}.hero{background:#fff;border-radius:22px;padding:28px;box-shadow:0 8px 28px #1232  ;margin-bottom:24px}.hero h2{font-size:clamp(25px,5vw,42px);max-width:720px;margin:10px 0}.hero p{color:#64748b;max-width:680px}.pill{display:inline-block;background:#e7f0ff;color:#0753a5;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:700}h3{margin:24px 0 12px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.tool{min-height:120px;border:0;border-radius:18px;text-align:left;padding:18px;color:#fff;cursor:pointer;box-shadow:0 6px 18px #1232}.tool b{display:block;font-size:18px;margin-bottom:8px}.tool span{font-size:13px;opacity:.95}.red{background:linear-gradient(135deg,#ff3d55,#df203d)}.orange{background:linear-gradient(135deg,#ff9d24,#ff6d00)}.purple{background:linear-gradient(135deg,#8057ff,#5a35d5)}.pink{background:linear-gradient(135deg,#ff4778,#df225e)}.yellow{background:linear-gradient(135deg,#ffc62f,#ed9f00);color:#342300}.teal{background:linear-gradient(135deg,#16bda9,#078a92)}.small-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.small-grid button{background:#fff;border:1px solid #dce5f1;border-radius:16px;padding:18px 8px;font-size:24px;cursor:pointer}.small-grid span{display:block;font-size:12px;margin-top:8px}.note{margin:24px 0;background:#eaf4ff;border:1px solid #cde2fb;padding:16px;border-radius:16px}.note p{margin:5px 0;color:#53657b;font-size:14px}footer{text-align:center;padding:25px;color:#738196}.modal{position:fixed;inset:0;background:#071527aa;display:none;align-items:flex-end;justify-content:center;padding:0;z-index:10}.modal.open{display:flex}.sheet{background:#fff;width:min(760px,100%);max-height:92vh;overflow:auto;border-radius:24px 24px 0 0;padding:20px}.sheet-head{display:flex;align-items:center;justify-content:space-between;position:sticky;top:-20px;background:#fff;padding:8px 0;z-index:2}.sheet-head h3{margin:0}.sheet-head button{border:0;background:#eef2f7;width:38px;height:38px;border-radius:50%;font-size:18px}.field{margin:12px 0}.field label{display:block;font-weight:700;font-size:13px;margin-bottom:6px}.field input,.field textarea,.field select{width:100%;padding:12px;border:1px solid #ccd7e5;border-radius:11px;font:inherit}.field textarea{min-height:180px;resize:vertical}.primary,.secondary{border:0;border-radius:12px;padding:12px 16px;font-weight:700;cursor:pointer}.primary{background:#0868e8;color:#fff}.secondary{background:#edf3fb;color:#164a87}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.filebox{border:2px dashed #b9c9dc;border-radius:16px;padding:24px;text-align:center;background:#f8fbff}.expense-row{display:grid;grid-template-columns:1fr 1.4fr .8fr auto;gap:7px;margin:7px 0}.expense-row input{min-width:0;padding:9px;border:1px solid #ccd7e5;border-radius:9px}.template-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.template-list button{padding:14px;text-align:left;border:1px solid #dbe4ef;background:#fff;border-radius:12px}.hint{font-size:13px;color:#66778c}.status{margin-top:10px;font-size:13px;color:#08745c;font-weight:700}@media(max-width:700px){.grid{grid-template-columns:1fr 1fr}.small-grid{grid-template-columns:repeat(3,1fr)}.hero{padding:20px}.expense-row{grid-template-columns:1fr 1fr}.expense-row .amount,.expense-row button{grid-column:auto}.template-list{grid-template-columns:1fr}}@media(max-width:390px){main{padding:14px}.tool{padding:14px;min-height:110px}.tool b{font-size:16px}}
/* V2: centered full-screen tool windows */
.modal{
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}
.sheet{
  width:min(1180px,96vw) !important;
  height:min(860px,92vh) !important;
  max-height:92vh !important;
  border-radius:24px !important;
  padding:28px !important;
  overflow:auto;
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.sheet-head{
  top:-28px !important;
  padding:10px 0 18px !important;
}
#toolBody{
  max-width:1000px;
  margin:0 auto;
}
.filebox{
  min-height:260px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.field textarea{min-height:330px}
.template-list{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:700px){
  .modal{padding:10px !important}
  .sheet{
    width:100% !important;
    height:96vh !important;
    max-height:96vh !important;
    border-radius:20px !important;
    padding:18px !important;
  }
  .sheet-head{top:-18px !important}
  #toolBody{max-width:none}
  .field textarea{min-height:42vh}
  .template-list{grid-template-columns:1fr}
  .filebox{min-height:42vh}
}

.header-actions{display:flex;gap:8px;align-items:center}

/* V2 home layout: tools directly below app heading */
main{padding-top:14px}
main > section:first-child h3{margin-top:8px}
@media(max-width:700px){
  main{padding-top:10px}
  main > section:first-child h3{margin-top:6px}
}

/* V3 polished compact app home */
body{
  background:
    radial-gradient(circle at 10% 0%,rgba(40,118,255,.10),transparent 28%),
    radial-gradient(circle at 95% 25%,rgba(22,189,169,.09),transparent 24%),
    #f5f8fd;
}
.top{
  padding-top:14px;
  padding-bottom:14px;
  box-shadow:0 5px 20px rgba(7,54,111,.18);
}
.top h1{font-size:25px;letter-spacing:.4px}
.top p{font-size:11px}
main{padding-top:10px;padding-bottom:10px}
main h3{font-size:18px;margin:13px 0 9px}
.grid{gap:10px}
.tool{
  min-height:92px;
  padding:14px;
  border-radius:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 8px 20px rgba(26,43,76,.12);
  transition:transform .12s ease,box-shadow .12s ease;
}
.tool:active{transform:scale(.97)}
.tool:after{
  content:"";
  position:absolute;
  width:90px;height:90px;
  right:-30px;top:-38px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
}
.tool b{
  margin:0;
  font-size:17px;
  line-height:1.2;
  position:relative;
  z-index:1;
}
.small-grid{gap:9px}
.small-grid button{
  min-height:78px;
  padding:10px 5px;
  border-radius:18px;
  font-size:22px;
  background:linear-gradient(145deg,#fff,#f7faff);
  border:1px solid #dce6f2;
  box-shadow:0 6px 16px rgba(30,57,93,.08);
  transition:transform .12s ease;
}
.small-grid button:active{transform:scale(.96)}
.small-grid span{font-size:12px;margin-top:5px;font-weight:650}
.note{
  margin:14px 0 8px;
  padding:11px 14px;
  border-radius:16px;
}
.note b{font-size:14px}
.note p{font-size:11px;line-height:1.3;margin:3px 0}
footer{padding:10px 0 14px;font-size:11px}
.header-actions .ghost{padding:7px 10px;font-size:12px;border-radius:10px}

@media(max-width:700px){
  .top{padding:11px 16px}
  .top h1{font-size:23px}
  .top p{font-size:10px;white-space:nowrap}
  main{padding:8px 14px 4px}
  main h3{font-size:17px;margin:10px 0 7px}
  .grid{grid-template-columns:repeat(3,1fr);gap:8px}
  .tool{min-height:84px;padding:9px 7px;border-radius:17px}
  .tool b{font-size:14px}
  .small-grid{grid-template-columns:repeat(6,1fr);gap:6px}
  .small-grid button{min-height:68px;padding:8px 2px;border-radius:15px;font-size:20px}
  .small-grid span{font-size:9px;margin-top:4px}
  .note{margin-top:11px;padding:9px 11px}
  footer{padding:7px 0 10px}
}
@media(max-width:430px){
  .top h1{font-size:21px}
  .header-actions{gap:5px}
  .header-actions .ghost{font-size:10px;padding:6px 7px}
  .grid{grid-template-columns:repeat(3,1fr)}
  .tool{min-height:78px}
  .tool b{font-size:12.5px}
  .small-grid button{min-height:62px;font-size:18px}
  .small-grid span{font-size:8.5px}
}

/* V4: clean white cards, 3 columns x 2 rows for both sections */
.tool,
.red,.orange,.purple,.pink,.yellow,.teal{
  background:#fff !important;
  color:#172033 !important;
  border:1px solid #dce6f2 !important;
  box-shadow:0 7px 18px rgba(30,57,93,.08) !important;
}
.tool:after{display:none !important}
.tool b{color:#172033 !important}

.small-grid{
  grid-template-columns:repeat(3,1fr) !important;
  gap:8px !important;
}
.small-grid button{
  min-height:78px !important;
  background:#fff !important;
  border:1px solid #dce6f2 !important;
  box-shadow:0 7px 18px rgba(30,57,93,.08) !important;
  border-radius:17px !important;
  font-size:20px !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.small-grid span{
  font-size:11px !important;
  font-weight:700 !important;
  margin-top:4px !important;
}
@media(max-width:700px){
  .grid{grid-template-columns:repeat(3,1fr) !important;gap:8px !important}
  .tool{min-height:76px !important;padding:8px 5px !important}
  .tool b{font-size:12.5px !important}
  .small-grid{grid-template-columns:repeat(3,1fr) !important;gap:8px !important}
  .small-grid button{min-height:72px !important}
  .small-grid span{font-size:10.5px !important}
}

.download-toast{
 position:fixed;
 left:50%;
 bottom:24px;
 transform:translate(-50%,25px);
 width:min(420px,calc(100% - 28px));
 background:#10243f;
 color:#fff;
 padding:13px 16px;
 border-radius:15px;
 box-shadow:0 14px 35px rgba(0,0,0,.28);
 z-index:9999;
 opacity:0;
 pointer-events:none;
 transition:.22s ease;
 display:flex;
 flex-direction:column;
 gap:2px;
}
.download-toast.show{opacity:1;transform:translate(-50%,0)}
.download-toast b{font-size:14px}
.download-toast span{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.download-toast small{font-size:11px;opacity:.75}


/* ===== KUYRAPDF V7 — black + neon green card theme ===== */
:root{
  --k-bg:#05090d;
  --k-panel:#0d1821;
  --k-panel2:#101d27;
  --k-green:#22d38a;
  --k-green-soft:#159b6a;
  --k-text:#f4f7f8;
  --k-muted:#80909b;
}
html,body{
  background:var(--k-bg)!important;
  color:var(--k-text)!important;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(34,211,138,.055),transparent 38%);
  z-index:-1;
}
header,.header,.topbar,.app-header{
  background:var(--k-bg)!important;
  color:var(--k-text)!important;
}
h1,h2,h3,.brand,.title,.section-title{
  color:var(--k-text)!important;
}
p,.subtitle,.hint,.muted,small,label{
  color:var(--k-muted);
}

/* Main tool/folder cards */
.tool-card,.card,[data-tool]{
  background:linear-gradient(145deg,var(--k-panel2),var(--k-panel))!important;
  color:var(--k-text)!important;
  border:1.5px solid var(--k-green-soft)!important;
  border-radius:18px!important;
  box-shadow:
    0 0 0 1px rgba(34,211,138,.05),
    0 0 14px rgba(34,211,138,.09),
    inset 0 0 18px rgba(34,211,138,.018)!important;
}
.tool-card:hover,.card[data-tool]:hover,[data-tool]:hover{
  border-color:var(--k-green)!important;
  box-shadow:0 0 18px rgba(34,211,138,.16)!important;
}
.tool-card:active,.card[data-tool]:active,[data-tool]:active{
  transform:scale(.97);
}
.tool-card .icon,.card .icon,[data-tool] .icon,
.tool-card svg,.card svg,[data-tool] svg{
  color:var(--k-green)!important;
}
.tool-card h3,.tool-card strong,.tool-card span,
.card[data-tool] h3,.card[data-tool] strong,.card[data-tool] span,
[data-tool] h3,[data-tool] strong,[data-tool] span{
  color:var(--k-text)!important;
}

/* Dialog/tool pages */
.modal,.modal-card,.dialog,.sheet,.tool-modal,.modal-content{
  background:#091219!important;
  color:var(--k-text)!important;
  border-color:rgba(34,211,138,.35)!important;
}
input,textarea,select{
  background:#0c1821!important;
  color:var(--k-text)!important;
  border:1px solid #28414b!important;
}
input:focus,textarea:focus,select:focus{
  border-color:var(--k-green)!important;
  outline:none!important;
}
button.primary,.primary{
  background:var(--k-green)!important;
  color:#03100b!important;
}
button:not(.primary){
  border-color:rgba(34,211,138,.45);
}
.filebox{
  background:#0c1821!important;
  border-color:rgba(34,211,138,.38)!important;
}
.download-toast{
  background:#0d1b22!important;
  border:1px solid var(--k-green-soft);
}
.download-toast b{color:var(--k-green)!important}

/* Keep 3 x 2 compact mobile grid */
@media(max-width:640px){
  .tool-card,.card[data-tool],[data-tool]{
    border-radius:16px!important;
  }
}

/* ===== V8 exact compact admin-card inspired model ===== */
body{
  background:#05090d!important;
}
main,.container,.wrap,.content{
  background:transparent!important;
}

/* All 12 cards: same dark model, no white cards */
.tool-card,.card[data-tool],[data-tool]{
  background:#111c24!important;
  border:1.4px solid #16a979!important;
  border-radius:16px!important;
  min-height:126px!important;
  padding:18px 10px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  box-shadow:inset 0 0 18px rgba(20,180,125,.025)!important;
  gap:10px!important;
}
.tool-card .icon,.card[data-tool] .icon,[data-tool] .icon{
  display:block!important;
  color:#18d58d!important;
  font-size:25px!important;
  line-height:1!important;
  margin:0!important;
}
.tool-card h3,.tool-card strong,.tool-card span,
.card[data-tool] h3,.card[data-tool] strong,.card[data-tool] span,
[data-tool] h3,[data-tool] strong,[data-tool] span{
  color:#f5f7f8!important;
  opacity:1!important;
  font-weight:700!important;
  font-size:14px!important;
  line-height:1.2!important;
  margin:0!important;
}

/* alternate border accents like reference admin screen */
[data-tool="image"],[data-tool="split"],[data-tool="editor"]{
  border-color:#0788c7!important;
}
[data-tool="expenses"],[data-tool="protect"]{
  border-color:#d69b35!important;
}

/* Ensure both sections are identical grids */
.tools-grid,.grid,.create-grid,.pdf-tools-grid{
  gap:12px!important;
}
@media(max-width:640px){
  .tools-grid,.grid,.create-grid,.pdf-tools-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .tool-card,.card[data-tool],[data-tool]{
    min-height:112px!important;
    border-radius:15px!important;
    padding:14px 7px!important;
  }
  .tool-card h3,.tool-card strong,.tool-card span,
  .card[data-tool] h3,.card[data-tool] strong,.card[data-tool] span,
  [data-tool] h3,[data-tool] strong,[data-tool] span{
    font-size:13px!important;
  }
}

/* Privacy panel should also remain dark, not light blue */
.privacy,.privacy-card,.notice,.info-card{
  background:#101b23!important;
  color:#8b9aa5!important;
  border:1px solid #213541!important;
}

/* V9 definitive override */
.grid .tool,.grid .tool.red,.grid .tool.orange,.grid .tool.purple,.grid .tool.pink,.grid .tool.yellow,.grid .tool.teal,.small-grid button{
background:#111b23!important;color:#f5f7f8!important;border:1.5px solid #19b77d!important;
box-shadow:inset 0 0 16px rgba(20,190,130,.025)!important;border-radius:17px!important}
.grid .tool b{color:#f5f7f8!important;opacity:1!important;font-weight:750!important}
.small-grid button span{color:#f5f7f8!important;opacity:1!important;font-weight:750!important}
.grid .tool[data-tool="image"],.small-grid button[data-tool="split"],.small-grid button[data-tool="editor"]{border-color:#078dcc!important}
.grid .tool[data-tool="expenses"],.small-grid button[data-tool="protect"]{border-color:#d59b35!important}
.note{background:#101a22!important;border:1px solid #263944!important;color:#8797a3!important}
.note strong,.note b{color:#f3f6f7!important}.note p{color:#8797a3!important}footer{color:#667783!important}
@media(min-width:701px){main{max-width:900px!important}.grid,.small-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}.grid .tool,.small-grid button{min-height:150px!important}}
@media(max-width:700px){.grid,.small-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}.grid .tool,.small-grid button{min-height:104px!important;padding:12px 6px!important}.grid .tool b,.small-grid button span{font-size:12px!important}}

/* V10 — force every folder/tool name to be clearly visible */
.grid .tool,
.small-grid button{
  color:#ffffff !important;
}
.grid .tool *,
.small-grid button *{
  color:#ffffff !important;
  opacity:1 !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:none !important;
  filter:none !important;
}
.grid .tool b,
.grid .tool strong,
.grid .tool span:not(.ico):not(.icon),
.small-grid button b,
.small-grid button strong,
.small-grid button span:not(.ico):not(.icon){
  display:block !important;
  color:#ffffff !important;
  opacity:1 !important;
  -webkit-text-fill-color:#ffffff !important;
  font-weight:800 !important;
  letter-spacing:.1px !important;
}
.grid .tool .ico,
.grid .tool .icon,
.small-grid button .ico,
.small-grid button .icon{
  opacity:1 !important;
  -webkit-text-fill-color:initial !important;
}
/* ensure disabled-like legacy rules cannot fade the cards */
.grid .tool[disabled],.small-grid button[disabled],
.grid .tool.disabled,.small-grid button.disabled{
  opacity:1 !important;
}
