/* GYROX Tools v0.1.0 - intentionally scoped to GYROX interfaces. */
.gyrox-tool,.gyrox-index{--gx-ink:#15233a;--gx-muted:#5d6d83;--gx-border:#e4eaf0;--gx-accent:#12a8b9;--gx-accent-dark:#087887;--gx-bg:#f6f9fc;--gx-radius:18px;box-sizing:border-box;width:min(1152px,calc(100vw - 32px));max-width:none;position:relative;left:50%;transform:translateX(-50%);color:var(--gx-ink);font-family:inherit;margin:12px 0 54px}
.gyrox-tool *, .gyrox-index *{box-sizing:border-box}
.gyrox-tool button,.gyrox-tool input,.gyrox-tool select{font-family:inherit}
.gyrox-hero{border-radius:22px;background:linear-gradient(120deg,#10243b,#163c4b 65%,#0d5157);padding:42px 42px 36px;color:#fff;position:relative;overflow:hidden;margin:0 0 24px}
.gyrox-hero:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;border:1px solid #7ae8f252;right:-90px;top:-128px;box-shadow:0 0 0 55px #74e8f015,0 0 0 110px #74e8f00a;pointer-events:none}
.gyrox-eyebrow{display:inline-block;color:#a2edf3;letter-spacing:2px;font-size:11px;font-weight:800;margin-bottom:13px}
.gyrox-hero h2{max-width:730px;font-size:clamp(25px,3.6vw,40px);line-height:1.18;margin:0 0 13px;font-weight:800;letter-spacing:-.035em;color:#fff}
.gyrox-hero p{max-width:730px;font-size:15px;line-height:1.7;margin:0;color:#d2e0e9}
.gyrox-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.gyrox-chips span{font-size:12px;padding:6px 11px;border-radius:40px;background:#ffffff15;border:1px solid #ffffff26;color:#dceef3}
.gyrox-workspace{display:grid;grid-template-columns:minmax(0,470px) minmax(0,1fr);gap:18px;align-items:start}
.gyrox-panel{background:#fff;border:1px solid var(--gx-border);border-radius:var(--gx-radius);padding:26px;box-shadow:0 6px 24px #1b38460c}
.gyrox-section-heading{display:flex;gap:10px;align-items:center;margin:0 0 19px}
.gyrox-section-heading h3{font-size:17px;margin:0;color:var(--gx-ink);font-weight:780}
.gyrox-step{display:grid;place-items:center;font-size:12px;font-weight:800;background:#e1f8fa;color:#0b8391;border-radius:9px;width:29px;height:29px;flex:none}
.gyrox-drop{position:relative;background:#f8fbfd;border:2px dashed #b8d6dd;padding:23px 14px;border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;min-height:183px;text-align:center;transition:background .15s,border-color .15s}
.gyrox-drop:hover,.gyrox-drop:focus-visible,.gyrox-drop.is-over{background:#eafafb;border-color:var(--gx-accent);outline:none}
.gyrox-drop-icon{color:#138997;display:grid;place-items:center;border-radius:12px;background:#ddf5f7;width:46px;height:46px;margin-bottom:5px}
.gyrox-drop strong{font-size:15px;color:#162d44}
.gyrox-drop span{font-size:12px;color:#597084}
.gyrox-drop small{font-size:11px;color:#8796a8;margin-top:3px}
.gyrox-file-info{color:var(--gx-muted);font-size:12px;margin:9px 0 21px;overflow-wrap:anywhere;min-height:18px}
.gyrox-field{margin:0 0 18px}
.gyrox-field label,.gyrox-fieldset legend{font-size:13px;line-height:1.4;color:#29405c;font-weight:750;margin-bottom:8px;display:block}
.gyrox-field select,.gyrox-field input[type="number"]{width:100%;padding:11px 12px;min-height:44px;appearance:auto;font-size:13px;border:1px solid #d2dce6;border-radius:10px;color:#21354a;background:#fff;box-shadow:none;line-height:1.4}
.gyrox-field input[type="number"]:focus,.gyrox-field select:focus{border-color:var(--gx-accent);outline:2px solid #85dbe253;outline-offset:1px}
.gyrox-two-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.gyrox-fieldset{padding:0;margin:0 0 19px;border:0;min-width:0}
.gyrox-fit-group{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gyrox-fit-group label{margin:0;cursor:pointer}
.gyrox-fit-group input{position:absolute;opacity:0;width:1px;height:1px}
.gyrox-fit-group span{display:block;font-size:12px;text-align:center;font-weight:700;background:#f7f9fc;border:1px solid #dbe4eb;border-radius:10px;padding:11px 5px;color:#50647c;transition:.12s}
.gyrox-fit-group input:checked+span{background:#e7f8fa;border-color:var(--gx-accent);color:#087f8c}
.gyrox-fit-group input:focus-visible+span{outline:3px solid #35bbca88;outline-offset:2px}
.gyrox-control-label{display:flex;align-items:center;justify-content:space-between;gap:12px}
.gyrox-control-label output{color:#0a8593;font-size:12px;font-weight:750}
.gyrox-field input[type="range"]{display:block;accent-color:#0e9ead;width:100%;margin:0 0 12px;cursor:pointer}
.gyrox-crop-control{border-radius:11px;background:#f7fafc;padding:12px 13px;margin-bottom:20px}
.gyrox-crop-control .gyrox-control-label:not(:first-child){margin-top:12px}
.gyrox-color-field{display:flex;align-items:center;gap:10px;height:44px;border-radius:10px;border:1px solid #d2dce6;padding:5px 10px}
.gyrox-color-field input[type="color"]{width:31px;height:30px;padding:0;border:0;border-radius:5px;background:transparent;cursor:pointer}
.gyrox-color-field span{color:#556a81;font-size:12px;font-weight:650}
.gyrox-preview-panel{position:sticky;top:28px}
.gyrox-preview-stage{min-height:370px;height:min(490px,54vw);max-height:540px;border-radius:15px;background:linear-gradient(45deg,#eaf0f5 25%,transparent 25%,transparent 75%,#eaf0f5 75%,#eaf0f5),linear-gradient(45deg,#eaf0f5 25%,#f6f8fa 25%,#f6f8fa 75%,#eaf0f5 75%,#eaf0f5);background-size:24px 24px;background-position:0 0,12px 12px;display:flex;align-items:center;justify-content:center;padding:22px;overflow:hidden}
.gyrox-preview-placeholder{color:#8292a4;text-align:center;display:flex;flex-direction:column;align-items:center;gap:9px}
.gyrox-preview-placeholder strong{font-size:15px;color:#50657a}
.gyrox-preview-placeholder span{font-size:12px}
.gyrox-preview-stage canvas{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 8px 28px #14253a2e}
.gyrox-preview-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:13px 0 19px;color:#63788d;font-size:12px}
.gyrox-download{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:50px;border:0;border-radius:12px;background:linear-gradient(100deg,#0b9faf,#0b8195);font-size:14px;font-weight:800;color:#fff;cursor:pointer;transition:filter .15s,transform .15s}
.gyrox-download:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-1px)}
.gyrox-download:disabled{opacity:.5;cursor:not-allowed;transform:none}
.gyrox-reset{display:block;margin:13px auto 0;border:0;background:transparent;color:#4b6a7b;text-decoration:underline;text-underline-offset:3px;font-size:12px;cursor:pointer;padding:5px 12px}
.gyrox-status{font-size:12px;line-height:1.55;color:#a83737;min-height:18px;text-align:center;margin:9px 0}
.gyrox-status[data-type="success"]{color:#0a7567}
.gyrox-privacy{border-top:1px solid #e7edf3;padding-top:15px;margin-top:10px;display:flex;align-items:start;gap:8px;font-size:12px;line-height:1.55;color:#657b8e}
.gyrox-privacy span{font-weight:900;color:#199e85}
.gyrox-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.gyrox-index .gyrox-hero{margin-bottom:24px}
.gyrox-tool-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:15px}
.gyrox-tool-card{display:flex;flex-direction:column;gap:12px;border-radius:16px;border:1px solid #dfe7ee;padding:22px;background:#fff;text-decoration:none!important;color:var(--gx-ink)!important;box-shadow:0 5px 18px #00132408}
.gyrox-tool-card:hover{border-color:#0b95a3;box-shadow:0 12px 28px #0013241a}
.gyrox-card-icon{font-size:26px;color:#0797a8}
.gyrox-tool-card strong{font-size:16px}
.gyrox-tool-card span:not(.gyrox-card-icon){font-size:13px;color:#627489;line-height:1.5}
.gyrox-tool-card em{font-size:13px;font-style:normal;color:#077d8a;font-weight:800;margin-top:5px}
@media (max-width:850px){.gyrox-workspace{grid-template-columns:1fr}.gyrox-preview-panel{position:relative;top:auto}.gyrox-preview-stage{height:470px}.gyrox-hero{padding:30px 25px}}
@media (max-width:560px){.gyrox-tool,.gyrox-index{width:calc(100vw - 24px);margin-bottom:30px}.gyrox-hero{border-radius:15px;padding:28px 20px}.gyrox-hero h2{font-size:27px}.gyrox-hero p{font-size:13px}.gyrox-panel{padding:18px;border-radius:14px}.gyrox-section-heading h3{font-size:15px}.gyrox-preview-stage{height:340px;min-height:280px;padding:15px}.gyrox-two-fields{gap:10px}.gyrox-field select,.gyrox-field input[type="number"]{font-size:12px}}

.gyrox-tool [hidden],.gyrox-index [hidden]{display:none!important}