.crosshair-creator{width:100%;max-width:1920px;margin:0 auto;padding:0}.crosshair-creator__header{text-align:center;margin-bottom:0}.crosshair-creator__subtitle{color:var(--font-color-weak);font-size:var(--type-body-size);margin-top:0}.crosshair-creator__content{display:grid;grid-template-columns:320px 1fr 320px;grid-gap:24px;gap:24px;align-items:start;transition:grid-template-columns var(--dur-overlay) var(--ease-out)}.crosshair-creator__content.bookmark-collapsed{grid-template-columns:320px 1fr 40px}@media(max-width:1200px){.crosshair-creator__content,.crosshair-creator__content.bookmark-collapsed{grid-template-columns:1fr}}.crosshair-creator__panel{background:var(--grey-transparent-250);border:1px solid var(--grey-transparent-500);border-radius:var(--border-radius-300);padding:0}.crosshair-creator__panel--left{display:flex;flex-direction:column;max-height:calc(100vh - 200px);padding-right:8px}.crosshair-creator__panel--right{max-height:calc(100vh - 200px);overflow-x:hidden;overflow-y:auto}.crosshair-creator__panel--right::-webkit-scrollbar{width:8px}.crosshair-creator__panel--right::-webkit-scrollbar-track{background:var(--grey-transparent-100)}.crosshair-creator__panel--right::-webkit-scrollbar-thumb{background:var(--grey-transparent-500);border-radius:4px}.crosshair-creator__panel--right::-webkit-scrollbar-thumb:hover{background:var(--grey-transparent-750)}.crosshair-creator__panel--center{display:flex;flex-direction:column;min-height:600px}.crosshair-creator__panel--right{position:relative;transition:padding var(--dur-overlay) var(--ease-out),min-width var(--dur-overlay) var(--ease-out);overflow:hidden}.crosshair-creator__panel--right.collapsed{padding:0;min-width:40px}.crosshair-creator__panel--right.collapsed .crosshair-creator__bookmarks,.crosshair-creator__panel--right.collapsed h3{opacity:0;pointer-events:none}.crosshair-creator__panel-content{flex:1 1;overflow-x:hidden;overflow-y:auto}.crosshair-creator__panel-content::-webkit-scrollbar{width:8px}.crosshair-creator__panel-content::-webkit-scrollbar-track{background:var(--grey-transparent-100)}.crosshair-creator__panel-content::-webkit-scrollbar-thumb{background:var(--grey-transparent-500);border-radius:4px}.crosshair-creator__panel-content::-webkit-scrollbar-thumb:hover{background:var(--grey-transparent-750)}.crosshair-creator__panel-toggle{position:absolute;left:0;top:50%;transform:translateY(-50%);width:40px;height:80px;background:var(--grey-transparent-250);border:1px solid var(--grey-transparent-500);border-radius:8px;color:var(--text-brand);font-size:24px;cursor:pointer;transition:background-color var(--dur-hover) var(--ease-micro),color var(--dur-hover) var(--ease-micro),left var(--dur-overlay) var(--ease-out),transform var(--dur-overlay) var(--ease-out);display:flex;align-items:center;justify-content:center;z-index:10}.crosshair-creator__panel-toggle:hover{background:var(--brand-1000);color:var(--white-1000)}.crosshair-creator__panel--right.collapsed .crosshair-creator__panel-toggle{left:50%;transform:translate(-50%,-50%)}.crosshair-creator__element-section{background:var(--grey-transparent-100);border:1px solid var(--grey-transparent-500);border-radius:var(--border-radius-200);margin-bottom:0;overflow:hidden;transition:border-color var(--dur-hover) var(--ease-micro),box-shadow var(--dur-hover) var(--ease-micro)}.crosshair-creator__element-section:hover{border-color:var(--stroke-mid)}.crosshair-creator__element-section.expanded{border-color:var(--brand-500);box-shadow:var(--elevation-raised)}.crosshair-creator__element-header{display:flex;align-items:center;justify-content:space-between;transition:background-color var(--dur-hover) var(--ease-micro)}.crosshair-creator__element-header:has(.crosshair-creator__element-header-left:hover){background:var(--fill-hover)}.crosshair-creator__element-header:has(.crosshair-creator__element-header-left:active){background:var(--fill-press)}.crosshair-creator__element-header-left{flex:1 1;min-width:0;margin:0;background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer}.crosshair-creator__element-header-left,.crosshair-creator__element-header-right{display:flex;align-items:center;gap:0;padding:24px 0}.crosshair-creator__element-chevron{display:flex;align-items:center;justify-content:center;width:24px;height:24px;font-size:16px;color:var(--font-color-weak);transition:transform var(--dur-base) var(--ease-out);transform:rotate(0deg);flex-shrink:0}.crosshair-creator__element-chevron.expanded{transform:rotate(90deg)}.crosshair-creator__element-title{font-size:18px;font-weight:500;color:var(--text-strong)}.crosshair-creator__element-delete{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:rgba(0,0,0,0);border:none;border-radius:var(--border-radius-100);cursor:pointer;opacity:.4;transition:opacity var(--dur-hover) var(--ease-micro),background-color var(--dur-hover) var(--ease-micro)}.crosshair-creator__element-delete .neo-icon{--neo-icon-box:16px;color:#fff;transition:color var(--dur-hover) var(--ease-micro)}.crosshair-creator__element-delete:hover{opacity:1;background:var(--red-200)}.crosshair-creator__element-delete:hover .neo-icon{color:#ff5f57}.crosshair-creator__element-content{padding:0 24px 0 0;border-top:1px solid var(--grey-transparent-500);animation:elementContentFadeIn var(--dur-hover) var(--ease-out)}@keyframes elementContentFadeIn{0%{opacity:0}to{opacity:1}}.crosshair-creator__element-content .crosshair-creator__control,.crosshair-creator__element-content .crosshair-creator__control:first-child,.crosshair-creator__element-content .neo-slider,.crosshair-creator__element-content .neo-slider:first-child{margin-top:24px}.crosshair-creator__element-content .crosshair-creator__control:last-child,.crosshair-creator__element-content .neo-slider:last-child{margin-bottom:24px}.crosshair-creator__add-element{position:relative;margin-top:24px;margin-bottom:32px}.crosshair-creator__add-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:160px;background:var(--grey-solid-850);border:1px solid var(--stroke-mid);border-radius:var(--border-radius-200);padding:0;z-index:10;box-shadow:var(--elevation-overlay);animation:addMenuFadeIn var(--dur-hover) var(--ease-out)}@keyframes addMenuFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.crosshair-creator__add-menu:before{content:"";position:absolute;top:-5px;left:16px;width:8px;height:8px;background:var(--grey-solid-850);border-left:1px solid var(--stroke-mid);border-top:1px solid var(--stroke-mid);transform:rotate(45deg)}.crosshair-creator__add-menu button{display:flex;align-items:center;gap:0;width:100%;height:32px;padding:0 16px;background:rgba(0,0,0,0);border:none;border-radius:var(--border-radius-100);color:var(--font-color);font-size:var(--type-body-size);font-weight:500;cursor:pointer;transition:background-color var(--dur-hover) var(--ease-micro),color var(--dur-hover) var(--ease-micro),transform var(--dur-press) var(--ease-micro)}.crosshair-creator__add-menu button:hover{background:var(--grey-transparent-500);color:var(--text-brand)}.crosshair-creator__add-menu button:active{background:var(--fill-press);transform:scale(.98)}.crosshair-creator__add-menu button:first-child{border-bottom:1px solid var(--grey-transparent-500);border-radius:var(--border-radius-100) var(--border-radius-100) 0 0;margin-bottom:0}.crosshair-creator__add-menu button:last-child{border-radius:0 0 var(--border-radius-100) var(--border-radius-100)}.crosshair-creator__section{margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--grey-transparent-500)}.crosshair-creator__section:last-child{border-bottom:none}.crosshair-creator__section h3{font-size:var(--type-h5-size);font-weight:var(--type-h5-weight);color:var(--text-brand);margin-bottom:24px}.crosshair-creator__section .crosshair-creator__control,.crosshair-creator__section .neo-slider{margin-bottom:24px}.crosshair-creator__section .crosshair-creator__control:last-child,.crosshair-creator__section .neo-slider:last-child{margin-bottom:0}.crosshair-creator__control label{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;color:var(--font-color-weak);font-size:var(--type-body-size);font-weight:500}.crosshair-creator__control label span{color:var(--text-brand);font-weight:600}.crosshair-creator__control--toggle{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.crosshair-creator__control--toggle label{margin-bottom:0;flex:1 1}.crosshair-creator__control--color{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.crosshair-creator__control--color label{margin-bottom:0;flex:1 1}.crosshair-creator__color-picker{position:relative;width:40px;height:40px;border-radius:50%;overflow:hidden;cursor:pointer;border:2px solid var(--stroke-weak);box-shadow:var(--elevation-raised);transition:border-color var(--dur-hover) var(--ease-micro),transform var(--dur-hover) var(--ease-micro)}.crosshair-creator__color-picker:hover{border-color:var(--brand-1000);transform:scale(1.05)}.crosshair-creator__color-picker input[type=color]{position:absolute;width:150%;height:150%;top:-25%;left:-25%;border:none;cursor:pointer;background:rgba(0,0,0,0);padding:0}.crosshair-creator__color-picker input[type=color]::-webkit-color-swatch-wrapper{padding:0}.crosshair-creator__color-picker input[type=color]::-webkit-color-swatch{border:none}.crosshair-creator__color-picker input[type=color]::-moz-color-swatch{border:none}.crosshair-creator__toggle-label{display:flex;align-items:center;gap:12px;font-size:var(--type-body-size);color:var(--font-color-weak)}.crosshair-creator__toggle-label label{margin:0}.crosshair-creator__toggle-label input[type=text],.crosshair-creator__toggle-label select{width:100%;padding:12px;background:var(--grey-transparent-100);border:1px solid var(--grey-transparent-500);border-radius:8px;color:var(--font-color);font-size:var(--type-body-size);transition:border-color var(--dur-base) var(--ease-micro)}.crosshair-creator__toggle-label input[type=text]:focus,.crosshair-creator__toggle-label input[type=text]:hover,.crosshair-creator__toggle-label select:focus,.crosshair-creator__toggle-label select:hover{border-color:var(--brand-1000)}.crosshair-creator__toggle-label input[type=color]{width:100%;height:40px;background:var(--grey-transparent-100);border:1px solid var(--grey-transparent-500);border-radius:8px;cursor:pointer;padding:4px}.crosshair-creator__toggle-label input[type=checkbox]{margin-right:8px;cursor:pointer;width:18px;height:18px;accent-color:var(--brand-1000)}.crosshair-creator__presets{display:flex;flex-wrap:wrap;gap:12px}.crosshair-creator__preset-btn{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--grey-transparent-100);border:1px solid var(--grey-transparent-500);border-radius:var(--border-radius-200);padding:8px;cursor:pointer;transition:border-color var(--dur-base) var(--ease-micro),background-color var(--dur-base) var(--ease-micro),transform var(--dur-base) var(--ease-micro)}.crosshair-creator__preset-btn:hover{border-color:var(--brand-1000);background:var(--grey-transparent-250);transform:translateY(-2px)}.crosshair-creator__preset-btn:active{transform:translateY(0)}.crosshair-creator__preset-btn img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1);opacity:.8;transition:opacity var(--dur-base) var(--ease-micro)}.crosshair-creator__preset-btn:hover img{opacity:1}.crosshair-creator__actions{display:flex;flex-direction:column;gap:12px}.crosshair-creator__import-inline{display:flex;gap:12px;flex-wrap:wrap;width:100%}.crosshair-creator__feedback.neo-callout{margin:0}.crosshair-creator__feedback-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.crosshair-creator__feedback-action{background:none;border:0;padding:0 4px;color:inherit;font:inherit;font-weight:600;text-decoration:underline;cursor:pointer}.crosshair-creator__feedback-dismiss{display:flex;align-items:center;justify-content:center;background:none;border:0;padding:0;color:inherit;cursor:pointer}.crosshair-creator__feedback-dismiss .neo-icon{--neo-icon-box:14px}.crosshair-creator__share-fallback{width:100%}.crosshair-creator__preview-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:1px solid var(--grey-transparent-500)}.crosshair-creator__preview-header h3{font-size:var(--type-h5-size);font-weight:var(--type-h5-weight);color:var(--text-brand)}.crosshair-creator__preview-header label{display:flex;align-items:center;gap:0;font-size:var(--type-body-size);color:var(--font-color-weak);cursor:pointer}.crosshair-creator__canvas-container{flex:1 1;position:relative;overflow:hidden;border-radius:var(--border-radius-200);min-height:400px;max-height:calc(100vh - 428px);cursor:none;background-size:cover;background-position:50%}.crosshair-creator__canvas-container--dark{background-image:url(/_next/static/media/dark_preview.cb0c7895.avif)}.crosshair-creator__canvas-container--light{background-image:url(/_next/static/media/light_preview.91043b9a.avif)}.crosshair-creator__canvas-container--marble{background-image:url(/_next/static/media/marble_preview.3f2a7181.avif)}.crosshair-creator__canvas-container canvas{position:absolute;transform:translate(-50%,-50%);pointer-events:none;image-rendering:crisp-edges}.crosshair-creator__preview-info{text-align:center;color:var(--font-color-weak);font-size:var(--type-caption-size)}.crosshair-creator__bg-selector{border-top:1px solid var(--grey-transparent-500);display:flex;justify-content:center}.crosshair-creator__bg-selector>label{display:block;margin-bottom:12px;color:var(--font-color-weak);font-size:var(--type-body-size);font-weight:500}.crosshair-creator__bg-options{display:flex;gap:12px;justify-content:center}.crosshair-creator__bg-options label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--grey-transparent-100);border:1px solid var(--grey-transparent-500);border-radius:8px;cursor:pointer;transition:border-color var(--dur-base) var(--ease-micro);font-size:var(--type-caption-size)}.crosshair-creator__bg-options label:hover{border-color:var(--brand-1000)}.crosshair-creator__bg-options label input[type=radio]{margin:0}.crosshair-creator__bg-options label input[type=radio]:checked+span{color:var(--text-brand);font-weight:600}.crosshair-creator__bookmarks{display:flex;flex-direction:column;gap:24px}.crosshair-creator__bookmark{display:flex;align-items:center;gap:16px;background:var(--grey-transparent-100);border:1px solid var(--grey-transparent-500);border-radius:8px;padding:12px;transition:border-color var(--dur-overlay) var(--ease-micro),transform var(--dur-overlay) var(--ease-micro),box-shadow var(--dur-overlay) var(--ease-micro)}.crosshair-creator__bookmark:hover{border-color:var(--brand-1000);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.3)}.crosshair-creator__bookmark-preview{flex-shrink:0;width:80px;height:80px;border-radius:8px;overflow:hidden;background:var(--grey-solid-1000);border:1px solid var(--grey-transparent-500)}.crosshair-creator__bookmark-preview img{width:100%;height:100%;object-fit:cover;display:block}.crosshair-creator__bookmark-info{flex:1 1;cursor:pointer}.crosshair-creator__bookmark-info h4{font-size:var(--type-body-size);margin-bottom:4px;color:var(--font-color)}.crosshair-creator__bookmark-info p{font-size:var(--type-caption-size);color:var(--font-color-weak)}.crosshair-creator__bookmark-delete{flex-shrink:0;background:rgba(0,0,0,0);border:none;color:var(--red-1000);cursor:pointer;padding:4px 8px;font-size:24px;line-height:1;border-radius:4px;transition:background-color var(--dur-base) var(--ease-micro)}.crosshair-creator__bookmark-delete:hover{background:var(--red-200)}.crosshair-creator__empty{text-align:center;color:var(--font-color-weak);padding:24px 16px;font-size:var(--type-body-size)}.crosshair-creator__modal{position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center}.crosshair-creator__modal-content{background:var(--grey-transparent-250);border:1px solid var(--grey-transparent-500);border-radius:var(--border-radius-300);width:90%;max-width:500px;max-height:90vh;overflow:hidden}.crosshair-creator__modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid var(--grey-transparent-500)}.crosshair-creator__modal-header h3{font-size:var(--type-h5-size);font-weight:var(--type-h5-weight);color:var(--text-brand);margin:0}.crosshair-creator__modal-close{background:none;border:none;color:var(--font-color-weak);font-size:1.5rem;cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:background-color var(--dur-base) var(--ease-micro),color var(--dur-base) var(--ease-micro)}.crosshair-creator__modal-close:hover{background:var(--grey-transparent-500);color:var(--font-color)}.crosshair-creator__modal-body{padding:24px;display:flex;flex-direction:column;align-items:center;gap:24px}.crosshair-creator__modal-body canvas{border:2px solid var(--grey-transparent-500);border-radius:8px;cursor:crosshair;background:var(--grey-transparent-100);image-rendering:pixelated}.crosshair-creator__pixel-tools{display:flex;gap:12px;width:100%}@media(prefers-reduced-motion:reduce){.crosshair-creator__add-menu button:active,.crosshair-creator__bookmark:hover,.crosshair-creator__color-picker:hover,.crosshair-creator__preset-btn:hover{transform:none}}