.token-editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:1.5rem;align-items:start;--token-check-light:#cbd5e1;--token-check-dark:#94a3b8}.token-editor [hidden]{display:none!important}.token-editor button,.token-editor input,.token-editor select{font:inherit}.token-editor button{min-height:44px;padding:.65rem .85rem;border:1px solid var(--card-border);border-radius:.65rem;background:var(--background);color:var(--text);cursor:pointer;font-weight:600;transition:background .15s,border-color .15s}.token-editor button:hover:not(:disabled){border-color:var(--primary)}.token-editor button:disabled{opacity:.45;cursor:not-allowed}.token-editor :is(button,input,select,canvas):focus-visible{outline:3px solid var(--primary);outline-offset:3px}.token-editor .token-button-primary{background:var(--primary);color:var(--background);border-color:var(--primary);font-weight:750}.token-editor .token-button-primary:hover:not(:disabled){background:var(--primary-dark)}.token-preview-panel,.token-card{min-width:0;background:var(--card-bg);border:1px solid var(--card-border);border-radius:1rem;padding:1.25rem;box-shadow:var(--card-shadow)}.token-preview-panel{position:sticky;top:5.5rem}.token-preview-heading{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}.token-editor h2{margin:0;font-size:1.05rem;color:var(--text)}.token-card h2{display:flex;align-items:center;gap:.65rem;margin-bottom:1.15rem}.token-card h2>span{display:grid;place-items:center;border:1px solid var(--card-border);background:var(--background);color:var(--primary);width:1.8rem;height:1.8rem;border-radius:50%;font-size:.85rem}.token-history{display:flex;gap:.4rem}.token-history button{width:44px;padding:.3rem;font-size:1.45rem}.token-canvas-wrap,.token-border-thumb{background-color:var(--token-check-light);background-image:conic-gradient(var(--token-check-dark) 25%,transparent 0 50%,var(--token-check-dark) 0 75%,transparent 0);background-size:20px 20px}.token-canvas-wrap{position:relative;width:100%;max-width:600px;margin:0 auto;aspect-ratio:1;border:1px solid var(--card-border);border-radius:.75rem;overflow:hidden}.token-canvas-wrap canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y}.token-editor[data-has-image=true] canvas{touch-action:none}.token-canvas-wrap canvas:active{cursor:grabbing}.token-canvas-wrap canvas:focus-visible{outline-offset:-4px}.token-empty{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:.9rem;padding:1rem;background:var(--card-bg)}.token-empty-icon{display:grid;place-items:center;width:64px;height:64px;border:2px dashed var(--primary);border-radius:1rem;font-size:2rem;color:var(--primary)}.token-empty strong{font-size:clamp(1rem,2vw,1.35rem)}.token-editor p{margin:0}.token-empty p{line-height:1.6}.token-muted,.token-help{color:var(--text);opacity:.75;font-size:.8rem;line-height:1.55}.token-help{margin-top:.7rem!important}.token-drop-hint{position:absolute;inset:0;display:none;align-items:center;justify-content:center;text-align:center;background:var(--card-bg);border:3px dashed var(--primary);padding:1.5rem;color:var(--primary);font-weight:700;pointer-events:none}.token-canvas-wrap.is-dragging .token-drop-hint{display:flex}.token-feedback{display:grid;gap:.5rem;margin-top:1rem;font-size:.85rem;overflow-wrap:anywhere}.token-feedback [role=alert]{border-left:3px solid var(--highlight-negative);padding:.5rem .75rem;color:var(--text);background:var(--background)}.token-settings{display:grid;gap:1rem;min-width:0}.token-editor fieldset{border:0;min-width:0;margin:1rem 0 0;padding:0}.token-editor fieldset>legend{margin-bottom:.65rem;padding:0;font-size:.9rem;font-weight:700}.token-editor fieldset:disabled{opacity:.55}.token-field{display:grid;gap:.55rem;margin-top:1rem;min-width:0}.token-field:first-child{margin-top:0}.token-field>label,.token-field-heading>label{font-size:.9rem;font-weight:600}.token-field-heading{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.token-editor input:is([type=text],[type=number]),.token-editor select{width:100%;min-width:0;min-height:44px;background:var(--background);border:1px solid var(--card-border);border-radius:.6rem;padding:.55rem .7rem;color:var(--text)}.token-editor input[type=range]{width:100%;min-width:0;min-height:32px;accent-color:var(--primary)}.token-number{display:flex;align-items:center;gap:.35rem;font-size:.9rem}.token-number input[type=number]{width:5rem;min-height:38px;padding:.4rem}.token-editor .token-text-button{justify-self:start;border-color:transparent;background:transparent;min-height:36px;padding:.35rem 0;font-size:.8rem;color:var(--primary)}.token-image-actions{display:grid;gap:.55rem}#token-image-name,#token-border-name{overflow-wrap:anywhere}.token-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:1rem}.token-action-grid button{padding:.55rem .35rem;font-size:.8rem}.token-border-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}.token-editor .token-border-option{display:flex;flex-direction:column;align-items:center;gap:.5rem;min-width:0;padding:.4rem;font-size:.75rem;font-weight:500}.token-editor .token-border-option[aria-pressed=true]{border:2px solid var(--primary);padding:calc(.4rem - 1px);background:var(--background);box-shadow:0 0 0 1px var(--primary)}.token-border-thumb{display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:.4rem;overflow:hidden}.token-border-thumb img{display:block;width:100%;height:100%;object-fit:contain}.token-border-thumb>span:not(.token-no-border){color:#0f172a;font-size:2rem}.token-no-border{width:65%;aspect-ratio:1;border:2px dashed #334155;border-radius:50%}.token-color-field{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.85rem;font-size:.9rem}.token-gradient-stops{display:grid;gap:.2rem}.token-inline-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.65rem}.token-inline-actions button{min-height:36px;padding:.4rem .6rem;font-size:.8rem}#token-texture-preview{display:block;width:100%;height:auto;margin-top:.75rem;border:1px solid var(--card-border);border-radius:.6rem;background:var(--background)}.token-editor input[type=color]{width:54px;height:44px;padding:.2rem;border:1px solid var(--card-border);border-radius:.5rem;background:var(--background);cursor:pointer}.token-check{display:flex;align-items:center;gap:.5rem;min-height:44px;font-size:.85rem}.token-check input{accent-color:var(--primary);width:18px;height:18px}.token-filename{display:flex;align-items:center;gap:.5rem}.token-filename span{opacity:.7}.token-download-bar{display:grid;gap:.5rem;margin-top:1rem}.token-download-bar button{width:100%}.token-download-bar>span{text-align:center}.token-clear-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:1rem;padding-top:.75rem;border-top:1px solid var(--card-border)}.token-clear-row #token-clear{color:var(--text)}.token-sr-only,.token-file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media (max-width:900px){.token-editor{grid-template-columns:minmax(0,1fr)}.token-preview-panel{position:static}.token-settings{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.token-export{grid-column:1/-1}}@media (max-width:600px){.token-editor{gap:1rem;padding-bottom:6rem}.token-preview-panel,.token-card{padding:.85rem}.token-settings{grid-template-columns:minmax(0,1fr)}.token-export{grid-column:auto}.token-preview-heading{margin-bottom:.75rem}.token-empty{gap:.65rem}.token-empty-icon{width:44px;height:44px;font-size:1.6rem}.token-empty .token-muted{font-size:.7rem}.token-border-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.token-download-bar{position:fixed;bottom:0;left:0;right:0;margin:0;background:var(--card-bg);padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom));border-top:1px solid var(--card-border);z-index:1050}}@media (prefers-reduced-motion:reduce){.token-editor button{transition:none}}.page[data-astro-cid-23o72shj]{max-width:1200px;margin:0 auto;padding:1rem 0 2rem;display:flex;flex-direction:column;gap:1.25rem}.page-header[data-astro-cid-23o72shj]{display:flex;flex-direction:column;gap:.75rem;padding:0 0 .25rem}.page-header[data-astro-cid-23o72shj] h1[data-astro-cid-23o72shj]{margin:0;font-size:clamp(1.6rem,2.4vw,2rem);color:var(--primary)}.page-header[data-astro-cid-23o72shj] p[data-astro-cid-23o72shj]{margin:0;color:var(--text);line-height:1.75;max-width:720px}h1[data-astro-cid-23o72shj]{margin-bottom:.5rem}p[data-astro-cid-23o72shj]{margin-top:0;margin-bottom:1rem;color:var(--text)}@media (max-width: 840px){.page[data-astro-cid-23o72shj]{padding:.75rem .25rem 1rem}.page-header[data-astro-cid-23o72shj]{padding:0}}
