/* Premium interaction layer for 一刻在线工具箱 */
:root{
  --yk-accent:#2563eb;
  --yk-accent-2:#7c3aed;
  --yk-cyan:#06b6d4;
  --yk-ink:#0f172a;
  --yk-muted:#64748b;
  --yk-surface:rgba(255,255,255,.78);
  --yk-surface-strong:rgba(255,255,255,.92);
  --yk-line:rgba(15,23,42,.10);
  --yk-glow:0 24px 80px rgba(37,99,235,.18);
  --yk-radius:22px;
  --yk-ease:cubic-bezier(.2,.8,.2,1);
}

html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at var(--cursor-x,72%) var(--cursor-y,18%), rgba(37,99,235,.13), transparent 28rem),
    radial-gradient(circle at 10% 8%, rgba(6,182,212,.16), transparent 32rem),
    radial-gradient(circle at 88% 82%, rgba(124,58,237,.14), transparent 34rem),
    linear-gradient(135deg,#f8fafc 0%,#eef4ff 48%,#f8fbff 100%) !important;
  color:var(--text-color,var(--text-primary,var(--yk-ink)));
}
body.dark-mode{
  --yk-accent:#60a5fa;
  --yk-accent-2:#a78bfa;
  --yk-cyan:#22d3ee;
  --yk-ink:#e5eefb;
  --yk-muted:#a9b7cc;
  --yk-surface:rgba(15,23,42,.58);
  --yk-surface-strong:rgba(15,23,42,.82);
  --yk-line:rgba(148,163,184,.18);
  --yk-glow:0 30px 90px rgba(96,165,250,.16);
  background:
    radial-gradient(circle at var(--cursor-x,68%) var(--cursor-y,18%), rgba(96,165,250,.18), transparent 25rem),
    radial-gradient(circle at 8% 12%, rgba(34,211,238,.15), transparent 32rem),
    radial-gradient(circle at 92% 80%, rgba(167,139,250,.16), transparent 34rem),
    linear-gradient(145deg,#020617 0%,#07111f 45%,#0f172a 100%) !important;
}
body::after{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:-1;
  background-image:
    linear-gradient(rgba(100,116,139,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(100,116,139,.08) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.42), transparent 72%);
}

.premium-orb{position:fixed;left:0;top:0;width:18px;height:18px;border-radius:50%;pointer-events:none;z-index:9999;background:rgba(37,99,235,.75);box-shadow:0 0 28px rgba(37,99,235,.35),0 0 76px rgba(124,58,237,.20);transform:translate3d(-100px,-100px,0);transition:width .25s var(--yk-ease),height .25s var(--yk-ease),opacity .25s var(--yk-ease);mix-blend-mode:multiply;}
.dark-mode .premium-orb{background:rgba(96,165,250,.72);mix-blend-mode:screen;}
.premium-orb.is-hover{width:42px;height:42px;opacity:.42;}

header, .tool-header, footer{position:relative;z-index:2;}
header{padding-top:72px !important;}
header h1{letter-spacing:-.04em;font-weight:760 !important;text-wrap:balance;}
header h1 img{filter:drop-shadow(0 14px 26px rgba(37,99,235,.20));}
header p{font-weight:500;}

.home-hero-badges,.quick-actions,.trust-row{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px;}
.home-hero-badges span,.trust-row span,.search-tags button,#recentToolsList a{
  border:1px solid var(--yk-line);background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.35));
  border-radius:999px;padding:8px 12px;color:var(--yk-muted);font-size:13px;box-shadow:0 8px 24px rgba(15,23,42,.04);
}
.dark-mode .home-hero-badges span,.dark-mode .trust-row span,.dark-mode .search-tags button,.dark-mode #recentToolsList a{background:linear-gradient(180deg,rgba(30,41,59,.7),rgba(15,23,42,.36));}
.quick-actions a{color:#fff;text-decoration:none;}

.search-card,.tool-card,.container,.panel,.card,.workspace,.tool-box,.converter,.editor-panel,.settings-panel,.results-panel,.controls,.main-content,.options-panel,.preview-panel,.output-panel,.upload-section,.result-section{
  border-color:var(--yk-line) !important;
  background:var(--yk-surface) !important;
  box-shadow:var(--yk-glow), inset 0 1px 0 rgba(255,255,255,.42) !important;
  backdrop-filter:blur(22px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(22px) saturate(140%) !important;
}
.search-card,.tool-card,.container{border-radius:var(--yk-radius) !important;}
.search-card,.container,.yk-card,.yk-hero{position:relative;overflow:hidden;}
.tool-card{position:relative;overflow:hidden;transform-style:preserve-3d;will-change:transform,box-shadow;}
.tool-card::before,.search-card::before,.container::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(circle at var(--x,50%) var(--y,0%), rgba(37,99,235,.18), transparent 28%);
  opacity:0;transition:opacity .28s var(--yk-ease);
}
.tool-card:hover::before,.search-card:hover::before,.container:hover::before{opacity:1;}
.tool-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.42) 42%,transparent 62%);transform:translateX(-120%);transition:transform .8s var(--yk-ease);}
.tool-card:hover::after{transform:translateX(120%);}
.tool-card:hover{box-shadow:0 30px 100px rgba(37,99,235,.22),0 18px 44px rgba(15,23,42,.10) !important;}
.tool-icon{filter:drop-shadow(0 12px 22px rgba(37,99,235,.18));transition:transform .34s var(--yk-ease),filter .34s var(--yk-ease);}
.tool-card:hover .tool-icon{transform:translateY(-4px) scale(1.08) rotate(-3deg);filter:drop-shadow(0 18px 28px rgba(37,99,235,.26));}
.tool-card h3,.tool-section h2{letter-spacing:-.02em;}
.tool-section h2{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;}
.tool-section h2::before,.tool-section h2::after{content:"";width:42px;height:1px;background:linear-gradient(90deg,transparent,var(--yk-accent));opacity:.45;}
.tool-section h2::after{background:linear-gradient(90deg,var(--yk-accent),transparent);}

button,.button,.tool-link,.back-button,input[type="submit"],input[type="button"],.upload-button-alt,.download-button,.secondary-button{
  position:relative;overflow:hidden;border-radius:14px !important;transition:transform .22s var(--yk-ease),box-shadow .22s var(--yk-ease),background .22s var(--yk-ease),border-color .22s var(--yk-ease) !important;
}
button:not(:disabled),.button:not(.disabled),.tool-link:not([disabled]),.back-button{box-shadow:0 12px 28px rgba(37,99,235,.16);}
button:not(:disabled):hover,.button:not(.disabled):hover,.tool-link:not([disabled]):hover,.back-button:hover{transform:translateY(-2px) scale(1.012) !important;box-shadow:0 20px 44px rgba(37,99,235,.24) !important;}
button:not(:disabled):active,.button:not(.disabled):active,.tool-link:not([disabled]):active,.back-button:active{transform:translateY(0) scale(.985) !important;}
.tool-link,button:not(.pos-btn):not(#theme-switcher):not(.theme-toggle):not(.plain-btn),.button,.upload-button-alt,.download-button{
  background-image:linear-gradient(135deg,var(--yk-accent),var(--yk-accent-2)) !important;
  color:#fff !important;border:0 !important;
}
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.52);animation:ripple .65s ease-out;pointer-events:none;}
@keyframes ripple{to{transform:scale(4);opacity:0;}}

input,select,textarea{
  border-radius:14px !important;border:1px solid var(--yk-line) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);transition:border-color .2s var(--yk-ease),box-shadow .2s var(--yk-ease),transform .2s var(--yk-ease) !important;
}
input:focus,select:focus,textarea:focus{outline:none !important;border-color:rgba(37,99,235,.55) !important;box-shadow:0 0 0 4px rgba(37,99,235,.12), inset 0 1px 0 rgba(255,255,255,.35) !important;}
.upload-area-container,.file-upload-area,.drop-zone,.upload-area,.image-drop,.upload-box{
  border-radius:20px !important;border-color:rgba(37,99,235,.25) !important;position:relative;overflow:hidden;
}
.upload-area-container::after,.file-upload-area::after,.drop-zone::after,.upload-area::after,.image-drop::after,.upload-box::after{
  content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(37,99,235,.08),transparent);transform:translateX(-120%);transition:transform .65s var(--yk-ease);pointer-events:none;
}
.upload-area-container:hover::after,.file-upload-area:hover::after,.drop-zone:hover::after,.upload-area:hover::after,.image-drop:hover::after,.upload-box:hover::after{transform:translateX(120%);}

.smart-toolbar{position:fixed;top:14px;left:50%;transform:translateX(-50%);width:min(860px,calc(100vw - 28px));box-sizing:border-box;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--yk-line);border-radius:999px;background:rgba(255,255,255,.68);box-shadow:0 18px 60px rgba(15,23,42,.10);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
.dark-mode .smart-toolbar{background:rgba(2,6,23,.52);}
body.has-smart-toolbar{padding-top:82px !important;}
.smart-toolbar a,.smart-toolbar button{width:auto;text-decoration:none;font-size:14px;padding:9px 12px;border-radius:999px !important;}
.smart-toolbar .brand{font-weight:700;color:var(--yk-ink);letter-spacing:-.02em;}
.dark-mode .smart-toolbar .brand{color:#e5eefb;}
.theme-toggle{border:1px solid var(--yk-line) !important;background:var(--yk-surface-strong) !important;color:var(--yk-ink) !important;box-shadow:none !important;}
.dark-mode .theme-toggle{color:#e5eefb !important;}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .58s var(--yk-ease),transform .58s var(--yk-ease);}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.premium-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,18px);opacity:0;z-index:9998;background:var(--yk-surface-strong);border:1px solid var(--yk-line);box-shadow:var(--yk-glow);border-radius:999px;padding:10px 14px;color:var(--yk-ink);font-size:14px;transition:all .28s var(--yk-ease);backdrop-filter:blur(16px);}
.premium-toast.show{opacity:1;transform:translate(-50%,0);}
.dark-mode .premium-toast{color:#e5eefb;}

/* New tool shared blocks */
.yk-tool-page{min-height:100vh;padding:20px;box-sizing:border-box;}
.yk-container{max-width:1180px;margin:0 auto;}
.yk-hero{padding:26px;margin-bottom:18px;border:1px solid var(--yk-line);border-radius:26px;background:var(--yk-surface);box-shadow:var(--yk-glow);backdrop-filter:blur(22px);}
.yk-hero h1{margin:0 0 8px;font-size:30px;letter-spacing:-.04em;}
.yk-hero p{margin:0;color:var(--yk-muted);line-height:1.8;}
.yk-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px;align-items:start;}
.yk-card{border:1px solid var(--yk-line);border-radius:24px;background:var(--yk-surface);box-shadow:var(--yk-glow);backdrop-filter:blur(22px);padding:18px;position:relative;overflow:hidden;}
.yk-card h2,.yk-card h3{margin:0 0 12px;letter-spacing:-.02em;}
.yk-field{margin:12px 0;}
.yk-field label{display:block;margin-bottom:7px;font-size:14px;font-weight:650;color:var(--yk-ink);}
.dark-mode .yk-field label{color:#e5eefb;}
.yk-field input,.yk-field select,.yk-field textarea{width:100%;box-sizing:border-box;padding:11px 12px;background:rgba(255,255,255,.64);color:var(--yk-ink);}
.dark-mode .yk-field input,.dark-mode .yk-field select,.dark-mode .yk-field textarea{background:rgba(15,23,42,.66);color:#e5eefb;}
.yk-field textarea{min-height:170px;resize:vertical;line-height:1.6;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;}
.yk-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}
.yk-actions button,.yk-actions a{width:auto;padding:10px 14px;text-decoration:none;}
.yk-muted{color:var(--yk-muted);font-size:13px;line-height:1.7;}
.yk-output{min-height:220px;border:1px solid var(--yk-line);border-radius:18px;padding:14px;background:rgba(255,255,255,.42);overflow:auto;}
.dark-mode .yk-output{background:rgba(2,6,23,.34);}
.yk-list{display:grid;gap:10px;}
.yk-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--yk-line);border-radius:999px;padding:7px 10px;color:var(--yk-muted);background:rgba(255,255,255,.36);font-size:13px;}
.dark-mode .yk-pill{background:rgba(15,23,42,.36);}
.yk-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.yk-tab{width:auto !important;padding:9px 12px !important;border:1px solid var(--yk-line) !important;background:var(--yk-surface-strong) !important;color:var(--yk-ink) !important;box-shadow:none !important;}
.dark-mode .yk-tab{color:#e5eefb !important;}
.yk-tab.active{background-image:linear-gradient(135deg,var(--yk-accent),var(--yk-accent-2)) !important;color:#fff !important;border-color:transparent !important;}
.yk-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.yk-preview-grid canvas,.yk-preview-grid img{width:100%;height:auto;border-radius:14px;border:1px solid var(--yk-line);background:#fff;}
.yk-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0;}
.yk-stat{border:1px solid var(--yk-line);border-radius:18px;padding:12px;background:rgba(255,255,255,.38);}
.dark-mode .yk-stat{background:rgba(15,23,42,.38);}
.yk-stat strong{display:block;font-size:20px;letter-spacing:-.03em;}
.yk-stat span{font-size:12px;color:var(--yk-muted);}

@media (max-width:900px){.yk-grid{grid-template-columns:1fr}.smart-toolbar{top:10px;width:calc(100vw - 20px)}.premium-orb{display:none}.yk-tool-page{padding:10px}.yk-hero{padding:20px}.yk-hero h1{font-size:25px}.yk-stat-grid{grid-template-columns:1fr}.home-hero-badges,.quick-actions,.trust-row{justify-content:flex-start}.tool-section h2::before,.tool-section h2::after{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}.premium-orb{display:none}}

/* Aurora Glass + Bento OS upgrade */
body::before{opacity:.5 !important;background:
  radial-gradient(circle at 16% 24%, rgba(34,211,238,.12), transparent 22rem),
  radial-gradient(circle at 78% 12%, rgba(124,58,237,.12), transparent 24rem) !important;}
.home-search{position:relative;z-index:3}.search-card{max-width:980px !important;padding:22px !important;border-radius:28px !important;}
.search-row input{font-size:16px !important;padding:15px 16px !important;background:rgba(255,255,255,.62) !important;}
.dark-mode .search-row input{background:rgba(15,23,42,.58) !important;color:#e5eefb !important;}
.tool-section{position:relative;}
@media (min-width:980px){
  .tool-grid{display:grid !important;grid-template-columns:repeat(12,minmax(0,1fr)) !important;gap:20px !important;align-items:stretch;}
  .tool-card{grid-column:span 4;min-height:248px;}
  .tool-card:nth-child(1),.tool-card:nth-child(2),.tool-card:nth-child(6),.tool-card:nth-child(13){grid-column:span 6;}
  .tool-card:nth-child(4n+3){min-height:278px;}
}
.tool-card{border-radius:28px !important;text-align:left !important;padding:26px !important;}
.tool-card .tool-icon{font-size:42px}.tool-card h3{font-size:21px}.tool-card p{line-height:1.75}.tool-card .tool-link{align-self:flex-start;margin-top:auto;}
.tool-card::before,.yk-card::before,.yk-hero::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--x,50%) var(--y,0%), rgba(96,165,250,.20), transparent 32%);opacity:0;transition:opacity .25s var(--yk-ease);}
.tool-card:hover::before,.yk-card:hover::before,.yk-hero:hover::before{opacity:1;}
.yk-upload-zone{border:1px dashed rgba(96,165,250,.42);border-radius:24px;padding:24px 18px;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.54),rgba(255,255,255,.24));position:relative;overflow:hidden;cursor:pointer;transition:transform .24s var(--yk-ease),border-color .24s var(--yk-ease),box-shadow .24s var(--yk-ease);}
.dark-mode .yk-upload-zone{background:linear-gradient(180deg,rgba(15,23,42,.60),rgba(15,23,42,.30));}
.yk-upload-zone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;}
.yk-upload-zone .upload-icon{font-size:42px;margin-bottom:8px;filter:drop-shadow(0 14px 24px rgba(37,99,235,.24));}
.yk-upload-zone strong{display:block;color:var(--yk-ink);font-size:16px}.dark-mode .yk-upload-zone strong{color:#e5eefb}.yk-upload-zone p{margin:6px 0 12px;color:var(--yk-muted);font-size:13px;}
.yk-upload-zone.is-dragover,.yk-upload-zone:hover{border-color:rgba(96,165,250,.82);box-shadow:0 24px 60px rgba(37,99,235,.18);transform:translateY(-2px);}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hidden{display:none !important;}
.yk-check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.yk-check-grid label{border:1px solid var(--yk-line);border-radius:14px;padding:9px 10px;background:rgba(255,255,255,.36);font-size:13px;display:flex;gap:7px;align-items:center}.dark-mode .yk-check-grid label{background:rgba(15,23,42,.38)}
.yk-result-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:14px;margin-top:14px;}
.yk-result-card{border:1px solid var(--yk-line);border-radius:22px;background:rgba(255,255,255,.38);padding:12px;box-shadow:0 16px 46px rgba(15,23,42,.08);overflow:hidden;}
.dark-mode .yk-result-card{background:rgba(15,23,42,.36)}.yk-result-card h3{font-size:14px;line-height:1.45;margin:10px 0 5px;word-break:break-all}.yk-result-card p{margin:0;color:var(--yk-muted);font-size:12px;line-height:1.65}.yk-mini-btn{margin-top:10px;padding:8px 11px !important;font-size:12px !important;}
.yk-before-after{display:grid;grid-template-columns:1fr 1fr;gap:8px}.yk-before-after>div{position:relative;min-height:110px;border-radius:16px;background:rgba(148,163,184,.10);border:1px solid var(--yk-line);overflow:hidden;display:flex;align-items:center;justify-content:center}.yk-before-after span{position:absolute;left:8px;top:8px;z-index:2;padding:3px 7px;border-radius:999px;background:rgba(2,6,23,.60);color:#fff;font-size:11px}.yk-before-after img{width:100%;height:100%;max-height:180px;object-fit:contain;border:0;background:transparent;}
.yk-compare-list{display:grid;gap:8px;margin-top:10px}.yk-compare-row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid var(--yk-line);border-radius:16px;padding:10px 12px;background:rgba(255,255,255,.34);font-size:13px}.dark-mode .yk-compare-row{background:rgba(15,23,42,.34)}.yk-compare-row span{word-break:break-all}.yk-compare-row em{color:var(--yk-muted);font-style:normal;white-space:nowrap;}
.yk-selection-box{border:1px solid var(--yk-line);border-radius:20px;padding:10px;background:rgba(255,255,255,.30);}.dark-mode .yk-selection-box{background:rgba(15,23,42,.34)}.yk-selection-box canvas{width:100%;height:auto;max-height:320px;object-fit:contain;border-radius:14px;background:#fff;touch-action:none;}
.related-tools{max-width:1180px;margin:18px auto 0;border:1px solid var(--yk-line);border-radius:26px;background:var(--yk-surface);box-shadow:var(--yk-glow);backdrop-filter:blur(22px);padding:18px;}.related-tools h2{font-size:18px;margin:0 0 12px;letter-spacing:-.02em}.related-tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.related-tools a{display:flex;justify-content:space-between;gap:10px;text-decoration:none;color:var(--yk-ink);border:1px solid var(--yk-line);border-radius:16px;padding:12px;background:rgba(255,255,255,.34);transition:transform .22s var(--yk-ease),border-color .22s var(--yk-ease),background .22s var(--yk-ease)}.dark-mode .related-tools a{color:#e5eefb;background:rgba(15,23,42,.34)}.related-tools a:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.55);background:rgba(96,165,250,.10)}
.smart-toolbar{width:min(980px,calc(100vw - 28px)) !important;}.smart-toolbar .toolbar-left,.smart-toolbar .toolbar-right{display:flex;align-items:center;gap:8px}.smart-toolbar .cmd-open{border:1px solid var(--yk-line) !important;background:var(--yk-surface-strong) !important;color:var(--yk-ink) !important;box-shadow:none !important}.dark-mode .smart-toolbar .cmd-open{color:#e5eefb !important;}
.command-panel-mask{position:fixed;inset:0;background:rgba(2,6,23,.45);backdrop-filter:blur(8px);z-index:9996;display:none;align-items:flex-start;justify-content:center;padding-top:9vh}.command-panel-mask.show{display:flex}.command-panel{width:min(720px,calc(100vw - 28px));border:1px solid var(--yk-line);border-radius:28px;background:var(--yk-surface-strong);box-shadow:0 40px 120px rgba(0,0,0,.26);padding:14px;}.command-panel input{width:100%;box-sizing:border-box;font-size:16px;padding:15px 16px}.command-results{display:grid;gap:8px;margin-top:12px;max-height:56vh;overflow:auto}.command-results a{display:flex;align-items:center;justify-content:space-between;text-decoration:none;color:var(--yk-ink);border:1px solid var(--yk-line);border-radius:16px;padding:12px 14px;background:rgba(255,255,255,.34)}.dark-mode .command-results a{color:#e5eefb;background:rgba(15,23,42,.34)}.command-results small{color:var(--yk-muted)}
@media(max-width:760px){.two-col{grid-template-columns:1fr}.yk-result-grid{grid-template-columns:1fr}.yk-before-after{grid-template-columns:1fr}.yk-compare-row{grid-template-columns:1fr}.smart-toolbar .brand{display:none}.smart-toolbar{border-radius:24px !important}.yk-check-grid{grid-template-columns:repeat(2,1fr)}}

/* === Layout polish patch: tighter forms + cleaner related tools === */
*,*::before,*::after{box-sizing:border-box;}
input,select,textarea,button{max-width:100%;font:inherit;}
input[type="text"],input[type="search"],input[type="number"],input[type="url"],input[type="password"],select,textarea{
  min-height:44px;
  padding:10px 13px !important;
}
input[type="color"]{
  width:100% !important;
  min-height:44px !important;
  height:44px !important;
  padding:4px !important;
  border-radius:999px !important;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.32)) !important;
  cursor:pointer;
}
.dark-mode input[type="color"]{background:linear-gradient(180deg,rgba(30,41,59,.78),rgba(15,23,42,.42)) !important;}
input[type="color"]::-webkit-color-swatch-wrapper{padding:0;border:0;border-radius:999px;}
input[type="color"]::-webkit-color-swatch{border:0;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(15,23,42,.10);}
input[type="color"]::-moz-color-swatch{border:0;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(15,23,42,.10);}
input[type="range"]{accent-color:var(--yk-accent);}
.control-group,.option-group,.yk-field{min-width:0;}
.control-group input,.control-group select,.control-group textarea,.option-group input,.option-group select,.option-group textarea{box-sizing:border-box;}
hr{border:0 !important;border-top:1px solid var(--yk-line) !important;margin:18px 0 !important;opacity:.9;}

/* Watermark page refinement */
body.watermark-tool{padding:28px !important;overflow-x:hidden;}
body.watermark-tool .container{
  width:min(100%,1320px) !important;
  max-width:1320px !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(320px,420px) minmax(0,1fr) !important;
  gap:24px !important;
  align-items:stretch !important;
  padding:22px !important;
  border-radius:32px !important;
}
body.watermark-tool .controls{
  width:auto !important;
  min-width:0 !important;
  gap:16px !important;
}
body.watermark-tool .file-upload-area{
  width:100% !important;
  max-width:none !important;
  padding:26px 24px !important;
  text-align:center !important;
  border-radius:26px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,.28)) !important;
}
.dark-mode body.watermark-tool .file-upload-area,
body.watermark-tool.dark-mode .file-upload-area{background:linear-gradient(180deg,rgba(15,23,42,.62),rgba(15,23,42,.34)) !important;}
body.watermark-tool .file-upload-area p{font-size:16px;line-height:1.7;margin-bottom:14px !important;}
body.watermark-tool .file-upload-area button{
  min-height:54px;
  border-radius:18px !important;
  font-size:16px;
  font-weight:760;
  letter-spacing:.01em;
}
body.watermark-tool .batch-info{
  border-radius:16px !important;
  padding:12px 14px !important;
  background:rgba(255,255,255,.42) !important;
  border:1px solid var(--yk-line) !important;
}
body.watermark-tool .control-group{gap:9px !important;margin:0 !important;}
body.watermark-tool .control-group label{line-height:1.55;font-weight:650;}
body.watermark-tool .radio-group,
body.watermark-tool .checkbox-group{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  flex-wrap:wrap;
  min-height:42px;
}
body.watermark-tool .radio-group input,
body.watermark-tool .checkbox-group input{width:18px;height:18px;flex:0 0 auto;}
body.watermark-tool .radio-group label,
body.watermark-tool .checkbox-group label{font-weight:500;}
body.watermark-tool .position-grid{gap:8px !important;}
body.watermark-tool .pos-btn{
  min-height:38px !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.46) !important;
  box-shadow:none !important;
}
.dark-mode body.watermark-tool .pos-btn,
body.watermark-tool.dark-mode .pos-btn{background:rgba(15,23,42,.44) !important;}
body.watermark-tool .download-button{min-height:48px;border-radius:16px !important;font-weight:750;}
body.watermark-tool .canvas-container{
  min-width:0 !important;
  min-height:620px !important;
  border-radius:28px !important;
  border:1px solid var(--yk-line) !important;
}
body.watermark-tool #canvas{max-height:calc(100vh - 120px) !important;}
@media(max-width:1100px){
  body.watermark-tool{padding:16px !important;}
  body.watermark-tool .container{
    grid-template-columns:1fr !important;
    max-width:760px !important;
    padding:18px !important;
  }
  body.watermark-tool .canvas-container{min-height:380px !important;}
  body.watermark-tool #canvas{max-height:58vh !important;}
}
@media(max-width:560px){
  body.watermark-tool{padding:10px !important;}
  body.watermark-tool .container{padding:14px !important;border-radius:24px !important;}
  body.watermark-tool .file-upload-area{padding:20px 16px !important;}
  body.watermark-tool .file-upload-area button{min-height:50px;}
}

/* Related tools: larger Bento cards, stable labels, no awkward line breaks */
.related-tools{
  width:min(1180px,calc(100% - 40px));
  margin:26px auto 0 !important;
  padding:24px !important;
  border-radius:34px !important;
}
.related-tools h2{
  font-size:22px !important;
  margin:0 0 16px !important;
  letter-spacing:-.03em;
}
.related-tools-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:14px !important;
}
.related-tools a{
  min-height:72px;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:16px 18px !important;
  border-radius:22px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.52),rgba(255,255,255,.24)) !important;
}
.dark-mode .related-tools a{background:linear-gradient(180deg,rgba(30,41,59,.58),rgba(15,23,42,.34)) !important;}
.related-tools a span{
  min-width:0;
  font-size:15px;
  line-height:1.45;
  font-weight:650;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.related-tools a small{
  flex:0 0 auto;
  display:inline-grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:999px;
  font-size:0;
  color:#fff;
  background:linear-gradient(135deg,var(--yk-accent),var(--yk-accent-2));
  box-shadow:0 10px 24px rgba(37,99,235,.18);
}
.related-tools a small::before{content:"→";font-size:17px;line-height:1;}
@media(max-width:900px){.related-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}.related-tools{width:calc(100% - 24px);padding:20px !important;}}
@media(max-width:560px){.related-tools-grid{grid-template-columns:1fr !important;}.related-tools{width:calc(100% - 20px);padding:16px !important;border-radius:26px !important;}.related-tools h2{font-size:19px !important;}.related-tools a{min-height:64px;}}

/* === Seamless Aurora patch: soften tool-page boundaries and make sections blend naturally === */
:root{
  --yk-soft-panel: rgba(255,255,255,.34);
  --yk-soft-panel-2: rgba(255,255,255,.18);
  --yk-soft-line: rgba(255,255,255,.46);
  --yk-soft-line-2: rgba(37,99,235,.10);
  --yk-soft-shadow: 0 32px 110px rgba(37,99,235,.13), 0 18px 46px rgba(15,23,42,.06);
}
body.dark-mode{
  --yk-soft-panel: rgba(15,23,42,.36);
  --yk-soft-panel-2: rgba(15,23,42,.20);
  --yk-soft-line: rgba(148,163,184,.16);
  --yk-soft-line-2: rgba(96,165,250,.14);
  --yk-soft-shadow: 0 36px 120px rgba(2,6,23,.32), 0 20px 58px rgba(59,130,246,.08);
}
body{
  background:
    radial-gradient(circle at var(--cursor-x,68%) var(--cursor-y,18%), rgba(37,99,235,.11), transparent 30rem),
    radial-gradient(circle at 8% 4%, rgba(6,182,212,.12), transparent 34rem),
    radial-gradient(circle at 92% 92%, rgba(124,58,237,.10), transparent 38rem),
    linear-gradient(135deg,#f7fbff 0%,#eef5ff 46%,#f8fbff 100%) !important;
}
body.dark-mode{
  background:
    radial-gradient(circle at var(--cursor-x,66%) var(--cursor-y,20%), rgba(96,165,250,.15), transparent 30rem),
    radial-gradient(circle at 7% 8%, rgba(34,211,238,.10), transparent 34rem),
    radial-gradient(circle at 92% 84%, rgba(167,139,250,.13), transparent 38rem),
    linear-gradient(145deg,#020617 0%,#07111f 45%,#0f172a 100%) !important;
}
body::after{opacity:.58;}

/* One soft glass plate instead of many visible boxes */
.container,
.yk-hero,
.yk-card,
.search-card{
  border:1px solid rgba(255,255,255,.52) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,255,255,.64), transparent 32%),
    radial-gradient(circle at 92% 100%, rgba(37,99,235,.10), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.52), rgba(255,255,255,.22)) !important;
  box-shadow:var(--yk-soft-shadow), inset 0 1px 0 rgba(255,255,255,.72) !important;
  backdrop-filter:blur(28px) saturate(150%) !important;
  -webkit-backdrop-filter:blur(28px) saturate(150%) !important;
}
.dark-mode .container,
.dark-mode .yk-hero,
.dark-mode .yk-card,
.dark-mode .search-card,
body.dark-mode .container,
body.dark-mode .yk-hero,
body.dark-mode .yk-card,
body.dark-mode .search-card{
  border-color:rgba(148,163,184,.14) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(30,41,59,.42), transparent 34%),
    radial-gradient(circle at 90% 100%, rgba(96,165,250,.10), transparent 38%),
    linear-gradient(145deg, rgba(15,23,42,.54), rgba(15,23,42,.26)) !important;
  box-shadow:var(--yk-soft-shadow), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* Inner panels become layers, not separate heavy cards */
.settings-panel,
.results-panel,
.controls,
.preview-panel,
.output-panel,
.options-panel,
.main-content,
.workspace,
.converter,
.editor-panel,
.upload-section,
.result-section,
.canvas-container{
  border-color:transparent !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Soft layer cards: enough hierarchy, no hard rectangle feeling */
.summary-card > div,
.preview-card .image-box,
.file-list .file-item,
.empty-state,
.yk-result-card,
.yk-selection-box,
.yk-before-after > div,
.yk-compare-row,
.upload-area-container,
.file-upload-area,
.drop-zone,
.upload-area,
.image-drop,
.upload-box,
.batch-info,
.related-tools a{
  border:1px solid rgba(255,255,255,.48) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.16)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62), 0 14px 38px rgba(15,23,42,.045) !important;
  backdrop-filter:blur(16px) saturate(130%) !important;
  -webkit-backdrop-filter:blur(16px) saturate(130%) !important;
}
.dark-mode .summary-card > div,
.dark-mode .preview-card .image-box,
.dark-mode .file-list .file-item,
.dark-mode .empty-state,
.dark-mode .yk-result-card,
.dark-mode .yk-selection-box,
.dark-mode .yk-before-after > div,
.dark-mode .yk-compare-row,
.dark-mode .upload-area-container,
.dark-mode .file-upload-area,
.dark-mode .drop-zone,
.dark-mode .upload-area,
.dark-mode .image-drop,
.dark-mode .upload-box,
.dark-mode .batch-info,
.dark-mode .related-tools a,
body.dark-mode .summary-card > div,
body.dark-mode .preview-card .image-box,
body.dark-mode .file-list .file-item,
body.dark-mode .empty-state,
body.dark-mode .yk-result-card,
body.dark-mode .yk-selection-box,
body.dark-mode .yk-before-after > div,
body.dark-mode .yk-compare-row,
body.dark-mode .upload-area-container,
body.dark-mode .file-upload-area,
body.dark-mode .drop-zone,
body.dark-mode .upload-area,
body.dark-mode .image-drop,
body.dark-mode .upload-box,
body.dark-mode .batch-info,
body.dark-mode .related-tools a{
  border-color:rgba(148,163,184,.12) !important;
  background:
    linear-gradient(180deg, rgba(30,41,59,.34), rgba(15,23,42,.18)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 14px 42px rgba(2,6,23,.16) !important;
}

/* Reduce visual seams between columns and sections */
.container{gap:22px !important;}
.settings-panel{position:relative;}
.settings-panel::after{
  content:"";
  position:absolute;
  top:10px;
  right:-12px;
  bottom:10px;
  width:1px;
  background:linear-gradient(to bottom, transparent, rgba(37,99,235,.10), transparent);
  pointer-events:none;
}
.dark-mode .settings-panel::after,
body.dark-mode .settings-panel::after{background:linear-gradient(to bottom, transparent, rgba(148,163,184,.12), transparent);}
@media(max-width:960px){.settings-panel::after{display:none;}}

/* Inputs should feel embedded rather than framed */
input[type="text"],input[type="search"],input[type="number"],input[type="url"],input[type="password"],select,textarea{
  border-color:rgba(15,23,42,.07) !important;
  background:rgba(255,255,255,.42) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68), 0 8px 20px rgba(15,23,42,.025) !important;
}
.dark-mode input[type="text"],.dark-mode input[type="search"],.dark-mode input[type="number"],.dark-mode input[type="url"],.dark-mode input[type="password"],.dark-mode select,.dark-mode textarea,
body.dark-mode input[type="text"],body.dark-mode input[type="search"],body.dark-mode input[type="number"],body.dark-mode input[type="url"],body.dark-mode input[type="password"],body.dark-mode select,body.dark-mode textarea{
  border-color:rgba(148,163,184,.13) !important;
  background:rgba(15,23,42,.28) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 8px 22px rgba(2,6,23,.12) !important;
}

/* Related tools: blend into the same large glass surface */
.related-tools{
  border-color:rgba(255,255,255,.52) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,255,255,.50), transparent 35%),
    linear-gradient(145deg, rgba(255,255,255,.42), rgba(255,255,255,.18)) !important;
  box-shadow:0 28px 90px rgba(37,99,235,.10), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
.dark-mode .related-tools,
body.dark-mode .related-tools{
  border-color:rgba(148,163,184,.14) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(30,41,59,.38), transparent 35%),
    linear-gradient(145deg, rgba(15,23,42,.42), rgba(15,23,42,.20)) !important;
  box-shadow:0 28px 90px rgba(2,6,23,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.related-tools a:hover,
.tool-card:hover,
.summary-card > div:hover,
.preview-card .image-box:hover{
  border-color:rgba(96,165,250,.28) !important;
  background:
    radial-gradient(circle at var(--x,50%) var(--y,0%), rgba(37,99,235,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.48), rgba(255,255,255,.20)) !important;
}
.dark-mode .related-tools a:hover,
.dark-mode .tool-card:hover,
.dark-mode .summary-card > div:hover,
.dark-mode .preview-card .image-box:hover,
body.dark-mode .related-tools a:hover,
body.dark-mode .tool-card:hover,
body.dark-mode .summary-card > div:hover,
body.dark-mode .preview-card .image-box:hover{
  background:
    radial-gradient(circle at var(--x,50%) var(--y,0%), rgba(96,165,250,.14), transparent 34%),
    linear-gradient(180deg, rgba(30,41,59,.38), rgba(15,23,42,.20)) !important;
}

/* Compressor/resizer style pages: make empty states and previews less blocky */
.summary-card{gap:14px !important;}
.summary-card strong{letter-spacing:-.03em;}
.preview-card{gap:18px !important;}
.image-box{min-height:250px;}
.file-list{margin-top:2px;}
.empty-state{padding:22px !important;}
.seo-note-wrap{opacity:.72;}

@media(max-width:760px){
  .container{gap:16px !important;}
  .summary-card{gap:10px !important;}
}

/* === Homepage regularized Bento patch: fixed rhythm, no random-looking spans === */
.section-title-row{
  max-width:1180px;
  margin:0 auto 18px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  padding:0 4px;
}
.section-title-row h2{
  text-align:left !important;
  margin:4px 0 0 !important;
  font-size:28px !important;
  line-height:1.15;
  letter-spacing:-.04em;
}
.section-kicker{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--yk-accent);
  opacity:.92;
}
.section-kicker::before{
  content:"";
  width:20px;
  height:1px;
  background:linear-gradient(90deg,var(--yk-accent),var(--yk-accent-2));
}
.section-title-row p{
  max-width:440px;
  margin:0;
  color:var(--yk-muted);
  font-size:14px;
  line-height:1.7;
  text-align:right;
}
@media (min-width:980px){
  .homepage-regular-grid,
  .tool-grid.homepage-regular-grid{
    max-width:1180px;
    margin:0 auto;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:18px !important;
    align-items:stretch !important;
  }
  .homepage-regular-grid .tool-card,
  .tool-grid.homepage-regular-grid .tool-card{
    grid-column:auto !important;
    min-height:252px !important;
    height:100%;
  }
  .homepage-regular-grid .tool-card:nth-child(1),
  .homepage-regular-grid .tool-card:nth-child(2),
  .homepage-regular-grid .tool-card:nth-child(6),
  .homepage-regular-grid .tool-card:nth-child(13),
  .homepage-regular-grid .tool-card:nth-child(4n+3){
    grid-column:auto !important;
    min-height:252px !important;
  }
}
@media (min-width:760px) and (max-width:1179px){
  .homepage-regular-grid,
  .tool-grid.homepage-regular-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:16px !important;
  }
  .homepage-regular-grid .tool-card,
  .tool-grid.homepage-regular-grid .tool-card{
    grid-column:auto !important;
    min-height:244px !important;
  }
}
@media (min-width:560px) and (max-width:759px){
  .homepage-regular-grid,
  .tool-grid.homepage-regular-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  .homepage-regular-grid .tool-card,
  .tool-grid.homepage-regular-grid .tool-card{
    grid-column:auto !important;
    min-height:232px !important;
  }
}
@media (max-width:559px){
  .homepage-regular-grid,
  .tool-grid.homepage-regular-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
  }
  .section-title-row{
    display:block;
    margin-bottom:12px;
  }
  .section-title-row h2{
    font-size:24px !important;
  }
  .section-title-row p{
    text-align:left;
    margin-top:8px;
  }
}
.homepage-regular-grid .tool-card{
  padding:22px !important;
  border-radius:26px !important;
  text-align:left !important;
}
.homepage-regular-grid .tool-card .tool-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin:0 0 14px !important;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(124,58,237,.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.50);
  font-size:26px !important;
}
.dark-mode .homepage-regular-grid .tool-card .tool-icon,
body.dark-mode .homepage-regular-grid .tool-card .tool-icon{
  background:linear-gradient(135deg,rgba(96,165,250,.16),rgba(167,139,250,.12));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.homepage-regular-grid .tool-card h3{
  font-size:18px !important;
  line-height:1.35;
  margin-bottom:8px !important;
  word-break:keep-all;
}
.homepage-regular-grid .tool-card p{
  font-size:14px !important;
  line-height:1.72 !important;
  margin:0 0 18px !important;
}
.homepage-regular-grid .tool-card .tool-link{
  min-height:40px;
  padding:9px 15px !important;
  border-radius:999px !important;
  font-size:14px !important;
}
.tool-section{
  margin-bottom:54px !important;
}
.tool-section > h2{
  display:none;
}

/* === Calm Aurora patch: cleaner layout, subtler interaction === */
body{
  background:
    radial-gradient(circle at 12% 4%, rgba(96,165,250,.12), transparent 34rem),
    radial-gradient(circle at 92% 88%, rgba(124,58,237,.08), transparent 38rem),
    linear-gradient(135deg,#f8fbff 0%,#eef5ff 48%,#fbfdff 100%) !important;
}
body.dark-mode{
  background:
    radial-gradient(circle at 10% 8%, rgba(96,165,250,.12), transparent 34rem),
    radial-gradient(circle at 92% 86%, rgba(167,139,250,.10), transparent 38rem),
    linear-gradient(145deg,#020617 0%,#07111f 48%,#0f172a 100%) !important;
}
.premium-orb{display:none !important;}
.tool-card::after{display:none !important;}
.tool-card::before,.search-card::before,.container::before,.yk-card::before,.yk-hero::before{
  background:radial-gradient(circle at var(--x,50%) var(--y,0%), rgba(37,99,235,.055), transparent 40%) !important;
}
.dark-mode .tool-card::before,
body.dark-mode .tool-card::before,
.dark-mode .search-card::before,
body.dark-mode .search-card::before{
  background:radial-gradient(circle at var(--x,50%) var(--y,0%), rgba(96,165,250,.08), transparent 42%) !important;
}
.tool-card:hover,
.homepage-regular-grid .tool-card:hover{
  transform:translateY(-4px) !important;
  box-shadow:0 22px 70px rgba(37,99,235,.13), 0 12px 30px rgba(15,23,42,.055) !important;
}
.tool-card:hover .tool-icon{
  transform:translateY(-2px) scale(1.035) !important;
  filter:drop-shadow(0 12px 22px rgba(37,99,235,.18)) !important;
}
.section-title-row.compact-section-title{
  align-items:center;
  margin-bottom:22px;
}
.section-title-row.compact-section-title p{display:none !important;}
@media (min-width:1180px){
  .homepage-regular-grid,
  .tool-grid.homepage-regular-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:22px !important;
  }
}
@media (min-width:820px) and (max-width:1179px){
  .homepage-regular-grid,
  .tool-grid.homepage-regular-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
  }
}
.homepage-regular-grid .tool-card,
.tool-grid.homepage-regular-grid .tool-card{
  min-height:246px !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  border-color:rgba(255,255,255,.42) !important;
  background:
    linear-gradient(160deg, rgba(255,255,255,.46), rgba(255,255,255,.24)) !important;
  box-shadow:0 18px 58px rgba(37,99,235,.08), inset 0 1px 0 rgba(255,255,255,.62) !important;
}
.dark-mode .homepage-regular-grid .tool-card,
body.dark-mode .homepage-regular-grid .tool-card{
  border-color:rgba(148,163,184,.13) !important;
  background:linear-gradient(160deg, rgba(15,23,42,.44), rgba(15,23,42,.25)) !important;
  box-shadow:0 22px 66px rgba(2,6,23,.26), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.homepage-regular-grid .tool-card p{
  flex:1 1 auto;
  color:rgba(100,116,139,.92) !important;
}
.dark-mode .homepage-regular-grid .tool-card p,
body.dark-mode .homepage-regular-grid .tool-card p{
  color:rgba(203,213,225,.80) !important;
}
.homepage-regular-grid .tool-card .tool-link{
  align-self:flex-start;
  margin-top:auto !important;
}
.section-title-row p:empty{display:none !important;}
button:not(:disabled):hover,.button:not(.disabled):hover,.tool-link:not([disabled]):hover,.back-button:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 14px 34px rgba(37,99,235,.18) !important;
}
@media (prefers-reduced-motion: no-preference){
  .tool-card,.tool-icon,button,.button,.tool-link{transition-duration:.20s !important;}
}

/* === Calm Pro patch: remove cursor-follow effects, keep understated premium feedback === */
body{
  background:
    radial-gradient(circle at 10% 4%, rgba(96,165,250,.10), transparent 34rem),
    radial-gradient(circle at 94% 88%, rgba(124,58,237,.07), transparent 38rem),
    linear-gradient(135deg,#f8fbff 0%,#eef5ff 48%,#fbfdff 100%) !important;
}
body.dark-mode{
  background:
    radial-gradient(circle at 10% 8%, rgba(96,165,250,.10), transparent 34rem),
    radial-gradient(circle at 92% 86%, rgba(167,139,250,.08), transparent 38rem),
    linear-gradient(145deg,#020617 0%,#07111f 48%,#0f172a 100%) !important;
}
.tool-card::before,
.search-card::before,
.container::before,
.yk-card::before,
.yk-hero::before,
.related-tools::before{display:none !important;}
.tool-card:hover,
.homepage-regular-grid .tool-card:hover,
.related-tools a:hover,
.summary-card > div:hover,
.preview-card .image-box:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(37,99,235,.16) !important;
  background:linear-gradient(160deg, rgba(255,255,255,.54), rgba(255,255,255,.28)) !important;
  box-shadow:0 18px 54px rgba(37,99,235,.105), 0 10px 24px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.72) !important;
}
.dark-mode .tool-card:hover,
body.dark-mode .tool-card:hover,
.dark-mode .related-tools a:hover,
body.dark-mode .related-tools a:hover,
.dark-mode .summary-card > div:hover,
body.dark-mode .summary-card > div:hover,
.dark-mode .preview-card .image-box:hover,
body.dark-mode .preview-card .image-box:hover{
  background:linear-gradient(160deg, rgba(30,41,59,.46), rgba(15,23,42,.24)) !important;
  border-color:rgba(96,165,250,.18) !important;
  box-shadow:0 18px 58px rgba(2,6,23,.24), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.tool-card:hover .tool-icon{
  transform:translateY(-1px) scale(1.02) !important;
  filter:drop-shadow(0 10px 18px rgba(37,99,235,.13)) !important;
}
button:not(:disabled):hover,
.button:not(.disabled):hover,
.tool-link:not([disabled]):hover,
.back-button:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 12px 28px rgba(37,99,235,.15) !important;
}
button:not(:disabled):active,
.button:not(.disabled):active,
.tool-link:not([disabled]):active,
.back-button:active{transform:translateY(0) scale(.992) !important;}
.ripple{background:rgba(255,255,255,.28) !important;animation-duration:.48s !important;}
.section-title-row p{
  color:rgba(100,116,139,.86) !important;
}
.dark-mode .section-title-row p,
body.dark-mode .section-title-row p{color:rgba(203,213,225,.78) !important;}
@media (prefers-reduced-motion: no-preference){
  .tool-card,.tool-icon,button,.button,.tool-link,.related-tools a{transition-duration:.16s !important;}
}

/* === Minimal GitHub-like polish: subtle dynamic background + refined card icon/text feedback === */
:root{
  --yk-title-gradient: linear-gradient(92deg,#0f172a 0%,#1e40af 46%,#7c3aed 100%);
  --yk-title-gradient-soft: linear-gradient(92deg,#1e293b 0%,#2563eb 52%,#7c3aed 100%);
}
body.dark-mode,
.dark-mode{
  --yk-title-gradient: linear-gradient(92deg,#f8fafc 0%,#93c5fd 45%,#c4b5fd 100%);
  --yk-title-gradient-soft: linear-gradient(92deg,#e2e8f0 0%,#60a5fa 52%,#a78bfa 100%);
}
body{
  position:relative;
  overflow-x:hidden;
}
body::before{
  content:"" !important;
  position:fixed !important;
  inset:-28% !important;
  width:auto !important;
  height:auto !important;
  pointer-events:none !important;
  z-index:0 !important;
  opacity:.42 !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(96,165,250,.20), transparent 24rem),
    radial-gradient(circle at 78% 24%, rgba(124,58,237,.13), transparent 26rem),
    radial-gradient(circle at 58% 82%, rgba(6,182,212,.10), transparent 24rem) !important;
  filter:blur(2px) saturate(115%);
  transform:translate3d(0,0,0) scale(1.02);
  animation:ykAuroraBreath 22s ease-in-out infinite alternate;
}
body.dark-mode::before,
.dark-mode body::before{
  opacity:.34 !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(96,165,250,.18), transparent 25rem),
    radial-gradient(circle at 80% 22%, rgba(167,139,250,.16), transparent 27rem),
    radial-gradient(circle at 58% 84%, rgba(34,211,238,.10), transparent 24rem) !important;
}
body::after{
  z-index:0 !important;
  opacity:.22 !important;
  animation:ykGridDrift 34s linear infinite;
}
header,
main,
footer,
.smart-toolbar,
.command-panel-mask,
.premium-toast{
  position:relative;
  z-index:1;
}
.command-panel-mask{z-index:9990;}
.premium-toast{z-index:9998;}
@keyframes ykAuroraBreath{
  0%{transform:translate3d(-1.2%, -.8%, 0) scale(1.02) rotate(0deg);}
  50%{transform:translate3d(1.1%, .7%, 0) scale(1.04) rotate(.35deg);}
  100%{transform:translate3d(.7%, -1.1%, 0) scale(1.03) rotate(-.28deg);}
}
@keyframes ykGridDrift{
  0%{background-position:0 0,0 0;}
  100%{background-position:34px 34px,34px 34px;}
}
header h1{
  color:transparent !important;
  background:var(--yk-title-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  text-shadow:0 18px 60px rgba(37,99,235,.12);
}
header h1 img{
  color:initial;
  transform:translateZ(0);
  filter:drop-shadow(0 18px 32px rgba(37,99,235,.22));
}
.section-title-row p{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  width:auto;
  max-width:none;
  min-height:34px;
  padding:7px 12px;
  border:1px solid rgba(255,255,255,.58);
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.52),rgba(255,255,255,.22));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.70),0 10px 26px rgba(37,99,235,.055);
  color:rgba(71,85,105,.92) !important;
  font-size:13px;
  font-weight:700;
  letter-spacing:.01em;
  text-align:center;
}
body.dark-mode .section-title-row p,
.dark-mode .section-title-row p{
  border-color:rgba(148,163,184,.16);
  background:linear-gradient(180deg,rgba(30,41,59,.48),rgba(15,23,42,.26));
  color:rgba(226,232,240,.86) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 30px rgba(2,6,23,.16);
}
.homepage-regular-grid .tool-card .tool-icon,
.tool-card .tool-icon{
  position:relative;
  isolation:isolate;
  transition:transform .32s cubic-bezier(.2,.8,.2,1), filter .32s cubic-bezier(.2,.8,.2,1), box-shadow .32s cubic-bezier(.2,.8,.2,1) !important;
}
.homepage-regular-grid .tool-card .tool-icon::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,.14));
  opacity:.72;
  transition:opacity .32s cubic-bezier(.2,.8,.2,1), transform .32s cubic-bezier(.2,.8,.2,1);
}
.homepage-regular-grid .tool-card h3,
.tool-card h3{
  font-weight:820 !important;
  letter-spacing:-.035em !important;
  transition:color .28s cubic-bezier(.2,.8,.2,1), background-position .45s cubic-bezier(.2,.8,.2,1), text-shadow .28s cubic-bezier(.2,.8,.2,1) !important;
}
.homepage-regular-grid .tool-card:hover .tool-icon,
.tool-card:hover .tool-icon{
  transform:translateY(-5px) scale(1.12) rotate(-5deg) !important;
  filter:drop-shadow(0 18px 30px rgba(37,99,235,.22)) !important;
}
.homepage-regular-grid .tool-card:hover .tool-icon::before{
  opacity:1;
  transform:scale(1.08) rotate(5deg);
}
.homepage-regular-grid .tool-card:hover h3,
.tool-card:hover h3{
  color:transparent !important;
  background:var(--yk-title-gradient-soft);
  -webkit-background-clip:text;
  background-clip:text;
  text-shadow:0 14px 34px rgba(37,99,235,.10);
}
.homepage-regular-grid .tool-card:hover,
.tool-card:hover{
  transform:translateY(-3px) !important;
}
@media (max-width:559px){
  .section-title-row p{justify-self:start;margin-top:10px;text-align:left;}
}
@media (prefers-reduced-motion:reduce){
  body::before,body::after{animation:none !important;}
  .homepage-regular-grid .tool-card:hover .tool-icon,.tool-card:hover .tool-icon{transform:translateY(-2px) scale(1.04) !important;}
}

/* ensure animated aura is visible in both light and dark mode */
body::before{display:block !important;}
body.dark-mode::before,.dark-mode body::before{display:block !important;}

/* === 2026-04-27 command panel + home search polish patch === */
.command-panel-mask{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  min-height:100vh !important;
  display:none !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:clamp(28px,8vh,88px) 14px 24px !important;
  background:rgba(15,23,42,.36) !important;
  backdrop-filter:blur(12px) saturate(112%) !important;
  -webkit-backdrop-filter:blur(12px) saturate(112%) !important;
  z-index:99990 !important;
}
.command-panel-mask.show{display:flex !important;}
.command-panel{
  margin:0 auto !important;
  max-height:min(76vh,680px) !important;
  overflow:hidden !important;
  transform:none !important;
}
.command-results{max-height:calc(min(76vh,680px) - 84px) !important;}
.home-search.is-searching .search-card{
  box-shadow:0 24px 80px rgba(37,99,235,.12), inset 0 1px 0 rgba(255,255,255,.60) !important;
  border-color:rgba(96,165,250,.28) !important;
}
.search-meta{
  margin-top:10px;
  color:var(--yk-muted,#64748b);
  font-size:13px;
  line-height:1.6;
}
.dark-mode .search-meta, body.dark-mode .search-meta{color:#94a3b8;}
#toolSearch:focus{
  border-color:rgba(37,99,235,.42) !important;
  box-shadow:0 0 0 4px rgba(37,99,235,.10), inset 0 1px 0 rgba(255,255,255,.58) !important;
}
@media (max-width:640px){
  .command-panel-mask{padding-top:18px !important;align-items:flex-start !important;}
  .command-panel{border-radius:22px !important;}
}

/* === 2026-04-27 final unified tool-page and search-results patch === */
/* Keep the tool toolbar independent from page content. */
.smart-toolbar{
  position:fixed !important;
  top:18px !important;
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
  width:min(980px,calc(100vw - 36px)) !important;
  min-height:58px !important;
  z-index:99920 !important;
  isolation:isolate;
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.48)) !important;
  border:1px solid rgba(255,255,255,.72) !important;
  box-shadow:0 20px 60px rgba(37,99,235,.12), inset 0 1px 0 rgba(255,255,255,.82) !important;
}
body.dark-mode .smart-toolbar,
.dark-mode .smart-toolbar{
  background:linear-gradient(180deg,rgba(15,23,42,.74),rgba(15,23,42,.46)) !important;
  border-color:rgba(148,163,184,.18) !important;
  box-shadow:0 24px 70px rgba(2,6,23,.34), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
body.has-smart-toolbar{
  padding-top:102px !important;
}
body.has-smart-toolbar.yk-tool-page,
body.has-smart-toolbar.tool-page-normalized{
  padding:102px 20px 34px !important;
}
body.has-smart-toolbar.watermark-tool{
  padding:102px 20px 34px !important;
}
body.tool-page-normalized{
  min-height:100vh;
  overflow-x:hidden;
}
body.tool-page-normalized main,
body.tool-page-normalized > .container,
body.tool-page-normalized > .page-shell,
body.tool-page-normalized > .converter,
body.tool-page-normalized > .workspace,
body.tool-page-normalized > .editor-panel,
body.tool-page-normalized > .tool-box{
  position:relative;
  z-index:1;
}
body.tool-page-normalized .yk-container,
body.tool-page-normalized > .container,
body.tool-page-normalized > main:not(.yk-container),
body.tool-page-normalized > .page-shell,
body.tool-page-normalized > .converter,
body.tool-page-normalized > .workspace,
body.tool-page-normalized > .editor-panel,
body.tool-page-normalized > .tool-box{
  width:min(1180px,100%) !important;
  max-width:1180px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body.tool-page-normalized .yk-container{
  padding-top:0 !important;
}
.yk-auto-hero,
body.tool-page-normalized .yk-hero{
  width:min(1180px,100%) !important;
  max-width:1180px !important;
  margin:0 auto 22px !important;
  border-radius:30px !important;
}
body.tool-page-normalized .yk-original-title-hidden{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
}
body.tool-page-normalized .related-tools{
  width:min(1180px,100%) !important;
  max-width:1180px !important;
  margin:22px auto 0 !important;
}
body.tool-page-normalized .yk-grid{
  width:min(1180px,100%) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body.tool-page-normalized .yk-card,
body.tool-page-normalized .container,
body.tool-page-normalized .panel,
body.tool-page-normalized .card,
body.tool-page-normalized .workspace,
body.tool-page-normalized .tool-box,
body.tool-page-normalized .converter,
body.tool-page-normalized .settings-panel,
body.tool-page-normalized .results-panel,
body.tool-page-normalized .controls,
body.tool-page-normalized .main-content,
body.tool-page-normalized .options-panel,
body.tool-page-normalized .preview-panel,
body.tool-page-normalized .output-panel,
body.tool-page-normalized .upload-section,
body.tool-page-normalized .result-section{
  border-color:rgba(255,255,255,.46) !important;
}
body.dark-mode.tool-page-normalized .yk-card,
body.dark-mode.tool-page-normalized .container,
body.dark-mode.tool-page-normalized .panel,
body.dark-mode.tool-page-normalized .card,
body.dark-mode.tool-page-normalized .workspace,
body.dark-mode.tool-page-normalized .tool-box,
body.dark-mode.tool-page-normalized .converter,
body.dark-mode.tool-page-normalized .settings-panel,
body.dark-mode.tool-page-normalized .results-panel,
body.dark-mode.tool-page-normalized .controls,
body.dark-mode.tool-page-normalized .main-content,
body.dark-mode.tool-page-normalized .options-panel,
body.dark-mode.tool-page-normalized .preview-panel,
body.dark-mode.tool-page-normalized .output-panel,
body.dark-mode.tool-page-normalized .upload-section,
body.dark-mode.tool-page-normalized .result-section{
  border-color:rgba(148,163,184,.16) !important;
}
/* Search results are rendered into their own grid so card visibility never depends on hidden source sections. */
.search-results-section[hidden]{display:none !important;}
.search-results-section{
  margin-top:28px !important;
}
.search-results-section .section-title-row p{
  display:inline-flex !important;
}
.search-result-card{
  display:flex !important;
  opacity:1 !important;
  transform:none !important;
}
#search-results-grid:empty::before{
  content:"没有找到相关工具，可以换个关键词试试。";
  grid-column:1/-1;
  padding:24px;
  color:var(--yk-muted);
  text-align:center;
  border-radius:24px;
  border:1px dashed var(--yk-line);
  background:rgba(255,255,255,.26);
}
@media(max-width:760px){
  .smart-toolbar{
    top:10px !important;
    width:calc(100vw - 20px) !important;
    min-height:54px !important;
  }
  body.has-smart-toolbar,
  body.has-smart-toolbar.yk-tool-page,
  body.has-smart-toolbar.tool-page-normalized,
  body.has-smart-toolbar.watermark-tool{
    padding:82px 10px 22px !important;
  }
  .yk-auto-hero,
  body.tool-page-normalized .yk-hero{
    border-radius:24px !important;
    margin-bottom:16px !important;
  }
}
