:root{--bg: #0e0d0b;--bg-2: #151311;--bg-3: #1c1a17;--line: rgba(245, 230, 200, .08);--line-strong: rgba(245, 230, 200, .16);--text: #f5ecd7;--text-dim: rgba(245, 236, 215, .68);--text-faint: rgba(245, 236, 215, .48);--accent: #d4940a;--accent-soft: rgba(212, 148, 10, .1);--accent-glow: rgba(212, 148, 10, .2);--good: #4ade80;--bad: #f87171;--radius-s: 4px;--radius-m: 8px;--radius-l: 14px;--font-serif: "Fraunces", "Georgia", serif;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "JetBrains Mono", "Menlo", monospace}:root[data-theme=light]{--bg: #f8f6f1;--bg-2: #ffffff;--bg-3: #eee9df;--line: rgba(40, 30, 10, .1);--line-strong: rgba(40, 30, 10, .18);--text: #1a1408;--text-dim: rgba(26, 20, 8, .65);--text-faint: rgba(26, 20, 8, .42);--accent: #b07808;--accent-soft: rgba(176, 120, 8, .1);--accent-glow: rgba(176, 120, 8, .18);--good: #16a34a;--bad: #dc2626}:root[data-theme=light] body:before{background-image:radial-gradient(circle at 15% 20%,rgba(176,120,8,.04),transparent 40%),radial-gradient(circle at 85% 80%,rgba(176,120,8,.03),transparent 45%)}:root[data-theme=light] .nav{background:#f8f6f1e6}:root[data-theme=light] .btn-primary{color:#fff}:root[data-theme=light] #qr-canvas{background:#fff;border:1px solid var(--line-strong)}:root[data-theme=light] .toast{background:var(--bg-2);box-shadow:0 8px 24px #0000001a}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 15% 20%,rgba(212,148,10,.04),transparent 40%),radial-gradient(circle at 85% 80%,rgba(212,148,10,.03),transparent 45%);pointer-events:none;z-index:0}.nav{position:sticky;top:0;z-index:100;background:#0e0d0bd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav-inner{max-width:1240px;margin:0 auto;padding:16px 32px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;color:var(--text)}.brand-mark{font-family:var(--font-serif);font-size:22px;color:var(--accent);line-height:1}.brand-name{font-family:var(--font-serif);font-weight:600;font-size:18px;letter-spacing:-.01em}.brand-tag{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);letter-spacing:.12em;text-transform:uppercase}.nav-links{display:flex;gap:28px}.nav-link{font-family:var(--font-mono);font-size:13px;color:var(--text-dim);text-decoration:none;letter-spacing:.04em;transition:color .2s}.nav-link:hover{color:var(--accent)}.hero{position:relative;max-width:1240px;margin:0 auto;padding:96px 32px 64px;display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:center;z-index:1}.hero-meta{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:12px;color:var(--text-faint);letter-spacing:.08em;text-transform:uppercase;margin-bottom:28px}.dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent-glow);animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.hero-title{font-family:var(--font-serif);font-size:clamp(44px,7vw,88px);line-height:.98;font-weight:600;letter-spacing:-.03em;margin-bottom:28px}.hero-title em{font-style:italic;color:var(--accent);font-weight:400}.hero-sub{font-size:17px;color:var(--text-dim);max-width:520px;line-height:1.7;margin-bottom:40px}.hero-cta{display:flex;gap:12px;margin-bottom:56px;flex-wrap:wrap}.hero-stats{display:flex;gap:48px;padding-top:32px;border-top:1px solid var(--line)}.stat{display:flex;flex-direction:column}.stat-num{font-family:var(--font-serif);font-size:36px;font-weight:600;letter-spacing:-.02em;color:var(--accent);line-height:1}.stat-label{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);margin-top:8px;letter-spacing:.08em;text-transform:uppercase}.hero-deco{position:relative;display:flex;justify-content:center;align-items:center;opacity:.8}.deco-svg{width:100%;max-width:420px;height:auto}.deco-ring{fill:none;stroke:var(--line-strong);stroke-width:1}.deco-ring:nth-child(1){stroke:#f59e0b66}.deco-ring:nth-child(2){stroke:#f59e0b40}.deco-line{stroke:var(--line-strong);stroke-width:1;stroke-dasharray:4 4}.deco-text{font-family:var(--font-serif);font-style:italic;font-size:64px;fill:var(--accent);font-weight:400}.tool-grid{max-width:1240px;margin:0 auto;padding:16px 32px 96px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative;z-index:1}.tool-card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-l);padding:32px 24px;text-decoration:none;color:var(--text);display:flex;flex-direction:column;gap:12px;transition:border-color .2s,transform .2s,box-shadow .2s}.tool-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 12px 40px -12px #f59e0b26}.tool-card-idx{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.1em}.tool-card-name{font-family:var(--font-serif);font-size:20px;font-weight:600;letter-spacing:-.01em}.tool-card-desc{font-size:13px;color:var(--text-dim);line-height:1.6}.tool-card-arrow{margin-top:auto;font-family:var(--font-mono);font-size:12px;color:var(--text-faint);transition:color .2s}.tool-card:hover .tool-card-arrow{color:var(--accent)}.tool-page{max-width:1240px;margin:0 auto;padding:48px 32px 96px;position:relative;z-index:1}.tool-header{margin-bottom:40px}.tool-breadcrumb{font-family:var(--font-mono);font-size:12px;color:var(--text-faint);letter-spacing:.06em;margin-bottom:16px}.tool-breadcrumb a{color:var(--text-dim);text-decoration:none}.tool-breadcrumb a:hover{color:var(--accent)}.tool-title{font-family:var(--font-serif);font-size:clamp(32px,5vw,48px);font-weight:600;letter-spacing:-.02em;line-height:1.1}.tool-desc{font-size:16px;color:var(--text-dim);margin-top:12px;max-width:640px;line-height:1.7}.tool-body{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-l);padding:40px}.layout-wide .tool-page{max-width:100%;padding-left:48px;padding-right:48px}.layout-wide .tool-body{padding:32px}.layout-wide .tool-desc{max-width:none}.layout-wide .ad-slot{max-width:100%}.tool-page.is-fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;max-width:100%;margin:0;padding:24px 32px;background:var(--bg);overflow-y:auto}.tool-page.is-fullscreen .tool-header{margin-bottom:20px}.fullscreen-toggle{background:none;border:1px solid var(--line-strong);border-radius:var(--radius-s);padding:4px 10px;font-size:13px;color:var(--text-dim);cursor:pointer;transition:all .2s;font-family:var(--font-mono)}.fullscreen-toggle:hover{border-color:var(--accent);color:var(--accent)}.tool-body-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:32px}.tool-body-two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px}.tool-body-two-col .panel-col textarea{min-height:280px}.ad-slot{max-width:1240px;margin:0 auto;padding:16px 32px}.ad-horizontal{border:1px dashed var(--line-strong);border-radius:var(--radius-m);padding:32px;text-align:center;min-height:100px;background:var(--bg-2)}.ad-label{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}.ad-in-content{margin:24px 0;min-height:90px;border:1px dashed var(--line-strong);border-radius:var(--radius-m);padding:16px;text-align:center;background:var(--bg-3)}.ad-top{margin-top:24px;margin-bottom:16px}.ad-top>div{min-height:90px;border:1px dashed var(--line-strong);border-radius:var(--radius-m);padding:16px;text-align:center;background:var(--bg-2)}.ad-bottom{margin-top:32px;margin-bottom:16px}.ad-bottom>div{min-height:90px;border:1px dashed var(--line-strong);border-radius:var(--radius-m);padding:16px;text-align:center;background:var(--bg-2)}.field-label{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);letter-spacing:.08em;text-transform:uppercase;margin-bottom:-8px}.textarea,.input,.select{width:100%;background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--radius-s);padding:14px 16px;color:var(--text);font-family:var(--font-sans);font-size:14px;line-height:1.6;transition:border-color .2s,background .2s;resize:vertical}.textarea:focus,.input:focus,.select:focus{outline:none;border-color:var(--accent);background:var(--bg-3)}.textarea{min-height:120px}.code-area{font-family:var(--font-mono);font-size:13px;line-height:1.7}.mono-input{font-family:var(--font-mono);font-size:13px;text-transform:uppercase}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:flex;flex-direction:column;gap:8px}.btn-row{display:flex;gap:12px;margin-top:8px;flex-wrap:wrap}.btn-row.wrap{flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;font-family:var(--font-mono);font-size:13px;font-weight:500;letter-spacing:.04em;border-radius:var(--radius-s);cursor:pointer;border:1px solid transparent;transition:all .2s;text-decoration:none;background:transparent;color:var(--text)}.btn-primary{background:var(--accent);color:#1a1207;font-weight:600}.btn-primary:hover{background:#e0a010;transform:translateY(-1px);box-shadow:0 8px 24px -6px var(--accent-glow)}.btn-ghost{border-color:var(--line-strong);color:var(--text-dim)}.btn-ghost:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.status{font-family:var(--font-mono);font-size:12px;padding:8px 0;min-height:24px}.status.good{color:var(--good)}.status.bad{color:var(--bad)}.qr-box{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-m);padding:24px;display:flex;justify-content:center;align-items:center;min-height:340px}#qr-canvas{background:#fff;border-radius:var(--radius-s);max-width:100%;height:auto}.slider-row{display:flex;align-items:center;gap:16px}.slider{flex:1;accent-color:var(--accent)}.slider-val{font-family:var(--font-mono);font-size:22px;color:var(--accent);min-width:32px;text-align:right}.checkboxes{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px 0}.check{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text-dim);cursor:pointer}.check input{accent-color:var(--accent);width:16px;height:16px}.stats-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:24px}.stat-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-m);padding:20px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;transition:border-color .2s,transform .2s}.stat-card:hover{border-color:var(--accent);transform:translateY(-2px)}.stat-card-num{font-family:var(--font-serif);font-size:32px;font-weight:600;color:var(--accent);letter-spacing:-.02em;line-height:1}.stat-card-label{font-family:var(--font-mono);font-size:10px;color:var(--text-faint);letter-spacing:.08em;text-transform:uppercase}.color-row{display:flex;gap:12px;align-items:stretch}.color-input{width:80px;height:48px;border:1px solid var(--line-strong);border-radius:var(--radius-s);background:var(--bg);cursor:pointer;padding:4px}.color-row .input{flex:1}.color-values{display:flex;flex-direction:column;gap:10px;padding:16px 0}.color-val-row{display:flex;align-items:center;gap:16px}.color-val-label{font-family:var(--font-mono);font-size:12px;color:var(--text-dim);width:60px;letter-spacing:.08em}.color-preview{background:var(--accent);border-radius:var(--radius-m);min-height:200px;border:1px solid var(--line);transition:background .3s}.palette{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-m);padding:20px}.palette-label{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}.palette-row{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;border-radius:var(--radius-s);overflow:hidden}.palette-swatch{height:60px;cursor:pointer;transition:transform .15s}.palette-swatch:hover{transform:scaleY(1.1)}.about{position:relative;z-index:1}.about-inner{max-width:1240px;margin:0 auto;padding:96px 32px}.about-text{font-family:var(--font-serif);font-size:clamp(18px,2vw,24px);line-height:1.6;color:var(--text-dim);max-width:780px;margin-top:24px;margin-bottom:56px}.about-text strong{color:var(--accent);font-weight:600}.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.about-card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-l);padding:32px 28px;transition:border-color .2s,transform .2s}.about-card:hover{border-color:var(--accent);transform:translateY(-4px)}.about-idx{font-family:var(--font-mono);font-size:12px;color:var(--accent);letter-spacing:.1em}.about-h{font-family:var(--font-serif);font-size:22px;font-weight:600;letter-spacing:-.01em;margin:16px 0 10px}.about-p{color:var(--text-dim);font-size:14px;line-height:1.7}.footer{border-top:1px solid var(--line);padding:40px 32px;position:relative;z-index:1}.footer-inner{max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}.footer-brand{font-family:var(--font-serif);font-size:16px;font-weight:600;display:flex;align-items:center;gap:10px}.footer-meta{font-family:var(--font-mono);font-size:12px;color:var(--text-faint)}.toast-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px}.toast{background:var(--bg-3);border:1px solid var(--accent);color:var(--text);padding:12px 20px;border-radius:var(--radius-m);font-family:var(--font-mono);font-size:13px;animation:toast-in .3s ease-out,toast-out .3s ease-in 1.7s forwards;box-shadow:0 8px 24px #0006}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-out{0%{opacity:1}to{opacity:0;transform:translateY(-8px)}}.content-page{max-width:800px;margin:0 auto;padding:48px 32px 96px;position:relative;z-index:1}.content-page h1{font-family:var(--font-serif);font-size:36px;font-weight:600;margin-bottom:24px}.content-page h2{font-family:var(--font-serif);font-size:22px;font-weight:600;margin:32px 0 12px;color:var(--accent)}.content-page p{color:var(--text-dim);line-height:1.8;margin-bottom:16px}.content-page ul{color:var(--text-dim);line-height:1.8;margin-bottom:16px;padding-left:24px}@media(max-width:900px){.hero{grid-template-columns:1fr;padding:64px 20px 80px;gap:40px}.hero-deco{max-width:240px;margin:0 auto}.tool-grid{grid-template-columns:repeat(2,1fr);padding:48px 20px}.tool-body{padding:24px}.tool-body-grid,.tool-body-two-col{grid-template-columns:1fr;gap:24px}.stats-grid{grid-template-columns:repeat(3,1fr)}.about-grid{grid-template-columns:1fr}.about-inner{padding:64px 20px}.nav-inner{padding:14px 20px}.checkboxes,.field-row{grid-template-columns:1fr}.hero-stats{gap:24px;flex-wrap:wrap}.tool-page{padding:32px 20px 64px}.layout-wide .tool-page{padding:32px 16px 64px}}@media(max-width:500px){.tool-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}.hero-title{font-size:44px}}
