@layer reset,base,components;@layer pages{.tools-hub__library{margin-block:var(--space-section-gap-tight) var(--space-section-gap);width:100%}.tools-hub .status-hub__page-row{grid-template-columns:repeat(2,minmax(0,1fr))}.tools-hub .status-hub__page-copy h3{font-size:var(--text-normal);line-height:var(--leading-title)}.tools-hub .status-hub__page-copy h3 a{color:var(--color-ink);text-decoration:none}.tools-hub .status-hub__page-copy h3 a:hover{color:var(--color-accent-deep)}.tools-hub__examples{gap:var(--space-small);width:100%;max-width:26em;display:grid}.tools-hub__examples>p{color:var(--color-ink-subtle);font-weight:700;font-size:var(--text-xx-small);line-height:var(--leading-title);letter-spacing:var(--tracking-wide);text-transform:uppercase}.tools-hub__examples ul{column-gap:var(--space-small);grid-template-columns:minmax(0,max-content) auto 1.5em;width:fit-content;max-width:100%}.tools-hub .tools-hub__examples li{grid-column:1/-1;grid-template-columns:subgrid}.tools-hub .tools-hub__examples li>span:nth-child(2){color:var(--color-ink-subtle)}.tools-hub__page-link{margin-top:var(--space-medium);color:var(--color-white);white-space:nowrap;text-decoration:none}.tools-hub__page-link:hover{color:var(--color-white)}.emoji-tool-page{max-width:52rem}.emoji-tool-page__header{padding-top:var(--space-section-tight)}.emoji-tool-page .status-guide__layout{margin-top:var(--space-large);display:block}.emoji-tool-panel{border:1px solid var(--color-border);border-radius:var(--radius-panel);background:var(--color-white);max-width:40em;padding:var(--space-large)}.emoji-tool-privacy{color:var(--color-ink-subtle);font-size:var(--text-x-small);max-width:38em}.tools-hub__header{padding-block:var(--space-section-tight) var(--space-section)}@media (width<=700px){.tools-hub__header{padding-block:var(--space-large)}.emoji-tool-page__header{padding-top:var(--space-large)}}.emoji-tool-form{gap:var(--space-small);grid-template-columns:minmax(0,1fr);display:grid}.emoji-tool-form label{color:var(--color-ink);font-weight:700;font-size:var(--text-small)}.emoji-tool-form .input{--input-border-color:oklch(var(--lch-black) / 12%);--input-padding:.95em 1.05em;--input-font-size:var(--text-medium)}.emoji-tool-actions{margin-top:var(--space-x-small);align-items:center;display:flex}.emoji-tool-actions .button.is-loading{animation:1.8s cubic-bezier(.37,0,.63,1) infinite emojiButtonBreathe}@keyframes emojiButtonBreathe{0%,to{box-shadow:var(--shadow-glass), 0 0 0 0 oklch(var(--lch-accent) / 0%);filter:brightness()}50%{box-shadow:var(--shadow-glass), 0 0 0 .35em oklch(var(--lch-accent) / 10%);filter:brightness(1.04)}}.emoji-tool-examples{align-items:center;gap:var(--space-x-small);margin-top:var(--space-x-small);scrollbar-width:none;flex-wrap:wrap;display:flex}.emoji-tool-examples.is-scrollable:not(.is-scroll-end){mask:linear-gradient(90deg,#000 0 92%,#0000 100%)}.emoji-tool-examples.is-scrollable:not(.is-scroll-start):not(.is-scroll-end){mask:linear-gradient(90deg,#0000 0,#000 8% 92%,#0000 100%)}.emoji-tool-examples.is-scrollable.is-scroll-end:not(.is-scroll-start){mask:linear-gradient(90deg,#0000 0,#000 8% 100%)}.emoji-tool-examples::-webkit-scrollbar{display:none}.emoji-tool-examples__label{color:var(--color-ink-subtle);font-size:var(--text-x-small)}.emoji-tool-examples button{cursor:pointer;border-radius:var(--radius-control);background:var(--color-surface);max-width:100%;color:var(--color-ink-subtle);font:inherit;font-size:var(--text-small);line-height:var(--leading-title);white-space:normal;text-align:left;border:0;flex:none;padding:.6em .8em}.emoji-tool-examples button:hover,.emoji-tool-examples button:focus-visible{color:var(--color-ink);text-underline-offset:.18em;text-decoration:underline}.emoji-tool-results:not(:empty){margin-top:var(--space-large)}.emoji-tool-notice{gap:var(--space-small);max-width:34rem;color:var(--color-ink-subtle);grid-template-columns:auto 1fr;display:grid}.emoji-tool-notice>span{font-size:var(--text-large)}.emoji-tool-notice h2{margin-bottom:var(--space-xx-small);color:var(--color-ink);font-size:var(--text-medium)}.emoji-tool-notice p{color:var(--color-ink-subtle);font-size:var(--text-small);line-height:var(--leading-body)}.emoji-result-set{animation:.18s ease-out fadeIn}.emoji-result-header{margin-bottom:var(--space-medium)}.emoji-result-header p{color:var(--color-ink-subtle);font-weight:700;font-size:var(--text-x-small);text-transform:uppercase;letter-spacing:var(--tracking-wide)}.emoji-best-match{align-items:center;gap:var(--space-large);grid-template-columns:auto minmax(0,1fr);max-width:36rem;display:grid}.emoji-best-match__emoji{background:oklch(var(--lch-black) / 3%);width:clamp(4.5rem,10vw,5.75rem);height:clamp(4.5rem,10vw,5.75rem);font-size:var(--text-xx-large);border-radius:999em;place-items:center;line-height:1;display:grid}.emoji-best-match__body p{color:var(--color-ink);font-weight:650;font-size:var(--text-medium);line-height:var(--leading-title)}.emoji-best-match__body .emoji-copy-button{margin-top:var(--space-medium)}.emoji-alternatives{gap:var(--space-small);margin-top:var(--space-large);max-width:36rem;display:grid}.emoji-alternative{align-items:center;gap:var(--space-medium);border-top:1px solid oklch(var(--lch-black) / 4.5%);padding-block:var(--space-small);grid-template-columns:2em minmax(0,1fr) auto;display:grid}.emoji-alternative>span{font-size:var(--text-x-large);line-height:1}.emoji-alternative p{color:var(--color-ink-subtle);font-size:var(--text-small);line-height:var(--leading-body)}.emoji-copy-button{cursor:pointer;background:oklch(var(--lch-accent) / 11%);min-height:2.5rem;color:var(--color-accent-deep);font-weight:800;font-size:var(--text-x-small);white-space:nowrap;border:0;border-radius:99em;justify-content:center;justify-self:start;align-items:center;padding:.72em 1em;line-height:1;display:inline-flex}.emoji-copy-button:hover,.emoji-copy-button[data-copied=true]{background:var(--color-accent-deep);color:var(--color-white)}.emoji-copy-button--secondary{color:var(--color-ink-subtle);background:0 0}.emoji-copy-button--secondary:hover,.emoji-copy-button--secondary[data-copied=true]{background:oklch(var(--lch-black) / 4%);color:var(--color-ink)}.emoji-ideas-grid{gap:0 var(--space-x-large);margin-top:var(--space-large);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.emoji-idea-group{border-top:1px solid oklch(var(--lch-black) / 4.5%);padding-block:var(--space-large)}.emoji-idea-group h3{color:var(--color-ink);font-size:var(--text-medium)}.emoji-idea-group ul{gap:var(--space-small);margin:var(--space-medium) 0 0;padding:0;list-style:none;display:grid}.emoji-idea-group li{align-items:center;gap:var(--space-x-small);color:var(--color-ink-subtle);font-size:var(--text-small);grid-template-columns:1.7em 1fr;display:grid}.emoji-idea-group li span:first-child{font-size:var(--text-large);line-height:1}.emoji-idea-group a,.emoji-ideas-directory-link a{color:var(--color-ink);font-weight:700;font-size:var(--text-small);text-decoration-color:oklch(var(--lch-accent) / 60%);text-underline-offset:.18em}.emoji-idea-group a:hover,.emoji-ideas-directory-link a:hover{color:var(--color-accent-deep)}.emoji-idea-group>a{margin-top:var(--space-medium);display:inline-flex}.emoji-ideas-directory-link{margin-top:var(--space-large);color:var(--color-ink-subtle);font-size:var(--text-small);line-height:var(--leading-body)}@media (prefers-reduced-motion:reduce){.emoji-tool-actions .button.is-loading,.emoji-result-set{animation:none}}@media (width<=700px){.emoji-tool-panel{padding:var(--space-medium)}.tools-hub__library{margin-block:var(--space-xx-large)}.tools-hub .status-hub__page-row{grid-template-columns:1fr}.tools-hub .status-hub__page-row ul{grid-area:auto/1}.emoji-tool-actions{align-items:stretch}.emoji-tool-actions .button{width:100%}.emoji-best-match{justify-items:start;gap:var(--space-medium);grid-template-columns:1fr}.emoji-alternative{grid-template-columns:2em minmax(0,1fr)}.emoji-alternative .emoji-copy-button{grid-column:2}.emoji-ideas-grid{grid-template-columns:1fr}}}@layer utilities;
