.graphics-dialog{box-sizing:border-box;width:min(820px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:0;border:1px solid #9a8756;border-radius:16px;background:#092b23;color:#edf0df;overflow:hidden}
.graphics-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:min(640px,calc(100dvh - 24px))}
.graphics-dialog::backdrop{background:#020c09ba}
.graphics-heading{position:relative;padding:18px 64px 14px 22px;border-bottom:1px solid #bca57436}
.graphics-heading h2{margin:0 0 5px;font-size:23px;color:#f0ce83}.graphics-heading p{margin:0;font-size:12px;line-height:1.4;color:#bdcdbf}
.graphics-heading>form{position:absolute;top:10px;right:10px;margin:0}.graphics-heading .modal-close{position:static;width:44px;height:44px;min-height:44px;display:grid;place-items:center;margin:0;padding:0;border:1px solid #758666;border-radius:10px;background:#173e32;color:#f0d38b;font-size:26px}
.graphics-body{display:grid;grid-template-columns:155px minmax(0,1fr);min-height:0;overflow:hidden}
.graphics-tabs{display:flex;flex-direction:column;gap:8px;padding:16px 10px;background:#06241d;border-right:1px solid #bca57426}
.graphics-tabs button{min-height:48px;border:1px solid #6b846340;border-radius:8px;background:#123c30;color:#d3dfce;font:inherit;font-size:12px;line-height:1.35;padding:8px;text-align:left;cursor:pointer}
.graphics-tabs button[aria-selected=true]{background:#dec17d;color:#172e24;border-color:#efd99c;font-weight:800}
.graphics-panels{min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:14px 18px 20px}
.graphics-panel[hidden]{display:none!important}.graphics-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px;align-content:start}
.graphics-field{display:flex;min-width:0;flex-direction:column;gap:6px;font:700 12px/1.4 Manrope,sans-serif;color:#e1e8d6}
.graphics-field select{box-sizing:border-box;width:100%;min-width:0;min-height:44px;border:1px solid #6c8366;border-radius:8px;padding:8px 10px;background:#08241c;color:#f3edda;font:400 14px/1.3 Manrope,sans-serif;color-scheme:dark}
.graphics-field input[type=range]{width:100%;height:44px;min-height:44px;padding:0;margin:0;accent-color:#e6c16d}.graphics-field output{font-size:12px;color:#ebca80}
.graphics-panel>p{grid-column:1/-1;margin:0;color:#b6caba;font-size:12px;line-height:1.5}
.graphics-footer{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid #bca57436;background:#09281f}
.graphics-status{min-width:0;display:grid;gap:3px}.graphics-status p{margin:0;color:#c4d3be;font-size:10px;line-height:1.4;overflow-wrap:anywhere}
.graphics-status #graphicsFeedback{color:#edca88}.graphics-footer>button{min-height:44px;padding:8px 12px;border-radius:9px;border:1px solid #6f8465;background:#163d30;color:#edebd6;font:700 12px/1.25 Manrope,sans-serif;cursor:pointer}.graphics-footer #graphicsApply{background:#edc875;color:#193125;border-color:#ffe0a0}
.graphics-dialog :is(button,select,input):focus-visible{outline:2px solid #ffe095;outline-offset:2px}.graphics-dialog button:disabled{opacity:.55;cursor:wait}
@media(max-width:560px){.graphics-dialog[open]{height:calc(100dvh - 20px)}.graphics-heading{padding-left:16px}.graphics-heading h2{font-size:21px}.graphics-body{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}.graphics-tabs{flex-direction:row;border-right:0;border-bottom:1px solid #bca57426;padding:8px;gap:5px}.graphics-tabs button{flex:1;font-size:11px;min-height:44px;text-align:center}.graphics-panels{padding:14px}.graphics-panel{grid-template-columns:minmax(0,1fr);gap:14px}.graphics-footer{grid-template-columns:1fr 1fr;padding:10px}.graphics-status{grid-column:1/-1;min-height:28px}.graphics-footer>button{font-size:12px}}
@media(orientation:landscape) and (max-height:650px){#graphicsDialog[open]{width:min(960px,calc(100vw - 16px));height:calc(100dvh - 16px);max-height:none;padding:0}#graphicsDialog .graphics-heading{padding:7px 60px 7px 16px;min-height:44px}#graphicsDialog .graphics-heading h2{font-size:18px;margin:0}#graphicsDialog .graphics-heading p{font-size:10px}#graphicsDialog .graphics-heading>form{top:4px;right:6px}#graphicsDialog .graphics-body{grid-template-columns:140px minmax(0,1fr)}#graphicsDialog .graphics-tabs{padding:8px;gap:6px}#graphicsDialog .graphics-tabs button{min-height:44px;font-size:11px}#graphicsDialog .graphics-panels{padding:10px 14px}#graphicsDialog .graphics-panel{gap:9px 14px}#graphicsDialog .graphics-field{gap:3px;font-size:11px}#graphicsDialog .graphics-field select{font-size:13px}#graphicsDialog .graphics-footer{padding:5px 12px;min-height:44px}#graphicsDialog .graphics-panel>p{font-size:11px}}
@media(orientation:landscape){html.sinuca-native #graphicsDialog[open]{width:calc(100vw - max(8px,env(safe-area-inset-left)) - max(8px,env(safe-area-inset-right)));height:calc(100dvh - max(8px,env(safe-area-inset-top)) - max(8px,env(safe-area-inset-bottom)));max-height:none;padding:0}}