@import url("../../css/styles.css");
:root{--tool-accent:#6d5dfc;--tool-tint:rgba(109,93,252,.10)}body.tool-page{background:linear-gradient(180deg,#f7f8fc,#f3f6fb);min-height:100vh}.tool-page .site-header{position:sticky}.tool-main{width:min(1120px,calc(100% - 34px));margin:0 auto;padding:36px 0 72px}.breadcrumbs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin:2px 0 24px}.breadcrumbs a:hover{color:var(--tool-accent)}.breadcrumbs span{opacity:.55}.tool-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;padding:28px 30px;background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow-soft);margin-bottom:18px}.tool-hero:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-85px;top:-95px;background:radial-gradient(circle,var(--tool-accent),transparent 68%);opacity:.10}.tool-hero-icon{width:66px;height:66px;border-radius:20px;display:grid;place-items:center;background:var(--tool-tint);font-size:32px}.tool-kicker{display:flex;align-items:center;gap:8px;color:var(--tool-accent);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.11em}.tool-kicker i{width:7px;height:7px;border-radius:50%;background:var(--tool-accent)}.tool-hero h1{font-family:"Space Grotesk";font-size:clamp(28px,4vw,43px);letter-spacing:-.045em;margin:6px 0 8px}.tool-hero p{max-width:760px;margin:0;color:var(--muted);font-size:14px;line-height:1.65}.privacy-chip{z-index:1;display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 12px;color:var(--ink-2);font-size:11px;font-weight:800;white-space:nowrap}.privacy-chip b{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(23,166,115,.09)}.page-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.benefit{display:flex;gap:11px;align-items:flex-start;padding:16px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.75)}.benefit-icon{width:34px;height:34px;flex:0 0 auto;border-radius:11px;display:grid;place-items:center;background:var(--tool-tint);color:var(--tool-accent);font-weight:900}.benefit strong{display:block;font-size:12px;margin:1px 0 4px}.benefit span{display:block;color:var(--muted);font-size:10px;line-height:1.45}.tool-workspace-card{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);overflow:hidden}.tool-workspace-top{padding:19px 26px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.tool-workspace-top strong{font-family:"Space Grotesk";font-size:16px}.tool-workspace-top span{font-size:11px;color:var(--muted)}.emoji-workspace{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(330px,.9fr);gap:0}.emoji-controls{padding:22px;border-right:1px solid var(--line);background:#fbfcff}.control-block{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;margin-bottom:11px}.block-title{display:flex;align-items:center;gap:8px;margin-bottom:12px}.block-title span{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:var(--tool-tint);color:var(--tool-accent);font:900 10px Inter}.block-title strong{font-size:11px}.emoji-input-row{display:grid;grid-template-columns:1fr auto;gap:8px}.emoji-input-row input{height:50px;border:1px solid var(--line);border-radius:12px;padding:0 12px;font-size:28px}.emoji-input-row button,.preview-top button{border:1px solid var(--line);border-radius:11px;background:#fff;padding:0 12px;font:800 10px Inter}.emoji-picker{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin-top:9px}.emoji-pick{aspect-ratio:1;border:1px solid #e8eaf0;border-radius:9px;background:#fff;font-size:18px;cursor:pointer}.emoji-pick:hover{background:var(--tool-tint);border-color:rgba(109,93,252,.25)}.control-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.control-grid label{display:grid;gap:5px;font-size:9px;font-weight:800;color:var(--ink-2)}.control-grid label.wide{grid-column:span 2}.control-grid select,.control-grid input{width:100%;height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 9px;font:600 10px Inter}.control-grid input[type=color]{padding:4px}.range-row{margin-top:9px}.range-row label{display:flex;justify-content:space-between;font-size:9px;font-weight:800;color:var(--ink-2)}.range-row output{color:var(--tool-accent)}.range-row input{width:100%;accent-color:var(--tool-accent)}.emoji-preview{padding:22px;display:flex;flex-direction:column;min-height:690px}.preview-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.preview-top div{display:grid}.preview-top span{font-size:9px;font-weight:900;letter-spacing:.1em;color:var(--tool-accent)}.preview-top strong{font:700 11px "Space Grotesk";margin-top:3px}.canvas-shell{flex:1;min-height:420px;border-radius:22px;background:radial-gradient(circle at 50% 45%,#eef1f8,#e3e8f2);display:grid;place-items:center;padding:22px;overflow:hidden}.canvas-shell canvas{display:block;width:min(100%,520px);height:auto;max-height:520px;border-radius:22px;box-shadow:0 24px 60px rgba(25,35,55,.18)}.export-row{display:grid;grid-template-columns:auto auto 1fr;gap:8px;margin-top:14px}.export-row select,.secondary-action,.primary-action{height:42px;border-radius:11px;padding:0 13px;font:800 10px Inter}.export-row select,.secondary-action{background:#fff;border:1px solid var(--line);color:var(--ink-2)}.primary-action{border:0;background:linear-gradient(120deg,var(--tool-accent),#8b5cf6);color:#fff}.emoji-preview>p{margin:10px 0 0;color:var(--muted);font-size:9px;line-height:1.45}.related{margin-top:32px}.related-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:13px}.related h2{font-family:"Space Grotesk";font-size:20px;margin:0}.related-head>a{font-size:11px;font-weight:800;color:var(--tool-accent)}.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.related-card{padding:17px;border:1px solid var(--line);background:#fff;border-radius:17px;transition:.18s}.related-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-soft)}.related-card b{display:block;font-family:"Space Grotesk";font-size:13px;margin-bottom:5px}.related-card span{font-size:10px;color:var(--muted)}.toast-stack{position:fixed;right:18px;bottom:18px;z-index:999}.toast{padding:11px 14px;border-radius:11px;background:#111827;color:#fff;font-size:11px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.15)}@media(max-width:900px){.emoji-workspace{grid-template-columns:1fr}.emoji-controls{border-right:0;border-bottom:1px solid var(--line)}.emoji-preview{min-height:auto}.page-benefits{grid-template-columns:1fr}.tool-hero{grid-template-columns:auto 1fr}.privacy-chip{grid-column:1/-1;width:max-content}}@media(max-width:600px){.tool-main{width:min(100% - 22px,1120px);padding-top:20px}.tool-hero{padding:20px 17px;border-radius:20px;gap:13px}.tool-hero-icon{width:52px;height:52px;border-radius:16px;font-size:25px}.tool-hero h1{font-size:28px}.emoji-controls,.emoji-preview{padding:14px}.tool-workspace-card{border-radius:20px}.emoji-picker{grid-template-columns:repeat(8,1fr)}.control-grid{grid-template-columns:1fr 1fr}.control-grid label.wide{grid-column:span 2}.canvas-shell{min-height:320px;padding:12px}.export-row{grid-template-columns:1fr}.export-row>*{width:100%}.related-grid{grid-template-columns:1fr}}