/* Shared tool-page presentation, loaded after legacy tool styles. */
.lipicode-bold .tool-experience-hero { background: radial-gradient(ellipse at 86% 80%,#b9e2ff75,transparent 50%),linear-gradient(115deg,#f4faff,#e8f5ff 70%,#def0ff); border-bottom:1px solid #dcecff; padding:18px 0 22px; color:#091541; }
.experience-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:10px; color:#50648c; font-size:.78rem; line-height:1.7; margin-bottom:17px; }
.experience-breadcrumb a { color:#244c91; text-decoration:none; }
.experience-breadcrumb a:hover { text-decoration:underline; }
.experience-hero-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr); align-items:center; gap:30px; }
.experience-title-row { display:flex; align-items:flex-start; gap:20px; }
.experience-tool-icon { display:grid; place-items:center; flex:0 0 70px; width:70px; height:76px; border:1px solid #fff9; border-radius:17px; color:white; background:linear-gradient(140deg,#32c4ff,#0065ff); box-shadow:0 8px 18px #0068ff1c; }
.experience-tool-icon svg { width:43px; height:43px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.lipicode-bold .experience-title-row h1 { margin:0 0 9px; color:#091541; font:800 clamp(2rem,3.5vw,3.4rem)/1.12 var(--font-sans); letter-spacing:-.045em; }
.experience-title-row h1 span { color:#0067ff; }
.lipicode-bold .experience-title-row p { max-width:670px; margin:0; color:#425c8b; font-size:.96rem; line-height:1.6; }
.experience-pills { display:flex; flex-wrap:wrap; gap:8px; padding:0; margin:20px 0 0; list-style:none; }
.experience-pills li { display:flex; align-items:center; gap:7px; padding:6px 11px; border:1px solid #d7eaff; border-radius:22px; background:#ffffff90; font-size:.74rem; color:#163a71; }
.experience-pills b { display:grid; place-items:center; width:18px; height:18px; border-radius:50%; color:#fff; background:#10bf86; font-size:.73rem; }
.experience-pills li:nth-child(2) b { background:#1985ff; }.experience-pills li:nth-child(3) b { background:#ffab27; }.experience-pills li:nth-child(4) b { background:#8652f4; }
.experience-hero-art { position:relative; height:180px; display:flex; justify-content:center; align-items:center; }
.experience-hero-art img { width:330px; max-width:100%; height:220px; object-fit:contain; }
.experience-hero-art > span { position:absolute; right:0; bottom:9px; padding:7px 12px; border-radius:20px; color:#1264d7; background:#ffffffb3; font-size:.75rem; font-weight:700; transform:rotate(-5deg); }
.lipicode-bold .tool-detail-page { padding:20px 0 32px!important; background:linear-gradient(180deg,#f6fbff,#fff 65%)!important; }
.lipicode-bold .tool-detail-layout { display:grid!important; grid-template-columns:minmax(0,1fr) 310px!important; gap:20px!important; align-items:start; }
.lipicode-bold .tool-detail-main { min-width:0; font-family:var(--font-sans)!important; }
.lipicode-bold .tool-detail-main > .tool-detail-heading { display:grid!important; grid-template-columns:36px minmax(0,1fr)!important; align-items:center; gap:12px; min-height:83px!important; padding:15px 18px!important; margin:0!important; border:1px solid #dceaff!important; border-bottom:0!important; border-radius:13px 13px 0 0!important; background:linear-gradient(110deg,#eff7ff,#fff)!important; }
.lipicode-bold .tool-detail-heading > .tool-detail-icon { width:34px!important; height:34px!important; border-radius:9px!important; color:#006aff!important; background:#dfedff!important; box-shadow:none!important; }
.lipicode-bold .tool-detail-heading > .tool-detail-icon svg { width:23px!important; height:23px!important; }
.lipicode-bold .tool-detail-heading h2 { margin:0!important; color:#0b1b45!important; font-size:1.05rem!important; font-weight:750; letter-spacing:-.02em; }
.lipicode-bold .tool-detail-heading p { margin:4px 0 0!important; font-size:.78rem!important; line-height:1.45!important; color:#5a6e91!important; }
.lipicode-bold .tool-detail-main > .tool-detail-workspace { min-width:0; padding:16px!important; margin:0 0 18px!important; border:1px solid #dceaff!important; border-top:0!important; border-radius:0 0 13px 13px!important; background:#fff!important; box-shadow:0 6px 22px #1f68be06!important; overflow:visible!important; }
.lipicode-bold .tool-detail-main :where(button,input,select,textarea,summary) { font-family:var(--font-sans)!important; font-size:.875rem!important; }
.lipicode-bold .tool-detail-main :where(p,li,dt,dd,label,small) { font-family:var(--font-sans)!important; color:inherit; font-size:.85rem!important; line-height:1.6!important; }
.lipicode-bold .tool-detail-main :where(h2,h3,strong) { font-family:var(--font-sans)!important; }
.lipicode-bold .tool-detail-main :where(input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]):not([type=hidden]),select,textarea) { border-color:#cbdcf3; border-radius:8px; }
.lipicode-bold .tool-detail-main textarea { line-height:1.65!important; }
.lipicode-bold .tool-detail-main :where(input,select,textarea,button,a):focus-visible { outline:3px solid #79b4ff!important; outline-offset:3px; }
.lipicode-bold .tool-detail-main :where(.upload-dropzone,.pdf-word-dropzone,.split-pdf-dropzone,.merge-pdf-dropzone) { border:1.5px dashed #80baff!important; border-radius:11px!important; background:linear-gradient(135deg,#f4faff,#fff)!important; padding:28px 16px!important; }
.lipicode-bold .tool-detail-main :where(.pdf-word-convert,.pdf-word-file-button,.merge-pdf-convert,.split-pdf-convert) { background:linear-gradient(110deg,#168cff,#005aff)!important; border-color:#0875ff!important; color:#fff!important; border-radius:10px!important; }
/* Keep existing toolbar actions anchored above their original workspace. */
.lipicode-bold .tool-detail-main:has(.wc-hero-actions) > .tool-detail-heading { padding-right:310px!important; }
.lipicode-bold .tool-detail-main:has(:is(#textImageClear,#randomWordClear,#randomNumberClear,#randomColorClear,#paletteClear,#gradientClear,#pickerClear,#converterReset,#replaceTextClear,#unitClear,#caseReset,#loanReset,#discountReset,#scientificReset)) > .tool-detail-heading { padding-right:140px!important; }
.lipicode-bold .tool-detail-main .wc-hero-actions { top:20px!important; right:16px!important; }
.lipicode-bold .tool-detail-main .wc-hero-actions button { padding:8px 10px; font-size:.75rem!important; color:#24519b; background:#f2f7ff; border-color:#dbe9ff; }
/* Word Counter: a full-width editor followed by readable result tiles. */
.lipicode-bold .tool-detail-main .wc-dashboard { grid-template-columns:minmax(0,1fr)!important; gap:14px; }
.lipicode-bold .tool-detail-main .wc-editor-wrap textarea { min-height:270px; font-family:var(--font-sans)!important; font-size:.95rem!important; color:#273d64; }
.lipicode-bold .tool-detail-main .wc-stat-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:12px; }
.lipicode-bold .tool-detail-main .wc-stat-grid > div { min-width:0; min-height:110px; padding:13px; border:1px solid #e0ebfc; border-radius:10px; background:linear-gradient(145deg,#fff,#f6faff); }
.lipicode-bold .tool-detail-main .wc-stat-grid strong { color:#006cff; font-size:1.6rem; }
.lipicode-bold .tool-detail-main .wc-stat-grid span { color:#354d77; font-size:.78rem; }
/* Older document pages have their own guidance columns: retain the content below the workspace. */
.lipicode-bold .tool-detail-main :is(.pdf-word-page-grid,.split-pdf-page-grid,.merge-pdf-page-grid) { grid-template-columns:minmax(0,1fr)!important; }
.lipicode-bold .tool-detail-main :is(.pdf-word-info,.split-pdf-info,.merge-pdf-info) { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px; }
.lipicode-bold .tool-detail-main :is(.pdf-word-info,.split-pdf-info,.merge-pdf-info) > article { min-width:0; padding:16px; border:1px solid #e0ebfc; border-radius:10px; background:#f8fbff; }
.lipicode-bold .tool-detail-main :is(.crop-image-modern,.image-pdf-modern) { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
.lipicode-bold .tool-detail-main .tool-editorial { margin-top:20px; border:1px solid #dceaff; border-radius:13px; padding:20px; background:#fff; }
.lipicode-bold .tool-detail-main .tool-editorial-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.experience-sidebar { min-width:0; display:grid; gap:14px; }
.experience-side-card { min-width:0; padding:18px; border:1px solid #dceaff; border-radius:13px; background:#fff; box-shadow:0 5px 20px #1f68be05; }
.experience-side-card h2 { margin:0 0 17px; font-size:1.12rem; line-height:1.3; font-weight:750; letter-spacing:-.025em; color:#0b1b45; }
.experience-side-card h3 { margin:0 0 3px; font-size:.83rem; color:#13254d; font-weight:700; }
.experience-side-card p { margin:0; color:#5b7094; font-size:.78rem; line-height:1.6; }
.experience-steps { list-style:none; padding:0; margin:0; display:grid; gap:21px; }
.experience-steps li { display:grid; grid-template-columns:32px minmax(0,1fr); gap:12px; align-items:start; position:relative; }
.experience-steps li > span { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; color:white; font-weight:700; background:linear-gradient(130deg,#20b6ff,#0061ff); box-shadow:0 4px 10px #0575ff25; }
.experience-steps li:not(:last-child)::after { content:""; position:absolute; height:20px; border-left:1px dashed #9ac9ff; top:35px; left:15px; }
.experience-benefits > div { display:flex; gap:12px; align-items:center; margin-bottom:17px; }
.experience-benefits > div > span { display:grid; flex:0 0 39px; place-items:center; height:39px; border-radius:11px; font-size:1.4rem; font-weight:700; }
.benefit-green { background:#e2faf2; color:#00b47b; }.benefit-blue { background:#e6f2ff; color:#0875ff; }.benefit-purple { background:#f0eaff; color:#8742ed; }
.experience-privacy-link { display:flex; justify-content:space-between; border-top:1px solid #eaf1fc; padding-top:12px; color:#1669d8; font-size:.77rem; }
.experience-related-heading { display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.experience-related-heading a { white-space:nowrap; color:#0067ff; font-size:.7rem; }.experience-related-heading h2 { margin-bottom:10px; }
.experience-related { display:grid; }
.experience-related > a { display:grid; grid-template-columns:34px minmax(0,1fr) 10px; align-items:center; gap:10px; padding:11px 0; border-top:1px solid #edf3fc; text-decoration:none; }
.experience-related > a:hover { background:#f5f9ff; }.experience-related strong { display:block; font-size:.77rem; line-height:1.4; color:#183568; }.experience-related small { display:block; margin-top:3px; font-size:.7rem; line-height:1.5; color:#60769c; }.experience-related b { color:#006aff; }
.experience-related-icon { display:grid; place-items:center; width:34px; height:36px; border-radius:9px; color:#fff; background:linear-gradient(135deg,#3abaff,#006aff); }
.experience-related > a:nth-child(3n+2) .experience-related-icon { background:linear-gradient(135deg,#bd7bff,#8832ef); }.experience-related > a:nth-child(3n) .experience-related-icon { background:linear-gradient(135deg,#04d7aa,#00ad77); }
.experience-related-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; stroke-linecap:round; }
@media(min-width:1500px) { .lipicode-bold .tool-detail-layout { grid-template-columns:minmax(0,1fr) 345px!important; } }
@media(max-width:1100px) { .lipicode-bold .tool-detail-layout { grid-template-columns:minmax(0,1fr) 275px!important; gap:15px!important; }.experience-side-card { padding:15px; }.experience-hero-art img { width:280px; }.experience-title-row { gap:14px; }.experience-tool-icon { flex-basis:58px; width:58px; height:64px; }.lipicode-bold .tool-detail-main .wc-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:980px) { .lipicode-bold .tool-detail-layout { grid-template-columns:minmax(0,1fr)!important; }.experience-sidebar { grid-template-columns:repeat(2,minmax(0,1fr)); }.experience-sidebar > :last-child { grid-column:1/-1; }.experience-related { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:20px; }.experience-hero-grid { grid-template-columns:minmax(0,1fr) 240px; gap:15px; }.experience-hero-art { height:160px; }.experience-hero-art img { height:190px; }.experience-hero-art > span { display:none; } }
@media(max-width:760px) { .experience-hero-grid { grid-template-columns:minmax(0,1fr); }.experience-hero-art { display:none; }.lipicode-bold .tool-experience-hero { padding:14px 0 20px; }.experience-breadcrumb { font-size:.7rem; margin-bottom:15px; gap:7px; }.lipicode-bold .experience-title-row h1 { font-size:2rem; }.lipicode-bold .experience-title-row p { font-size:.85rem; }.experience-tool-icon { flex-basis:48px; width:48px; height:54px; border-radius:12px; }.experience-tool-icon svg { width:31px; height:31px; }.experience-pills { margin-top:15px; gap:6px; }.experience-pills li { font-size:.68rem; padding:5px 8px; }.lipicode-bold .tool-detail-main > .tool-detail-workspace { padding:12px!important; }.lipicode-bold .tool-detail-main:has(:is(.wc-hero-actions,#textImageClear,#randomWordClear,#randomNumberClear,#randomColorClear,#paletteClear,#gradientClear,#pickerClear,#converterReset,#replaceTextClear,#unitClear,#caseReset,#loanReset,#discountReset,#scientificReset)) > .tool-detail-heading { padding:14px 14px 66px!important; }.lipicode-bold .tool-detail-main .wc-hero-actions { top:79px!important; right:14px!important; left:auto!important; }.experience-sidebar { grid-template-columns:1fr; }.experience-related { grid-template-columns:1fr; }.lipicode-bold .tool-detail-main .tool-editorial { padding:15px; }.lipicode-bold .tool-detail-main .tool-editorial-grid { grid-template-columns:1fr; } }
@media(max-width:480px) { .lipicode-bold .tool-detail-main :is(.pdf-word-info,.split-pdf-info,.merge-pdf-info,.crop-image-modern,.image-pdf-modern) { grid-template-columns:minmax(0,1fr)!important; }.lipicode-bold .tool-detail-main .wc-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.experience-title-row { gap:11px; }.lipicode-bold .experience-title-row h1 { font-size:1.8rem; } }
.lipicode-bold .tool-detail-main :is(.primary,.btn-primary-action,.random-word-primary,.compress-primary,.ai-sql-generate,.barcode-primary,.palette-primary,.crop-image-primary,.discount-primary,.hash-generate,.image-pdf-convert,.loan-primary,.merge-pdf-submit,.password-generate,.pdf-image-convert,.qr-primary,.replace-text-primary,.resize-primary,.text-image-primary,.uuid-generate) { color:#fff!important; border-color:#0875ff!important; background:linear-gradient(110deg,#168cff,#005aff)!important; box-shadow:0 4px 12px #0875ff18!important; }
.lipicode-bold .tool-detail-main button:disabled { cursor:not-allowed; }
/* Upload controls span the workspace; supporting cards follow below them. */
.lipicode-bold .tool-detail-main .image-pdf-layout > section,
.lipicode-bold .tool-detail-main .crop-image-page-grid > .crop-image-primary-column {
    grid-column: 1 / -1 !important;
    order: 1 !important;
    min-width: 0;
}
.lipicode-bold .tool-detail-main .pdf-image-workspace {
    grid-template-columns: minmax(0, 1fr) !important;
}
.lipicode-bold .tool-detail-main :is(.image-pdf-how, .crop-image-how) {
    order: 3 !important;
    align-self: start;
}
.lipicode-bold .tool-detail-main :is(#imagePdfChoose, #pdfImageChoose, .crop-image-file-button) {
    color: #fff !important;
    background: linear-gradient(110deg, #168cff, #005aff) !important;
    border-color: #0875ff !important;
}
/* The tool name is the page H1; workspace headings describe the next action. */
.lipicode-bold .tool-detail-main .tool-workspace-title{font-family:var(--site-font,var(--font-sans))!important;font-size:1.1rem!important;line-height:1.35!important;font-weight:700!important;letter-spacing:-.02em!important;color:#081344!important;margin:0 0 8px!important}
/* Keep hidden age controls and UUID panels within their workspace. */
.lipicode-bold .tool-detail-main #ageIncludeTime{width:1px!important;height:1px!important;min-width:0!important;min-height:0!important;position:absolute!important;clip-path:inset(50%);overflow:hidden}
.lipicode-bold .tool-detail-main .uuid-verifier-grid>div{min-width:0}
.lipicode-bold .tool-detail-main .uuid-verify-panel>header>div{min-width:0;flex:1}
.lipicode-bold .tool-detail-main .uuid-verify-panel>header{flex-wrap:wrap}
.lipicode-bold .tool-detail-main .uuid-verify-input footer{flex-wrap:wrap;gap:8px}
.lipicode-bold .tool-detail-main .uuid-verifier-grid>div{grid-template-columns:minmax(0,1fr)}
.lipicode-bold .tool-detail-main .uuid-verifier-grid article{min-width:0;max-width:100%}
.lipicode-bold .tool-detail-main .uuid-breakdown>div{justify-content:flex-start}