/* toolzie-toolbar-css */
.toolzie-bar{position:fixed;top:0;left:0;right:0;z-index:99999;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:rgba(255,255,255,0.97);border-bottom:1px solid #e2e8f0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;transition:background 0.3s,border-color 0.3s;}
html.dark .toolzie-bar,body.dark-mode .toolzie-bar{background:rgba(15,23,42,0.97);border-color:#334155;}
.toolzie-bar a.tz-home{display:flex;align-items:center;gap:6px;text-decoration:none;color:#6366f1;font-size:0.85rem;font-weight:600;padding:4px 12px 4px 8px;border-radius:8px;transition:background 0.2s;}
.toolzie-bar a.tz-home:hover{background:rgba(99,102,241,0.1);}
.toolzie-bar a.tz-home svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.tz-toggle{width:34px;height:34px;border:1px solid #e2e8f0;border-radius:8px;background:#f1f5f9;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.05rem;line-height:1;transition:all 0.2s;padding:0;color:#64748b;}
.tz-toggle:hover{border-color:#6366f1;background:rgba(99,102,241,0.08);color:#6366f1;}
html.dark .tz-toggle,body.dark-mode .tz-toggle{border-color:#475569;background:#1e293b;color:#94a3b8;}
html.dark .tz-toggle:hover,body.dark-mode .tz-toggle:hover{border-color:#818cf8;background:rgba(129,140,248,0.1);color:#818cf8;}
body{padding-top:50px!important;}
/* Dark mode base overrides for tools without dark CSS */
html.dark body,body.dark-mode{background-color:#0f172a!important;color:#e2e8f0!important;}
html.dark h1,html.dark h2,html.dark h3,html.dark h4,html.dark label,html.dark th,body.dark-mode h1,body.dark-mode h2,body.dark-mode h3,body.dark-mode h4,body.dark-mode label,body.dark-mode th{color:#e2e8f0!important;}
html.dark input,html.dark textarea,html.dark select,body.dark-mode input,body.dark-mode textarea,body.dark-mode select{background-color:#1e293b!important;color:#e2e8f0!important;border-color:#334155!important;}
html.dark .container,html.dark .checker-container,html.dark .card,html.dark [class*="container"]:not(.toolzie-bar):not(#toolzie-toolbar),body.dark-mode .container,body.dark-mode .checker-container,body.dark-mode .card,body.dark-mode [class*="container"]:not(.toolzie-bar):not(#toolzie-toolbar){background-color:#1e293b!important;border-color:#334155!important;color:#e2e8f0!important;}
html.dark [id*="result"],html.dark [id*="Result"],html.dark [class*="result"],body.dark-mode [id*="result"],body.dark-mode [id*="Result"],body.dark-mode [class*="result"]{background-color:#162032!important;border-color:#334155!important;color:#e2e8f0!important;}
html.dark .explanation,html.dark .note,html.dark p,body.dark-mode .explanation,body.dark-mode .note{color:#94a3b8!important;}
html.dark table,html.dark th,html.dark td,body.dark-mode table,body.dark-mode th,body.dark-mode td{border-color:#334155!important;color:#e2e8f0!important;}
html.dark th,body.dark-mode th{background-color:#162032!important;}
html.dark td,body.dark-mode td{background-color:#1e293b!important;}
html.dark hr,body.dark-mode hr{border-color:#334155!important;}
html.dark a:not(.tz-home),body.dark-mode a:not(.tz-home){color:#818cf8;}
html.dark code,html.dark pre,body.dark-mode code,body.dark-mode pre{background-color:#162032!important;color:#e2e8f0!important;}

/* toolzie-bottom-css */
.tz-share-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#f8fafc;color:#64748b;cursor:pointer;transition:all .2s;text-decoration:none;font-size:14px;}
.tz-share-btn:hover{border-color:#6366f1;background:rgba(99,102,241,0.08);color:#6366f1;}
html.dark .tz-share-btn,body.dark-mode .tz-share-btn{border-color:#475569;background:#1e293b;color:#94a3b8;}
html.dark .tz-share-btn:hover,body.dark-mode .tz-share-btn:hover{border-color:#818cf8;color:#818cf8;background:rgba(129,140,248,0.1);}
.tz-fb-btn{font-size:0.8rem;padding:6px 14px;border-radius:8px;border:1px solid #e2e8f0;background:#f8fafc;color:#64748b;cursor:pointer;font-family:'Inter',sans-serif;font-weight:500;transition:all .2s;}
.tz-fb-btn:hover{border-color:#6366f1;background:rgba(99,102,241,0.08);color:#6366f1;}
html.dark .tz-fb-btn,body.dark-mode .tz-fb-btn{border-color:#475569;background:#1e293b;color:#94a3b8;}
html.dark .tz-fb-btn:hover,body.dark-mode .tz-fb-btn:hover{border-color:#818cf8;color:#818cf8;}
.tz-rel-card{display:block;padding:12px 16px;background:var(--bg-secondary,#fff);border:1px solid var(--border-color,#e2e8f0);border-radius:10px;text-decoration:none;color:var(--text-primary,#0f172a);font-size:0.85rem;font-weight:500;font-family:'Inter',sans-serif;transition:all .2s;text-align:center;}
.tz-rel-card:hover{border-color:#6366f1;background:rgba(99,102,241,0.06);color:#6366f1;transform:translateY(-2px);box-shadow:0 4px 12px rgba(99,102,241,0.1);}
html.dark .tz-rel-card,body.dark-mode .tz-rel-card{background:#1e293b;border-color:#334155;color:#e2e8f0;}
html.dark .tz-rel-card:hover,body.dark-mode .tz-rel-card:hover{border-color:#818cf8;color:#818cf8;background:rgba(129,140,248,0.08);}

/* toolzie-a11y-css */
.tz-skip-link{position:absolute;top:-100px;left:16px;background:#6366f1;color:#fff;padding:8px 16px;border-radius:8px;font-size:0.85rem;font-weight:600;z-index:999999;transition:top 0.2s;text-decoration:none;font-family:'Inter',sans-serif;}
.tz-skip-link:focus{top:8px;outline:3px solid #f59e0b;outline-offset:2px;}
*:focus-visible{outline:3px solid var(--accent,#6366f1);outline-offset:2px;border-radius:4px;}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important;}}

/* toolzie-print-css */
@media print{.toolzie-bar,#toolzie-toolbar,#toolzie-related,#toolzie-bottom,.tz-skip-link,#toolzie-guide-link{display:none!important;}body{padding-top:0!important;background:#fff!important;color:#000!important;}a{color:#000!important;text-decoration:underline!important;}}

/* toolzie-copy-css */
.tz-copy-btn{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;border-radius:6px;border:1px solid var(--border-color,#e2e8f0);background:var(--bg-tertiary,#f1f5f9);color:var(--text-secondary,#475569);cursor:pointer;font-size:0.8rem;font-family:'Inter',sans-serif;font-weight:500;transition:all .2s;}
.tz-copy-btn:hover{border-color:var(--accent,#6366f1);color:var(--accent,#6366f1);background:rgba(99,102,241,0.06);}
.tz-copy-btn.copied{background:#22c55e;color:#fff;border-color:#22c55e;}
html.dark .tz-copy-btn,body.dark-mode .tz-copy-btn{border-color:#475569;background:#1e293b;color:#94a3b8;}
html.dark .tz-copy-btn:hover,body.dark-mode .tz-copy-btn:hover{border-color:#818cf8;color:#818cf8;}

/* toolzie-responsive-css */
html,body{overflow-x:hidden!important;max-width:100vw!important;}
canvas{max-width:100%!important;height:auto!important;}
.game-container,.container,[class*="container"]:not(.toolzie-bar):not(#toolzie-toolbar){max-width:100%!important;box-sizing:border-box!important;}
img,video,iframe,embed,object{max-width:100%!important;height:auto!important;}
@media(max-width:768px){
  .toolzie-bar{padding:8px 12px!important;}
  .toolzie-bar a.tz-home{font-size:0.8rem!important;padding:4px 8px 4px 6px!important;}
}
@media(max-width:480px){
  body{padding-left:8px!important;padding-right:8px!important;}
  .game-container{width:100%!important;height:auto!important;aspect-ratio:2/3;}
  .game-container canvas{width:100%!important;height:100%!important;}
  #toolzie-related,#toolzie-bottom{padding:0 8px!important;}
  .container,.card,[class*="container"]:not(.toolzie-bar):not(#toolzie-toolbar){padding-left:12px!important;padding-right:12px!important;}
}

/* tz-sidebar-css */
.toolzie-bar .tz-toggle{margin-left:auto;}
.tz-toggle,.theme-toggle,#theme-toggle-container{display:none!important;}
.tz-menu-btn{width:34px;height:34px;border-radius:8px;border:1px solid var(--border-color,#e2e8f0);background:var(--bg-tertiary,#f1f5f9);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s;padding:0;color:var(--text-secondary,#475569);flex-shrink:0;}
.tz-menu-btn:hover{border-color:var(--accent,#6366f1);background:rgba(99,102,241,0.08);color:var(--accent,#6366f1);}
.tz-menu-btn svg{pointer-events:none;}
.tz-sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:100000;opacity:0;pointer-events:none;transition:opacity 0.3s ease;backdrop-filter:blur(2px);}
.tz-sidebar-overlay.tz-open{opacity:1;pointer-events:auto;}
.tz-sidebar{position:fixed;top:0;left:0;bottom:0;width:300px;max-width:85vw;background:var(--bg-secondary,#fff);z-index:100001;transform:translateX(-100%);transition:transform 0.3s ease;border-right:1px solid var(--border-color,#e2e8f0);overflow-y:auto;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;display:flex;flex-direction:column;}
.tz-sidebar.tz-open{transform:translateX(0);}
.tz-sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color,#e2e8f0);}
.tz-sidebar-brand{display:flex;align-items:center;text-decoration:none;}
.tz-sidebar-brand img{height:32px;width:auto;}
.tz-sidebar-close{width:36px;height:36px;border:none;background:var(--bg-tertiary,#f1f5f9);border-radius:8px;cursor:pointer;font-size:1.3rem;display:flex;align-items:center;justify-content:center;color:var(--text-secondary,#475569);transition:all 0.2s;}
.tz-sidebar-close:hover{background:rgba(239,68,68,0.1);color:#ef4444;}
.tz-sidebar-links{flex:1;padding:12px 0;overflow-y:auto;}
.tz-sidebar-link{display:flex;align-items:center;gap:12px;padding:11px 20px;color:var(--text-primary,#0f172a);text-decoration:none;font-size:0.9rem;font-weight:500;transition:all 0.15s;border:none;background:none;width:100%;cursor:pointer;text-align:left;}
.tz-sidebar-link:hover{background:var(--accent-light,rgba(99,102,241,0.08));color:var(--accent,#6366f1);}
.tz-sidebar-link svg{flex-shrink:0;color:var(--text-muted,#94a3b8);transition:color 0.15s;}
.tz-sidebar-link:hover svg{color:var(--accent,#6366f1);}
.tz-sidebar-expandable{font-family:inherit;}
.tz-sidebar-expandable .tz-chev{margin-left:auto;transition:transform 0.2s;flex-shrink:0;}
.tz-sidebar-sub{padding:2px 0 6px 0;}
.tz-sidebar-sub a{display:flex;align-items:center;gap:10px;padding:9px 20px 9px 52px;color:var(--text-secondary,#475569);text-decoration:none;font-size:0.85rem;font-weight:500;transition:all 0.15s;}
.tz-sidebar-sub a:hover{background:var(--accent-light,rgba(99,102,241,0.08));color:var(--accent,#6366f1);}
.tz-sidebar-sub a svg{flex-shrink:0;color:var(--text-muted,#94a3b8);transition:color 0.15s;}
.tz-sidebar-sub a:hover svg{color:var(--accent,#6366f1);}
.tz-sidebar-badge{display:inline-block;padding:2px 8px;border-radius:100px;background:var(--accent,#6366f1);color:#fff;font-size:0.65rem;font-weight:700;letter-spacing:0.5px;margin-left:auto;}
.tz-sidebar-footer{border-top:1px solid var(--border-color,#e2e8f0);padding:12px 0;}
.tz-sidebar-footer a{display:flex;align-items:center;gap:10px;padding:9px 20px;color:var(--text-muted,#94a3b8);text-decoration:none;font-size:0.82rem;font-weight:500;transition:all 0.15s;}
.tz-sidebar-footer a:hover{color:var(--accent,#6366f1);background:var(--accent-light,rgba(99,102,241,0.08));}
.tz-sidebar-footer a svg{flex-shrink:0;}
html.dark .tz-menu-btn,body.dark-mode .tz-menu-btn{border-color:#475569;background:#1e293b;color:#94a3b8;}
html.dark .tz-menu-btn:hover,body.dark-mode .tz-menu-btn:hover{border-color:#818cf8;color:#818cf8;background:rgba(129,140,248,0.1);}

html.dark .tz-sidebar,body.dark-mode .tz-sidebar{background:#1e293b;border-color:#334155;}
html.dark .tz-sidebar-header,body.dark-mode .tz-sidebar-header{border-color:#334155;}
html.dark .tz-sidebar-close,body.dark-mode .tz-sidebar-close{background:#334155;color:#94a3b8;}
html.dark .tz-sidebar-close:hover,body.dark-mode .tz-sidebar-close:hover{background:rgba(239,68,68,0.15);color:#ef4444;}
html.dark .tz-sidebar-link,body.dark-mode .tz-sidebar-link{color:#e2e8f0;}
html.dark .tz-sidebar-sub a,body.dark-mode .tz-sidebar-sub a{color:#94a3b8;}
html.dark .tz-sidebar-footer,body.dark-mode .tz-sidebar-footer{border-color:#334155;}
html.dark .tz-sidebar-footer a,body.dark-mode .tz-sidebar-footer a{color:#64748b;}