@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;600;700;800;900&display=swap');
:root{--blue:#1967d2;--deep:#12213a;--ink:#172033;--muted:#687386;--line:#dfe5ec;--soft:#f4f7fa;--white:#fff;--shadow:0 14px 35px rgba(22,43,77,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font:16px/1.6 "Noto Sans SC",system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}main{max-width:1180px;min-height:calc(100vh - 180px);margin:auto;padding:0 24px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.header-inner{max-width:1180px;height:74px;margin:auto;padding:0 24px;display:flex;align-items:center;gap:38px}.brand{display:flex;align-items:center;gap:11px;min-width:max-content}.brand>span:last-child{display:grid;line-height:1}.brand b{font-size:1.22rem;letter-spacing:.08em}.brand small{font:500 .54rem/1.5 "DM Mono";letter-spacing:.16em;color:var(--muted)}.brand-mark{width:38px;height:38px;border-radius:10px;background:var(--blue);display:grid;place-content:center;gap:5px;box-shadow:inset 0 -5px 10px rgba(0,0,0,.08)}.brand-mark i{width:19px;height:4px;background:#fff;border-radius:4px;display:block}.header-search{height:42px;max-width:470px;flex:1;display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;background:var(--soft);padding:0 12px}.header-search:focus-within{border-color:#a9c7ee;box-shadow:0 0 0 3px #e6f0fc;background:#fff}.header-search svg{width:18px;fill:none;stroke:var(--muted);stroke-width:1.8}.header-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:0 11px}.header-search kbd{color:#9ba5b4;border:1px solid #d3dae3;border-radius:4px;background:#fff;padding:0 6px;font:12px "DM Mono"}.header-inner nav{margin-left:auto;display:flex;align-items:center;gap:25px;font-weight:600;font-size:.92rem}.header-inner nav>a:hover{color:var(--blue)}.nav-button{padding:8px 16px;border-radius:7px;background:var(--blue);color:#fff!important}.user-link{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--deep);color:#fff!important}.flash-stack{position:fixed;z-index:50;left:50%;top:88px;transform:translateX(-50%);display:grid;gap:8px}.flash{min-width:280px;padding:11px 16px;border-radius:8px;background:#eaf2fd;border:1px solid #b9d1f1;box-shadow:var(--shadow);text-align:center}.flash.error{background:#fff0f0;border-color:#ffcaca}.flash.success{background:#ecf9f1;border-color:#b8e7ca}
.intro{padding:76px 0 58px;display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:60px}.overline{font:500 .72rem "DM Mono";letter-spacing:.15em;color:var(--blue)}.intro h1{margin:17px 0 0;font-size:clamp(3.5rem,7vw,6.6rem);letter-spacing:-.075em;line-height:.96}.intro h1 em,.auth-copy h1 em{font-style:normal;color:var(--blue)}.intro>p{max-width:410px;margin:0 0 10px;color:var(--muted);font-size:1.08rem;line-height:1.9}.category-bar{display:flex;gap:33px;overflow:auto;border-block:1px solid var(--line);padding:14px 2px;white-space:nowrap}.category-bar a{position:relative;color:var(--muted);font-weight:600;font-size:.91rem}.category-bar a:hover,.category-bar a.active{color:var(--blue)}.category-bar a.active:after{content:"";position:absolute;left:0;right:0;bottom:-15px;height:2px;background:var(--blue)}.category-bar sup{font:500 .62rem "DM Mono"}.result-note{margin:28px 0;color:var(--muted)}.tool-sections{padding:34px 0 90px}.tool-section{display:grid;grid-template-columns:180px 1fr;gap:32px;padding:34px 0;border-bottom:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:flex-start}.section-heading h2{margin:3px 0;font-size:1.18rem}.section-heading span{font:400 .7rem "DM Mono";color:#a1a9b5}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.tool-card{min-height:108px;display:flex;align-items:center;gap:14px;padding:17px;border:1px solid var(--line);border-radius:11px;background:#fff;transition:.2s}.tool-card:hover{border-color:#b8c5d4;transform:translateY(-3px);box-shadow:var(--shadow)}.tool-icon{flex:0 0 auto;width:45px;height:45px;border-radius:11px;display:grid;place-items:center;background:#e8f0fe;color:#1967d2;font:700 .9rem "DM Mono"}.tool-icon.blue{background:#e8f0fe;color:#1967d2}.tool-icon.violet{background:#f0eaff;color:#7450c8}.tool-icon.cyan{background:#e4f7f8;color:#07818a}.tool-icon.orange{background:#fff0df;color:#d66a00}.tool-icon.green{background:#e7f7eb;color:#268144}.tool-icon.pink{background:#fce9f2;color:#be3f79}.tool-icon.yellow{background:#fff7d7;color:#9d7300}.tool-icon.red{background:#ffebeb;color:#cc3e3e}.tool-copy{display:grid;min-width:0}.tool-copy b{font-size:.95rem}.tool-copy small{margin-top:3px;color:var(--muted);font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.arrow{margin-left:auto;color:#a7b0bc;transition:.2s}.tool-card:hover .arrow{color:var(--blue);transform:translate(2px,-2px)}.privacy-strip{margin:0 0 88px;padding:44px 48px;background:var(--deep);color:#fff;border-radius:14px;display:grid;grid-template-columns:150px 1.1fr .9fr;gap:30px;align-items:center}.privacy-strip>span{font:500 .7rem "DM Mono";letter-spacing:.16em;color:#74aaf2}.privacy-strip h2{margin:0;font-size:1.65rem}.privacy-strip p{margin:0;color:#aebbd0;font-size:.9rem}.empty-state{padding:100px 20px;text-align:center}.empty-state>span{color:var(--blue);font:500 4rem "DM Mono"}.empty-state h2{margin:8px 0}.empty-state p{color:var(--muted)}.empty-state a{color:var(--blue);font-weight:700}
.tool-header{padding:52px 0 28px}.crumb{font-size:.88rem;color:var(--muted)}.crumb:hover{color:var(--blue)}.tool-title-row{display:flex;gap:22px;align-items:center;margin-top:33px}.tool-icon.large{width:68px;height:68px;border-radius:16px;font-size:1.15rem}.tool-title-row h1{margin:4px 0 2px;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.05em}.tool-title-row p{margin:0;color:var(--muted)}.workspace{margin-bottom:72px;border:1px solid var(--line);border-radius:14px;background:var(--soft);padding:18px;box-shadow:0 18px 50px rgba(28,54,88,.07)}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.editor-panel{min-width:0;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}.panel-head{height:47px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.panel-head label{font-weight:700;font-size:.86rem}.panel-head button{border:0;background:none;color:var(--blue);font-size:.8rem}.editor-panel textarea{display:block;width:100%;height:340px;resize:vertical;border:0;outline:0;padding:17px;background:#fff;color:#24314a;font:14px/1.65 "DM Mono","Noto Sans SC",monospace}.output-panel textarea{background:#fbfcfe}.big-input{width:100%;height:340px;border:0;padding:30px;font:500 4rem "DM Mono";outline:0}.action-row{display:flex;align-items:center;gap:10px;padding-top:16px}.action-row button,.primary{border:0;border-radius:7px;background:var(--blue);color:#fff;padding:11px 20px;font-weight:700}.action-row button:hover,.primary:hover{background:#1459b8}.action-row .secondary-action{background:#fff;color:var(--ink);border:1px solid var(--line)}#status{margin-left:auto;color:var(--muted);font-size:.82rem}.field{margin-bottom:12px;padding:14px;border:1px solid var(--line);border-radius:10px;background:#fff}.field>label{display:block;margin-bottom:8px;font-weight:700;font-size:.86rem}.regex-input,.color-input{display:flex;align-items:center;gap:10px}.regex-input{height:44px;border:1px solid var(--line);border-radius:7px;padding:0 12px;color:var(--muted);font-family:"DM Mono"}.regex-input input,.color-input input{flex:1;min-width:0;border:0;outline:0;font-family:"DM Mono"}.color-input input[type=color]{flex:0 0 54px;height:44px;padding:0;border:0;background:none}.color-input input:last-child{height:44px;border:1px solid var(--line);border-radius:7px;padding:0 12px}.stats{padding:16px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.stats[hidden]{display:none}.stats div{padding:13px;border-radius:8px;background:var(--soft);display:grid}.stats b{font:500 1.5rem "DM Mono"}.stats small{color:var(--muted)}.related{padding:0 0 90px}.related h2{font-size:1.15rem}.related>div{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.related a{padding:14px;display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px}.related a>span:last-child{margin-left:auto}
.workspace[data-tool="color"] .input-panel{display:none}.workspace[data-tool="color"] .editor-grid{grid-template-columns:1fr}
.auth-shell{min-height:690px;display:grid;grid-template-columns:1fr 430px;gap:100px;align-items:center;padding:70px 5%}.auth-copy h1{margin:14px 0 20px;font-size:clamp(3.2rem,6vw,5.6rem);line-height:1.02;letter-spacing:-.065em}.auth-copy p{color:var(--muted);font-size:1.05rem}.auth-card{padding:30px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:var(--shadow)}.form-title{display:flex;gap:15px;align-items:center;margin-bottom:25px}.form-title span{font:500 .7rem "DM Mono";color:var(--blue)}.form-title h2{margin:0}.auth-card label{display:grid;gap:8px;margin-bottom:17px;font-size:.86rem;font-weight:700}.auth-card input{width:100%;height:46px;border:1px solid var(--line);border-radius:8px;padding:0 12px;outline:0;background:var(--soft)}.auth-card input:focus{border-color:#99bce9;box-shadow:0 0 0 3px #e8f1fc;background:#fff}.wide{width:100%;margin-top:5px}.form-links{display:flex;justify-content:space-between;margin:-2px 0 18px;font-size:.8rem}.form-links a,.form-foot a{color:var(--blue)}.form-foot,.hint{text-align:center;color:var(--muted);font-size:.82rem}.compact-auth{min-height:610px}.account-shell{padding:70px 0 90px}.account-heading{display:flex;align-items:end;justify-content:space-between;margin:12px 0 45px}.account-heading h1{font-size:clamp(2.5rem,5vw,4.7rem);letter-spacing:-.06em;margin:0}.account-heading p{color:var(--muted);margin:5px 0}.outline-button{padding:10px 18px;border:1px solid var(--line);background:#fff;border-radius:7px}.account-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.account-grid article{min-height:165px;padding:22px;border:1px solid var(--line);border-radius:11px;display:flex;flex-direction:column}.account-grid article>span,.account-grid small{color:var(--muted);font-size:.8rem}.account-grid b{margin:auto 0;font-size:1.35rem}.account-grid a{color:var(--blue)}.recent-panel{margin-top:35px;padding-top:25px;border-top:1px solid var(--line)}.recent-tools{display:flex;gap:10px;flex-wrap:wrap}.recent-tools a{padding:9px 13px;background:var(--soft);border-radius:7px;color:var(--blue)}.recent-tools p{color:var(--muted)}.error-page{min-height:620px}.error-page>span{font-size:6rem}
footer{max-width:1180px;margin:auto;padding:35px 24px 45px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;gap:30px;align-items:center;color:var(--muted);font-size:.78rem}footer div{display:flex;gap:12px;align-items:center}footer b{color:var(--ink);font-size:1rem}footer p{margin:0}footer small{display:flex;justify-content:flex-end;gap:12px;text-align:right;font:400 .68rem "DM Mono"}footer small a:hover{color:var(--blue)}
@media(max-width:900px){.tool-grid{grid-template-columns:repeat(2,1fr)}.privacy-strip{grid-template-columns:1fr}.auth-shell{gap:40px}.account-grid{grid-template-columns:1fr}.header-search{max-width:none}.header-inner{gap:20px}}
@media(max-width:680px){main{padding:0 16px}.header-inner{height:66px;padding:0 16px}.header-search{display:none}.header-inner nav{gap:14px}.header-inner nav>a:first-child{display:none}.intro{grid-template-columns:1fr;padding:55px 0 38px;gap:24px}.intro h1{font-size:3.7rem}.category-bar{gap:24px}.tool-section{grid-template-columns:1fr;gap:12px}.section-heading{justify-content:flex-start;gap:10px}.tool-grid{grid-template-columns:1fr}.privacy-strip{padding:32px 25px}.tool-title-row{align-items:flex-start}.tool-title-row p{font-size:.88rem}.editor-grid{grid-template-columns:1fr}.editor-panel textarea,.big-input{height:260px}.action-row{flex-wrap:wrap}#status{width:100%;margin:4px 0}.related>div{grid-template-columns:1fr}.auth-shell{grid-template-columns:1fr;padding:55px 0}.auth-copy h1{font-size:3.5rem}.account-heading{align-items:flex-start;gap:20px}.account-heading h1{font-size:2.8rem}footer{grid-template-columns:1fr}footer small{justify-content:flex-start;flex-wrap:wrap;text-align:left}.stats{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}