/* COGO_UI_STABILITY_R1_STYLE: presentation only; existing controls stay intact. */
html body dialog[open]{transition-property:opacity,background-color,border-color,box-shadow!important;animation:none!important}
html body dialog[open].opening8:not(:where(#liveRoom22,.live-modal22,.print-dialog)){animation:cogo-ui-appear-r1 .16s ease-out both!important}
html body dialog[open].closing8{animation:cogo-ui-disappear-r1 .19s ease-in both!important}
html body dialog[open]::backdrop{animation:none!important}
@keyframes cogo-ui-appear-r1{from{opacity:0}to{opacity:1}}
@keyframes cogo-ui-disappear-r1{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){html body dialog[open].opening8,html body dialog[open].closing8{animation:none!important}}

/* Size async surfaces before showModal. The body scrolls inside this shell;
   no ResizeObserver or post-paint width/height correction is installed. */
html body dialog#modal[data-cogo-ui-surface]{
 --cogo-ui-width:680px;--cogo-ui-height:700px;
 box-sizing:border-box!important;width:min(var(--cogo-ui-width),calc(100% - 32px))!important;
 max-width:calc(100% - 32px)!important;min-width:0!important;
 height:min(var(--cogo-ui-height),calc(100dvh - 32px))!important;
 max-height:calc(100dvh - 32px)!important;min-height:0!important;
 padding:0!important;overflow:hidden!important;
}
html body dialog#modal[data-cogo-ui-surface][open]{display:flex!important;flex-direction:column!important}
html body dialog#modal[data-cogo-ui-surface]>.dialog-head{flex:0 0 auto!important;min-width:0;box-sizing:border-box}
html body dialog#modal[data-cogo-ui-surface]>#modalContent{
 flex:1 1 auto!important;min-width:0!important;min-height:0!important;
 max-height:none!important;overflow:auto!important;overscroll-behavior:contain;
 scrollbar-gutter:stable;box-sizing:border-box;overflow-wrap:anywhere;
}
html body dialog#modal[data-cogo-ui-surface="profile"]{--cogo-ui-width:800px;--cogo-ui-height:760px}
html body dialog#modal[data-cogo-ui-surface="account"]{--cogo-ui-width:720px;--cogo-ui-height:680px}
html body dialog#modal[data-cogo-ui-surface="grade"]{--cogo-ui-height:760px}
html body dialog#modal[data-cogo-ui-surface="grade-list"]{--cogo-ui-height:700px}
html body dialog#modal[data-cogo-ui-surface="groups"]{--cogo-ui-width:980px;--cogo-ui-height:760px}
html body dialog#modal[data-cogo-ui-surface="groups"]:has(.cgr-active3){--cogo-ui-width:1100px}
html body dialog#modal[data-cogo-ui-surface="contest"]{--cogo-ui-width:1020px;--cogo-ui-height:760px}
html body dialog#modal[data-cogo-ui-surface="attention"],html body dialog#modal[data-cogo-ui-surface="source"]{--cogo-ui-width:920px;--cogo-ui-height:740px}
html body dialog#modal[data-cogo-ui-surface="credit"]{--cogo-ui-width:560px;--cogo-ui-height:530px}
html body dialog#modal[data-cogo-ui-surface="connection"]{--cogo-ui-height:480px}
html body dialog#modal[data-cogo-ui-surface] .cogo-loading2881{height:100%;min-height:0!important;max-height:100%;padding:20px;box-sizing:border-box}
html body dialog#modal[data-cogo-ui-surface]>#modalContent:has(>p[role="status"]:only-child){display:flex;align-items:center;justify-content:center}
html body dialog#modal[data-cogo-ui-surface] .gcc1:has(>p[role="status"]:only-child){display:grid;place-items:center;height:100%;min-height:0}
html body dialog#modal[data-cogo-ui-surface] #cogoGroupsPanel:has(>.cogo-loading2881:only-child){height:100%;min-height:0}
@media(max-width:600px){
 html body dialog#modal[data-cogo-ui-surface]{width:calc(100% - 16px)!important;max-width:calc(100% - 16px)!important;height:min(var(--cogo-ui-height),calc(100dvh - 16px))!important;max-height:calc(100dvh - 16px)!important;border-radius:18px}
}

/* Native confirmation controls must not inherit text-input height/padding.
   Custom switch, radio-card, and toolbar controls keep their own design. */
html body :is(dialog,#main) label:is(.checkline7,.gcc1-confirm,.checkout-agree28,.queue-confirm18,.cb-print-check,.cb-print-solution,.cr-review):not([hidden]){
 display:flex!important;flex-direction:row!important;align-items:flex-start!important;
 justify-content:flex-start!important;gap:10px!important;min-width:0;line-height:1.6;cursor:pointer;
}
html body :is(dialog,#main) label:is(.checkline7,.gcc1-confirm,.checkout-agree28,.queue-confirm18,.cb-print-check,.cb-print-solution,.cr-review)>input:is([type="checkbox"],[type="radio"]){
 box-sizing:border-box!important;flex:0 0 18px!important;align-self:flex-start!important;
 width:18px!important;min-width:18px!important;max-width:18px!important;
 height:18px!important;min-height:18px!important;max-height:18px!important;
 padding:0!important;margin:2px 0 0!important;accent-color:var(--blue,#4355d9);cursor:pointer;
}
html body :is(dialog,#main) label:is(.checkline7,.gcc1-confirm,.checkout-agree28,.queue-confirm18,.cb-print-check,.cb-print-solution,.cr-review)>span{
 flex:1;min-width:0;line-height:1.6;overflow-wrap:anywhere;
}
html body #modal .gcc1-form>label.gcc1-confirm{
 align-items:center!important;margin:2px 0 0!important;padding:13px 15px!important;min-height:48px;
 border:1px solid var(--line,#e0e6f2);border-radius:12px;
 background:var(--surface,#fff);font-size:13px!important;font-weight:500!important;color:var(--ink,#263550);
}
html body #modal .gcc1-form>label.gcc1-confirm>input{margin:0!important;align-self:center!important}
html body #modal .gcc1-form>label.gcc1-confirm:has(input:checked){border-color:var(--blue,#4355d9);background:color-mix(in srgb,var(--blue,#4355d9) 5%,var(--surface,#fff))}
html body #modal .gcc1-confirm:focus-within{outline:3px solid color-mix(in srgb,var(--blue,#4355d9) 28%,transparent);outline-offset:2px}
html body #modal .gcc1-form>.gcc1-actions{gap:12px;padding-top:4px}
html body #modal .gcc1-form>.gcc1-actions>.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px}
html body dialog :is(.dialog-content,.ps-dialog-form) :is(input,select,textarea){box-sizing:border-box;min-width:0;max-width:100%}
@media(forced-colors:active){html body #modal .gcc1-confirm{border-color:CanvasText!important}html body #modal .gcc1-confirm:focus-within{outline-color:Highlight}}
