[data-tool="coordonnees-de-grille"] *,[data-tool="coordonnees-de-grille"] *::before,[data-tool="coordonnees-de-grille"] *::after{box-sizing: border-box}[data-tool="coordonnees-de-grille"] button,[data-tool="coordonnees-de-grille"] input,[data-tool="coordonnees-de-grille"] textarea{font: inherit}[data-tool="coordonnees-de-grille"] button:not(:disabled){cursor: pointer}.grid-coordinates-tool{display: grid;gap: 18px}.grid-coordinates-intro{margin: 0;color: var(--primary-dark,#123f73);line-height: 1.65}.grid-coordinates-card{min-width: 0;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;padding: 16px}.grid-coordinates-card h2,.grid-coordinates-pane h3{margin: 0;color: var(--primary-dark,#123f73);font-size: 20px;font-weight: 900;line-height: 1.2}.grid-coordinates-pane h3{font-size: 18px}.grid-coordinates-card-head,.grid-coordinates-pane-head{display: flex;align-items: center;justify-content: space-between;gap: 14px;margin-bottom: 16px}.grid-coordinates-actions{display: flex;flex-wrap: wrap;gap: 8px;align-items: center;justify-content: flex-end}.grid-coordinates-action{display: inline-flex;align-items: center;justify-content: center;gap: 7px;min-height: 42px;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;color: var(--primary-dark,#123f73);font-size: 15px;font-weight: 800;padding: 9px 14px;transition: background-color .18s ease,border-color .18s ease,color .18s ease,transform .12s ease}.grid-coordinates-action:hover:not(:disabled),.grid-coordinates-action:focus-visible:not(:disabled){border-color: #8a4f05;background: #fff7d7}.grid-coordinates-action:active:not(:disabled),.grid-coordinates-selector button:not(:disabled):active,.grid-coordinates-stepper button:not(:disabled):active{transform: translateY(1px)}.grid-coordinates-action:disabled{cursor: not-allowed;border-color: #eadca9;background: #fffaf0;color: #a98d64}.grid-coordinates-action-icon{flex: 0 0 auto;width: 16px;height: 16px;fill: currentColor}.grid-coordinates-options-grid{display: grid;grid-template-columns: minmax(260px,1fr) minmax(250px,.85fr);gap: 14px;align-items: end}.grid-coordinates-option-group{display: grid;gap: 8px;min-width: 0}.grid-coordinates-option-title,.grid-coordinates-field>span{display: block;color: var(--primary-dark,#123f73);font-size: 16px;font-weight: 900;line-height: 1.2}.grid-coordinates-selector{display: flex;align-items: stretch;width: 100%;min-width: 0;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;padding: 5px;gap: 4px}.grid-coordinates-selector-format{display: grid;grid-template-columns: repeat(4,minmax(0,1fr))}.grid-coordinates-selector button{flex: 1 1 0;min-width: 0;border: 0;border-radius: 7px;background: transparent;color: var(--primary-dark,#123f73);font-size: 15px;font-weight: 800;line-height: 1.15;padding: 11px 9px;text-align: center;transition: background-color .18s ease,color .18s ease,transform .12s ease}.grid-coordinates-selector button.is-active{background: #8a4f05;color: #fff}.grid-coordinates-selector button:not(.is-active):hover,.grid-coordinates-selector button:not(.is-active):focus-visible{background: #fff7d7}.grid-coordinates-dimensions{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 14px}.grid-coordinates-field{display: grid;gap: 8px;min-width: 0}.grid-coordinates-stepper{display: grid;grid-template-columns: 42px 58px 42px;gap: 8px;align-items: center}.grid-coordinates-stepper button,.grid-coordinates-stepper input{display: block;min-width: 0;min-height: 0;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;color: var(--primary-dark,#123f73);font-weight: 800;text-align: center}.grid-coordinates-stepper button{width: 42px;height: 42px;padding: 0;color: #8a4f05;font-size: 20px;line-height: 1;transition: background-color .18s ease,border-color .18s ease,transform .12s ease}.grid-coordinates-stepper button:not(:disabled):hover,.grid-coordinates-stepper button:not(:disabled):focus-visible{border-color: #8a4f05;background: #fff7d7}.grid-coordinates-stepper input{width: 58px;height: 42px;padding: 0 6px;font-size: 18px;line-height: 1;appearance: textfield}.grid-coordinates-stepper input::-webkit-outer-spin-button,.grid-coordinates-stepper input::-webkit-inner-spin-button{margin: 0;appearance: none}.grid-coordinates-switches{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 10px}.grid-coordinates-grid-head-control{flex: 0 0 auto}.grid-coordinates-grid-head-control .grid-coordinates-switch{min-height: 44px;min-width: 210px;padding: 8px 10px}.grid-coordinates-switch{position: relative;min-height: 56px;display: flex;align-items: center;justify-content: space-between;gap: 14px;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;color: var(--primary-dark,#123f73);font-weight: 800;line-height: 1.3;padding: 10px 12px;transition: background-color .18s ease,border-color .18s ease,color .18s ease}.grid-coordinates-switch:has(input:not(:checked)){background: #fffaf0;color: #496882}.grid-coordinates-switch:has(input:disabled){cursor: not-allowed;border-color: #eadca9;background: #f7f9fc;color: #7f8da3}.grid-coordinates-switch:has(input:focus-visible){outline: 3px solid color-mix(in srgb,var(--outil-focus) 30%,transparent);outline-offset: 2px}.grid-coordinates-switch input{position: absolute;opacity: 0;pointer-events: none}.grid-coordinates-switch>span:first-child{display: grid;gap: 2px;min-width: 0}.grid-coordinates-switch>span:first-child>span,.grid-coordinates-switch>span:first-child>small{overflow-wrap: anywhere}.grid-coordinates-switch>span:first-child>small{color: #8a4f05;font-size: 12px;font-weight: 900;text-transform: uppercase}.grid-coordinates-switch:has(input:not(:checked))>span:first-child>small{color: #6f7f91}.grid-coordinates-switch-ui{position: relative;flex: 0 0 auto;width: 52px;height: 28px;border: 2px solid #8a4f05;border-radius: 999px;background: #8a4f05}.grid-coordinates-switch-ui::after{content: "";position: absolute;top: 50%;left: calc(100% - 21px);width: 17px;height: 17px;border-radius: 50%;background: #fff;transform: translateY(-50%);transition: left .16s ease}.grid-coordinates-switch input:not(:checked) + .grid-coordinates-switch-ui{border-color: #d8c16b;background: #f4ead2}.grid-coordinates-switch input:disabled + .grid-coordinates-switch-ui{border-color: #d4dde8;background: #e7edf4}.grid-coordinates-switch input:not(:checked) + .grid-coordinates-switch-ui::after{left: 4px}.grid-coordinates-stats{display: flex;flex-wrap: wrap;justify-content: flex-end;gap: 10px 16px;color: #496882;font-weight: 800}.grid-coordinates-stats strong{color: #8a4f05}.grid-coordinates-conversion-grid{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 16px}.grid-coordinates-pane{min-width: 0;border: 1px solid #eadca9;border-radius: 8px;background: #fffdf4;padding: 14px}.grid-coordinates-pane textarea{display: block;width: 100%;min-height: 190px;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;color: var(--primary-dark,#123f73);font-size: 16px;line-height: 1.55;padding: 14px 16px;resize: vertical}.grid-coordinates-pane textarea[readonly]{background: #f7f9fc;color: #496882}.grid-coordinates-pane textarea:focus,.grid-coordinates-field input:focus,.grid-coordinates-stepper input:focus{border-color: #8a4f05;box-shadow: 0 0 0 3px rgba(227,207,120,.32);outline: 0}.grid-coordinates-status{min-height: 1.5em;margin: 12px 0 0;color: #496882;line-height: 1.5}.grid-coordinates-preview-wrap{display: flex;justify-content: center;overflow: auto;border: 1px solid #d8c16b;border-radius: 8px;background: #fffaf0;padding: 18px 12px}.grid-coordinates-preview{display: inline-grid;gap: 0;width: max-content;border-top: 1px solid #1f2d3d;border-left: 1px solid #1f2d3d}.grid-coordinates-row{display: flex}.grid-coordinates-cell{display: grid;place-items: center;width: clamp(30px,5vw,46px);aspect-ratio: 1;border-right: 1px solid #1f2d3d;border-bottom: 1px solid #1f2d3d;background: #fff;color: var(--primary-dark,#123f73);font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-weight: 800;line-height: 1;white-space: pre}.grid-coordinates-cell--empty{background: #fff;color: #7f8da3}.grid-coordinates-cell--picked{background: #fff;color: #8a4f05;box-shadow: inset 0 0 0 2px #e3cf78}.grid-coordinates-cell--header{background: #fff8df;color: #8a4f05;font-size: 13px;font-weight: 900}.grid-coordinates-cell--corner{color: transparent}.grid-coordinates-copy-helper{position: fixed;top: 0;left: -9999px}.grid-coordinates-info-note{margin: 22px 0 0;padding: 22px;border: 1px solid #e3cf78;border-radius: 8px;background: #fffdf4;color: #1f2d3d}.grid-coordinates-info-note h2{margin: 0 0 12px;color: var(--primary-dark,#123f73);font-size: 1.35rem;font-weight: 900;line-height: 1.2}.grid-coordinates-info-note p{margin: 0;line-height: 1.65}.grid-coordinates-info-note p + p{margin-top: 12px}.grid-coordinates-info-grid{display: grid;grid-template-columns: repeat(3,minmax(0,1fr));gap: 16px;margin-top: 16px}.grid-coordinates-info-card{min-width: 0;padding: 18px;border: 1px solid #e3cf78;border-radius: 8px;background: #fff;color: #1f2d3d}.grid-coordinates-info-card h3{margin: 0 0 10px;color: #8a4f05;font-size: 1.05rem;font-weight: 900;line-height: 1.25}.grid-coordinates-info-card p{margin: 0;line-height: 1.6}.grid-coordinates-info-link{color: var(--primary-dark,#123f73);font-weight: 800;text-decoration: underline;text-underline-offset: 0.18em}.grid-coordinates-info-link:hover,.grid-coordinates-info-link:focus-visible{color: var(--accent-dark,#c45a00)}@media (max-width: 980px){.grid-coordinates-options-grid,.grid-coordinates-conversion-grid,.grid-coordinates-info-grid{grid-template-columns: 1fr}.grid-coordinates-card-head,.grid-coordinates-pane-head{align-items: flex-start;flex-direction: column}.grid-coordinates-stats{justify-content: flex-start}}@media (max-width: 560px){.grid-coordinates-card{padding: 14px}.grid-coordinates-card-head,.grid-coordinates-pane-head,.grid-coordinates-actions,.grid-coordinates-action{width: 100%}.grid-coordinates-selector,.grid-coordinates-selector-format,.grid-coordinates-dimensions,.grid-coordinates-switches{display: flex;flex-direction: column}.grid-coordinates-stepper{justify-content: start}.grid-coordinates-cell{width: 28px}}