.yevhenry-css-critical{background:var(--color-yellow-light);border:1px solid var(--color-grey-light);border-radius:12px;box-shadow:0 2px 10px #0000001a;margin:var(--spacing-xxxl) auto;max-width:var(--content-width);padding:var(--spacing-xxl)}@media(max-width:767px){.yevhenry-css-critical{padding:var(--spacing-md)}}.yevhenry-css-critical__title{color:var(--color-dark);font-family:var(--font-family-sans-serif);font-size:var(--font-size-xxl);font-weight:600;line-height:1.3;margin:0 0 var(--spacing-xxl) 0;text-align:center}.yevhenry-css-critical__form-container{background:var(--color-white);border-radius:8px;box-shadow:0 4px 24px #0000001a;margin-bottom:var(--spacing-xxl);padding:var(--spacing-xxl)}@media(max-width:767px){.yevhenry-css-critical__form-container{padding:var(--spacing-xl)}}.yevhenry-css-critical__form{display:flex;flex-direction:column;gap:var(--spacing-xl)}.yevhenry-css-critical__field{display:flex;flex-direction:column;gap:var(--spacing-xs)}.yevhenry-css-critical__label{color:var(--color-dark);font-size:var(--font-size-sm);font-weight:600}.yevhenry-css-critical__label .required{color:var(--color-error);margin-left:var(--spacing-xxs)}.yevhenry-css-critical__label .optional{color:var(--color-grey-dark);font-weight:400;margin-left:var(--spacing-xxs)}.yevhenry-css-critical__input{background:var(--color-white);border:2px solid var(--color-grey-light);border-radius:6px;color:var(--color-dark);font-family:var(--font-family-sans-serif);font-size:var(--font-size-md);padding:var(--spacing-md);transition:border-color .2s ease,box-shadow .2s ease}.yevhenry-css-critical__input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #fff3e04d;outline:none}.yevhenry-css-critical__input.error{border-color:var(--color-error);box-shadow:0 0 0 3px #dc35451a}.yevhenry-css-critical__input::placeholder{color:var(--color-grey-dark)}.yevhenry-css-critical__input:disabled{background:var(--color-grey-light);border-color:var(--color-grey);color:var(--color-grey-dark);cursor:not-allowed;opacity:.6}.yevhenry-css-critical__actions{display:flex;justify-content:center;margin-top:var(--spacing-lg)}.yevhenry-css-critical__submit-btn{align-items:center;background:var(--color-primary);border:none;border-radius:8px;box-shadow:0 2px 4px #0000001a;color:var(--color-white);cursor:pointer;display:flex;font-family:var(--font-family-sans-serif);font-size:var(--font-size-md);font-weight:600;gap:var(--spacing-sm);justify-content:center;min-width:200px;padding:var(--spacing-md) var(--spacing-xxl);position:relative;transition:all .2s ease}.yevhenry-css-critical__submit-btn:hover{background:var(--color-primary-dark);box-shadow:0 4px 8px #00000026;transform:translateY(-1px)}.yevhenry-css-critical__submit-btn:active{box-shadow:0 2px 4px #0000001a;transform:translateY(0)}.yevhenry-css-critical__submit-btn:disabled{background:var(--color-grey);box-shadow:none;color:var(--color-grey-dark);cursor:not-allowed;opacity:.6;transform:none}.yevhenry-css-critical__submit-btn.loading{cursor:not-allowed;pointer-events:none}.yevhenry-css-critical__submit-spinner{animation:spin 1s linear infinite;border:2px solid #0000;border-radius:50%;border-top-color:currentcolor;display:none;height:16px;width:16px}.yevhenry-css-critical__status--processing{background:var(--color-info-light);border:1px solid var(--color-info);color:var(--color-info-dark)}.yevhenry-css-critical__status--success{background:var(--color-success-light);border:1px solid var(--color-success);color:var(--color-success-dark)}.yevhenry-css-critical__status--error{background:var(--color-error-light);border:1px solid var(--color-error);color:var(--color-error-dark)}.yevhenry-css-critical__copy-btn,.yevhenry-css-critical__download-btn{align-items:center;background:var(--color-secondary);border:none;border-radius:6px;box-shadow:0 1px 3px #0000001a;color:var(--color-white);cursor:pointer;display:flex;font-family:var(--font-family-sans-serif);font-size:var(--font-size-xs);font-weight:500;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);transition:all .2s ease}.yevhenry-css-critical__copy-btn:hover,.yevhenry-css-critical__download-btn:hover{background:var(--color-additional);box-shadow:0 2px 6px #00000026;transform:translateY(-1px)}.yevhenry-css-critical__copy-btn:active,.yevhenry-css-critical__download-btn:active{box-shadow:0 1px 3px #0000001a;transform:translateY(0)}.yevhenry-css-critical__copy-btn:disabled,.yevhenry-css-critical__download-btn:disabled{background:var(--color-grey);box-shadow:none;color:var(--color-grey-dark);cursor:not-allowed;opacity:.6;transform:none}.yevhenry-css-critical__copy-btn svg,.yevhenry-css-critical__download-btn svg{flex-shrink:0;height:16px;width:16px}.yevhenry-css-critical__css-code{font-family:Monaco,Menlo,Ubuntu Mono,monospace}.yevhenry-css-critical__advanced-options{border-top:1px solid var(--color-grey-light);margin-top:var(--spacing-xl);padding-top:var(--spacing-xl)}.yevhenry-css-critical__advanced-toggle{align-items:center;background:none;border:none;color:var(--color-primary);cursor:pointer;display:flex;font-family:var(--font-family-sans-serif);font-size:var(--font-size-md);font-weight:600;gap:var(--spacing-sm);padding:0;transition:color .2s ease}.yevhenry-css-critical__advanced-toggle:hover{color:var(--color-primary-dark)}.yevhenry-css-critical__advanced-toggle svg{flex-shrink:0;transition:transform .2s ease}.yevhenry-css-critical__advanced-toggle.expanded svg{transform:rotate(180deg)}.yevhenry-css-critical__advanced-content{border-top:1px solid var(--color-grey-light);display:none;gap:var(--spacing-xl);margin-top:var(--spacing-xl);padding-top:var(--spacing-xl)}.yevhenry-css-critical__advanced-content.expanded{display:flex;flex-direction:column}.yevhenry-css-critical__viewport-options h4{color:var(--color-dark);font-family:var(--font-family-sans-serif);font-size:var(--font-size-md);font-weight:600;margin:0 0 var(--spacing-lg) 0}.yevhenry-css-critical__viewport-grid{display:grid;gap:var(--spacing-xl);grid-template-columns:1fr}@media(min-width:768px){.yevhenry-css-critical__viewport-grid{grid-template-columns:1fr 1fr}}.yevhenry-css-critical__viewport-group{background:var(--color-white);border:1px solid var(--color-grey-light);border-radius:8px;padding:var(--spacing-lg)}.yevhenry-css-critical__viewport-group h5{color:var(--color-dark);font-family:var(--font-family-sans-serif);font-size:var(--font-size-sm);font-weight:600;margin:0 0 var(--spacing-md) 0}.yevhenry-css-critical__viewport-inputs{align-items:center;display:flex;gap:var(--spacing-sm)}.yevhenry-css-critical__viewport-inputs input{border:2px solid var(--color-grey-light);border-radius:6px;color:var(--color-dark);flex:1;font-family:var(--font-family-sans-serif);font-size:var(--font-size-sm);min-width:0;padding:var(--spacing-sm) var(--spacing-md);transition:border-color .2s ease,box-shadow .2s ease}.yevhenry-css-critical__viewport-inputs input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #fff3e04d;outline:none}.yevhenry-css-critical__viewport-inputs input:disabled{background:var(--color-grey-light);border-color:var(--color-grey);color:var(--color-grey-dark);cursor:not-allowed;opacity:.6}.yevhenry-css-critical__viewport-inputs span{color:var(--color-grey-dark);flex-shrink:0;font-size:var(--font-size-sm);font-weight:500}.yevhenry-css-critical__field-help{color:var(--color-grey-dark);font-size:var(--font-size-xs);line-height:1.4;margin-top:var(--spacing-xxs)}.yevhenry-css-critical__status{border-radius:6px;display:none;font-family:var(--font-family-sans-serif);font-size:var(--font-size-sm);font-weight:500;margin-top:var(--spacing-lg);padding:var(--spacing-md);text-align:center}.yevhenry-css-critical__status--processing{background:#3b82f61a;border:1px solid #3b82f633;color:#1e40af}.yevhenry-css-critical__status--success{background:#22c55e1a;border:1px solid #22c55e33;color:#15803d}.yevhenry-css-critical__status--error{background:#ef44441a;border:1px solid #ef444433;color:#991b1b}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.yevhenry-css-critical__results{background:var(--color-white);border:1px solid var(--color-grey-light);border-radius:8px;box-shadow:0 4px 24px #0000001a;margin-top:var(--spacing-xxl);overflow:hidden}.yevhenry-css-critical__results.processing{border-color:var(--color-primary);box-shadow:0 4px 24px #fff3e04d}.yevhenry-css-critical__tabs{background:var(--color-grey-light);border-bottom:1px solid var(--color-grey);display:flex;margin:0;padding:0}.yevhenry-css-critical__tab{background:none;border:none;color:var(--color-grey-dark);cursor:pointer;flex:1;font-family:var(--font-family-sans-serif);font-size:var(--font-size-sm);font-weight:600;padding:var(--spacing-md) var(--spacing-lg);position:relative;transition:all .2s ease}.yevhenry-css-critical__tab:hover{background:var(--color-grey);color:var(--color-dark)}.yevhenry-css-critical__tab.active{background:var(--color-white);border-bottom:2px solid var(--color-primary);color:var(--color-primary)}.yevhenry-css-critical__tab.active:after{background:var(--color-primary);bottom:-1px;content:"";height:2px;left:0;position:absolute;right:0}@media(max-width:767px){.yevhenry-css-critical__tab{font-size:var(--font-size-xs);padding:var(--spacing-sm) var(--spacing-md)}}.yevhenry-css-critical__result-panels{position:relative}.yevhenry-css-critical__panel{display:none;padding:var(--spacing-xxl)}.yevhenry-css-critical__panel.active{display:block}@media(max-width:767px){.yevhenry-css-critical__panel{padding:var(--spacing-xl)}}.yevhenry-css-critical__panel h3{color:var(--color-dark);font-family:var(--font-family-sans-serif);font-size:var(--font-size-lg);font-weight:600;margin:0 0 var(--spacing-lg) 0}.yevhenry-css-critical__panel-header{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-md);justify-content:space-between;margin-bottom:var(--spacing-lg)}@media(max-width:767px){.yevhenry-css-critical__panel-header{align-items:flex-start;flex-direction:column}}.yevhenry-css-critical__panel-actions{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}@media(max-width:767px){.yevhenry-css-critical__panel-actions{justify-content:flex-start;width:100%}}.yevhenry-css-critical__css-output{background:var(--color-dark);border:1px solid var(--color-grey-dark);border-radius:6px;margin-bottom:var(--spacing-lg);overflow:hidden}.yevhenry-css-critical__css-code{word-wrap:break-word;background:var(--color-dark);color:var(--color-white);font-family:Monaco,Menlo,Ubuntu Mono,Courier New,monospace;font-size:var(--font-size-xs);line-height:1.5;margin:0;max-height:400px;overflow-y:auto;padding:var(--spacing-lg);scrollbar-color:#ffffff4d #ffffff1a;scrollbar-width:thin;white-space:pre-wrap}.yevhenry-css-critical__css-code::-webkit-scrollbar{width:8px}.yevhenry-css-critical__css-code::-webkit-scrollbar-track{background:#ffffff1a;border-radius:4px}.yevhenry-css-critical__css-code::-webkit-scrollbar-thumb{background:#ffffff4d;border:1px solid #ffffff1a;border-radius:4px}.yevhenry-css-critical__css-code::-webkit-scrollbar-thumb:hover{background:#ffffff80}.yevhenry-css-critical__panel-info{align-items:center;border-top:1px solid var(--color-grey-light);color:var(--color-grey-dark);display:flex;font-size:var(--font-size-xs);justify-content:space-between;padding:var(--spacing-sm) 0}.yevhenry-css-critical__css-size{color:var(--color-primary);font-weight:600}@media(max-width:767px){.yevhenry-css-critical{padding:var(--spacing-md)}.yevhenry-css-critical__form-container{padding:var(--spacing-lg)}.yevhenry-css-critical__actions{margin-top:var(--spacing-md)}.yevhenry-css-critical__submit-btn{font-size:var(--font-size-sm);min-width:160px}.yevhenry-css-critical__viewport-grid{grid-template-columns:1fr}.yevhenry-css-critical__viewport-inputs{align-items:stretch;flex-direction:column}.yevhenry-css-critical__viewport-inputs input{margin-bottom:var(--spacing-xs)}.yevhenry-css-critical__viewport-inputs span{margin:var(--spacing-xs) 0;text-align:center}.yevhenry-css-critical__panel-actions{justify-content:center}.yevhenry-css-critical__copy-btn,.yevhenry-css-critical__download-btn{font-size:var(--font-size-xxs);padding:var(--spacing-xs) var(--spacing-sm)}}.yevhenry-css-critical.processing .yevhenry-css-critical__status--processing,.yevhenry-css-critical.processing .yevhenry-css-critical__submit-btn{animation:pulse 2s infinite}.yevhenry-css-critical__field-error{color:var(--color-error);display:none;font-size:var(--font-size-xs);font-weight:500;margin-top:var(--spacing-xxs)}.yevhenry-css-critical__field-error.show{animation:slideIn .3s ease;display:block}.yevhenry-css-critical *{transition:color .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}:root{--color-info:#17a2b8;--color-info-light:#d1ecf1;--color-info-dark:#0c5460;--color-success-light:#d4edda;--color-success-dark:#155724;--color-error-light:#f8d7da;--color-error-dark:#721c24}