:root{--ink:#0b1a33;--brand:#0a84fc;--brand-2:#12d98a;--brand-soft:#e3f0ff;--brand-2-soft:#dcf8ec;--ink-soft:#eef1f6;--dash:#c7d0de;--sparkle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2312d98a' d='M12 1c.6 5.6 5.4 10.4 11 11-5.6.6-10.4 5.4-11 11-.6-5.6-5.4-10.4-11-11C6.6 11.4 11.4 6.6 12 1z'/%3E%3C/svg%3E")}.tgrid{grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:20px;display:grid}@media (width>=640px){.tgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1000px){.tgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}.tcard{isolation:isolate;min-height:212px;color:var(--ink);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff;border-radius:18px;flex-direction:column;gap:14px;padding:22px 22px 18px;transition:transform .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.tcard:hover{box-shadow:6px 6px 0 var(--ink);text-decoration:none;transform:translate(-2px,-2px)}.tcard:active{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,2px)}.tcard:focus-visible{outline:3px solid var(--brand);outline-offset:3px}.tcard:before{content:"";z-index:-1;opacity:.16;background:linear-gradient(var(--tone), var(--tone)) 100% 0 / 46px 3px no-repeat, linear-gradient(var(--tone), var(--tone)) 100% 50% / 30px 3px no-repeat, linear-gradient(var(--tone), var(--tone)) 100% 100% / 38px 3px no-repeat;border-radius:3px;width:46px;height:22px;position:absolute;top:26px;right:20px}.tcard:after{content:"";z-index:-1;opacity:.5;background:var(--sparkle) center / contain no-repeat;width:12px;height:12px;position:absolute;top:14px;right:74px}.tcard .wm{z-index:-1;color:var(--tone);opacity:.06;pointer-events:none;position:absolute;bottom:-26px;right:-22px;transform:rotate(-14deg)}.tile{border:2px solid var(--ink);background:var(--tile-bg);width:52px;height:52px;color:var(--tile-fg);border-radius:14px;flex:none;place-items:center;display:grid}.tone-blue{--tone:var(--brand);--tile-bg:var(--brand-soft);--tile-fg:var(--ink)}.tone-green{--tone:#0fb872;--tile-bg:var(--brand-2-soft);--tile-fg:var(--ink)}.tone-navy{--tone:var(--ink);--tile-bg:var(--ink);--tile-fg:var(--brand-2)}.tcard h2,.tcard h3{letter-spacing:-.01em;margin:0;font-size:19px;line-height:1.3}.tcard svg,.tile svg,.mini svg{max-width:none;height:auto;display:inline-block}.tcard p{color:#4a5568;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:14.5px;line-height:1.55;display:-webkit-box;overflow:hidden}.tcard .go{letter-spacing:.02em;align-items:center;gap:4px;margin-top:auto;font-size:13px;font-weight:700;display:inline-flex}.tcard:hover .go svg{transform:translate(3px)}.tcard .go svg{transition:transform .15s}.thero{border-bottom:2px solid var(--ink);background:radial-gradient(circle at 1px 1px,#0b1a3317 1px,#0000 0) 0 0/18px 18px;padding:36px 0 30px;position:relative}.thero .crumbs{color:var(--fg-3);margin-bottom:18px;font-size:13px}.thero .crumbs a{color:var(--fg-2)}.thero-row{align-items:flex-start;gap:18px;display:flex}.thero .tile{width:64px;height:64px;box-shadow:3px 3px 0 var(--ink);border-radius:18px}.thero h1{color:var(--ink);margin:2px 0 8px;font-size:clamp(28px,4.4vw,40px)}.thero .lead{color:#4a5568;max-width:560px;margin:0;font-size:17px}.thero .spark{background:var(--sparkle) center / contain no-repeat;opacity:.55;width:18px;height:18px;position:absolute}.tool-page{color:var(--ink)}.tool-page .card{border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff;border-radius:16px}.tool-page .card-soft{background:var(--ink-soft);box-shadow:none;border-style:dashed}.tool-page .table-wrap{border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff url(/images/mascot-watermark.png) right -18px bottom -24px/150px no-repeat;border-radius:14px;margin:18px 0;position:relative}.tool-page .table-wrap table{background:0 0;min-width:0}.tool-page .table-wrap th{background:var(--ink);color:#fff;letter-spacing:.1em;border-bottom:0;padding:11px 14px;font-size:12px;font-weight:700}.tool-page .table-wrap th:first-child{border-top-left-radius:11px}.tool-page .table-wrap th:last-child{border-top-right-radius:11px}.tool-page .table-wrap td{border-bottom:1px dashed var(--dash);vertical-align:middle;padding:12px 14px}.tool-page .table-wrap tr:last-child td{border-bottom:0}.tool-page .table-wrap tbody tr:hover td{background:#0a84fc0b}.tool-page .table-wrap td:first-child{font-weight:600}.tool-page .card .table-wrap{box-shadow:none;background-size:110px;border-width:1.5px}.tool-page .tag{white-space:nowrap;color:var(--fg-2);background:#fff;border:1.5px solid;border-radius:7px;padding:2px 8px;font-weight:700}.tool-page .tag-good{color:#0b8f55;background:var(--brand-2-soft)}.tool-page .tag-warn{color:#a06a00;background:#fff4d6}.tool-page .tag-bad{color:#c62828;background:#fdecec}.tool-page .tag-accent{color:#0667cf;background:var(--brand-soft)}.tool-page .btn{background:var(--ink);color:#fff;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--brand)}.tool-page .btn:hover{background:#13284a}.tool-page .btn-ghost{color:var(--ink);box-shadow:3px 3px 0 var(--ink);background:#fff}.tool-page .btn-ghost:hover{background:var(--brand-soft)}.tool-page .field{border:2px solid var(--ink);border-radius:12px}.tool-page .field:focus{outline:3px solid var(--brand);outline-offset:1px;border-color:var(--ink)}.tool-page .sec-h,.tool-page h2.mt-0{padding-left:14px;position:relative}.tool-page .sec-h:before{content:"";background:var(--brand);border-radius:3px;width:5px;position:absolute;top:.18em;bottom:.18em;left:0}.tool-explain{counter-reset:sec;border-top:2px dashed var(--ink);margin-top:56px;padding-top:28px}.tool-explain .ex-label{letter-spacing:.08em;color:var(--ink);border:2px solid var(--ink);background:var(--brand-2-soft);border-radius:999px;align-items:center;gap:8px;padding:4px 12px 4px 4px;font-size:13px;font-weight:700;display:inline-flex}.tool-explain .ex-label img{object-fit:contain;border:0;border-radius:0;width:26px;height:24px;max-height:none;margin:0}.tool-explain h2{counter-increment:sec;color:var(--ink);align-items:baseline;gap:12px;margin:40px 0 12px;font-size:22px;display:flex}.tool-explain h2:before{content:counter(sec, decimal-leading-zero);font:800 15px/1 var(--font-mono);color:var(--brand);border:2px solid var(--brand);border-radius:8px;flex:none;padding:5px 7px;transform:translateY(-2px)}.tool-explain p{color:#2d3a4f}.tool-explain ul{padding:0;list-style:none}.tool-explain li{padding-left:24px;position:relative}.tool-explain li+li{margin-top:10px}.tool-explain li:before{content:"";background:var(--sparkle) center / contain no-repeat;width:13px;height:13px;position:absolute;top:.42em;left:0}.tool-explain strong{color:var(--ink);background:linear-gradient(#0000 62%,#12d98a47 0)}.bf-note{align-items:flex-start;gap:14px;margin:28px 0;display:flex}.bf-note img{border:0;border-radius:0;flex:none;width:56px;height:auto;margin:0}.bf-note>div{border:2px solid var(--ink);box-shadow:3px 3px 0 var(--brand-2);background:#fff;border-radius:14px;flex:1;padding:14px 16px;font-size:15px;position:relative}.bf-note>div:before{content:"";border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);background:#fff;width:14px;height:14px;position:absolute;top:18px;left:-9px;transform:rotate(45deg)}.bf-note b{letter-spacing:.06em;color:var(--brand);margin-bottom:4px;font-size:13px;display:block}.more-tools{margin-top:56px}.more-tools h2{margin:0 0 14px;font-size:18px}.mini-grid{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:12px;display:grid}.mini{white-space:nowrap;border:2px solid var(--ink);color:var(--ink);background:#fff;border-radius:12px;align-items:center;gap:10px;padding:10px 12px;font-size:14px;font-weight:600;transition:transform .15s,box-shadow .15s;display:flex}.mini:hover{box-shadow:3px 3px 0 var(--ink);text-decoration:none;transform:translate(-1px,-1px)}.mini .tile{border-width:1.5px;border-radius:9px;width:32px;height:32px}
