.offline-indicator{position:fixed;top:0;left:0;right:0;z-index:1000;border-radius:0;box-shadow:0 2px 8px #00000026}.offline-indicator .ant-alert-message{font-weight:600}.offline-indicator .ant-alert-description{font-size:14px}.m-xs{margin:var(--spacing-xs)}.m-sm{margin:var(--spacing-sm)}.m-md{margin:var(--spacing-md)}.m-lg{margin:var(--spacing-lg)}.m-xl{margin:var(--spacing-xl)}.mt-xs{margin-top:var(--spacing-xs)}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mt-xl{margin-top:var(--spacing-xl)}.mb-xs{margin-bottom:var(--spacing-xs)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.mb-xl{margin-bottom:var(--spacing-xl)}.p-xs{padding:var(--spacing-xs)}.p-sm{padding:var(--spacing-sm)}.p-md{padding:var(--spacing-md)}.p-lg{padding:var(--spacing-lg)}.p-xl{padding:var(--spacing-xl)}.flex-row{display:flex;flex-direction:row;gap:var(--spacing-md)}.flex-col{display:flex;flex-direction:column;gap:var(--spacing-md)}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg)}@media (max-width: 768px){.grid-2{grid-template-columns:1fr}}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg)}@media (max-width: 992px){.grid-3{grid-template-columns:repeat(2,1fr)}}@media (max-width: 576px){.grid-3{grid-template-columns:1fr}}.standard-card{background:var(--ant-color-bg-container);border-radius:12px;padding:var(--spacing-lg);box-shadow:0 2px 8px #00000014;border:1px solid var(--ant-color-border-secondary)}.standard-card.elevated{box-shadow:0 4px 12px #0000001f}.standard-card.compact{padding:var(--spacing-md)}.code-input,.code-output{font-family:Monaco,Menlo,Ubuntu Mono,Courier New,monospace;font-size:14px;line-height:1.6;background:var(--ant-color-bg-container);color:var(--ant-color-text);border:1px solid var(--ant-color-border);border-radius:8px;padding:var(--spacing-md)}.code-input:focus,.code-output:focus{border-color:var(--ant-color-primary);box-shadow:0 0 0 2px var(--ant-color-primary-bg);outline:none}.code-input.readonly,.code-output.readonly{background:var(--ant-color-bg-layout);color:var(--ant-color-text-secondary)}.button-group{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.button-group.centered{justify-content:center}.button-group.right{justify-content:flex-end}.section-divider{height:1px;background:var(--ant-color-border-secondary);margin:var(--spacing-xl) 0}.info-box{background:var(--ant-color-bg-layout);border-left:4px solid var(--ant-color-primary);padding:var(--spacing-lg);border-radius:8px;margin:var(--spacing-lg) 0}.info-box.warning{border-left-color:var(--ant-color-warning)}.info-box.error{border-left-color:var(--ant-color-error);background:var(--ant-color-error-bg)}.info-box.success{border-left-color:var(--ant-color-success)}.info-box h4{margin:0 0 var(--spacing-sm) 0;color:var(--ant-color-text);font-weight:600}.info-box p{margin:var(--spacing-xs) 0;color:var(--ant-color-text-secondary);line-height:1.6}.info-box ul{margin:var(--spacing-sm) 0;padding-left:var(--spacing-lg);color:var(--ant-color-text-secondary)}.info-box ul li{margin:var(--spacing-xs) 0;line-height:1.6}.example-code{background:var(--ant-color-bg-layout);border:1px solid var(--ant-color-border);border-radius:8px;padding:var(--spacing-md);overflow-x:auto}.example-code code{font-family:Monaco,Menlo,Ubuntu Mono,Courier New,monospace;font-size:13px;color:var(--ant-color-text);line-height:1.6}.mobile-only{display:none}@media (max-width: 768px){.mobile-only{display:block}}.desktop-only{display:block}@media (max-width: 768px){.desktop-only{display:none}}.two-column-layout{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--spacing-lg);align-items:start}@media (max-width: 768px){.two-column-layout{grid-template-columns:1fr}}.two-column-layout .column{display:flex;flex-direction:column;gap:var(--spacing-md)}.two-column-layout .separator{display:flex;align-items:center;justify-content:center;padding:var(--spacing-md) 0}@media (max-width: 768px){.two-column-layout .separator{display:none}}.action-footer{display:flex;gap:var(--spacing-sm);padding-top:var(--spacing-lg);border-top:1px solid var(--ant-color-border-secondary);margin-top:var(--spacing-lg)}@media (max-width: 576px){.action-footer{flex-direction:column}.action-footer .ant-btn{width:100%}}:root{--breakpoint-sm: 576px;--breakpoint-md: 768px;--breakpoint-lg: 992px;--breakpoint-xl: 1200px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--touch-target-size: 44px;--min-tap-target-spacing: 8px}*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;font-size:16px;height:100%}body{padding:0;margin:0;height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-y:none}body.theme-light{--ant-color-bg-layout: #f5f5f5;--ant-color-bg-container: #ffffff;--ant-color-bg-elevated: #ffffff;--ant-color-text: #262626;--ant-color-text-secondary: #595959;--ant-color-text-tertiary: #8c8c8c;--ant-color-text-quaternary: #bfbfbf;--ant-color-border: #d9d9d9;--ant-color-border-secondary: #f0f0f0;--ant-color-primary: #1677ff;--ant-color-primary-bg: #e6f7ff;--ant-color-primary-bg-hover: #bae0ff;--ant-color-primary-hover: #4096ff;--ant-color-primary-border: #91caff;--ant-color-error: #ff4d4f;--ant-color-error-bg: #fff2f0;--ant-color-error-border: #ffccc7;--ant-color-success: #52c41a;--ant-color-success-bg: #f6ffed;--ant-color-success-border: #b7eb8f;--ant-color-warning: #faad14;--ant-color-info: #1677ff;--ant-color-text-disabled: #bfbfbf}body.theme-dark{--ant-color-bg-layout: #000000;--ant-color-bg-container: #1f1f1f;--ant-color-bg-elevated: #262626;--ant-color-text: #ffffff;--ant-color-text-secondary: #a6a6a6;--ant-color-text-tertiary: #737373;--ant-color-text-quaternary: #595959;--ant-color-border: #424242;--ant-color-border-secondary: #303030;--ant-color-primary: #1677ff;--ant-color-primary-bg: #111b26;--ant-color-primary-bg-hover: #112a41;--ant-color-primary-hover: #4096ff;--ant-color-primary-border: #15325b;--ant-color-error: #ff4d4f;--ant-color-error-bg: #2a1215;--ant-color-error-border: #58191c;--ant-color-success: #52c41a;--ant-color-success-bg: #162312;--ant-color-success-border: #274916;--ant-color-warning: #faad14;--ant-color-info: #1677ff;--ant-color-text-disabled: #595959}body:not(.theme-light):not(.theme-dark){--ant-color-bg-layout: #f5f5f5;--ant-color-bg-container: #ffffff;--ant-color-bg-elevated: #ffffff;--ant-color-text: #262626;--ant-color-text-secondary: #595959;--ant-color-text-tertiary: #8c8c8c;--ant-color-text-quaternary: #bfbfbf;--ant-color-border: #d9d9d9;--ant-color-border-secondary: #f0f0f0;--ant-color-primary: #1677ff;--ant-color-primary-bg: #e6f7ff;--ant-color-primary-bg-hover: #bae0ff;--ant-color-primary-hover: #4096ff;--ant-color-primary-border: #91caff;--ant-color-error: #ff4d4f;--ant-color-error-bg: #fff2f0;--ant-color-error-border: #ffccc7;--ant-color-success: #52c41a;--ant-color-success-bg: #f6ffed;--ant-color-success-border: #b7eb8f;--ant-color-warning: #faad14;--ant-color-info: #1677ff;--ant-color-text-disabled: #bfbfbf}#root,#app{height:100%}button,a,[role=button],input[type=submit],input[type=reset],input[type=button]{min-height:var(--touch-target-size);min-width:var(--touch-target-size);padding:var(--spacing-sm) var(--spacing-md);margin:var(--min-tap-target-spacing);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.no-select{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}*{scroll-behavior:smooth}img{max-width:100%;height:auto}.loaderContainer{position:absolute;display:flex;width:100%;height:100%;left:0;right:0;bottom:0;top:0;justify-content:center;align-items:center;z-index:999}.loaderWrapper{display:flex;width:100%;height:100%;justify-content:center;align-items:center}.loader{color:#df2e2e;font-size:6px;width:1em;height:1em;border-radius:50%;text-indent:-9999em;-webkit-animation:load4 1.3s infinite linear;animation:load4 1.3s infinite linear}@media (min-width: 768px){.loader{font-size:8px}}@-webkit-keyframes load4{0%,to{box-shadow:0 -3em 0 .2em,2em -2em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em}12.5%{box-shadow:0 -3em,2em -2em 0 .2em,3em 0,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}25%{box-shadow:0 -3em 0 -.5em,2em -2em,3em 0 0 .2em,2em 2em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}37.5%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0,2em 2em 0 .2em,0 3em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}50%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em,0 3em 0 .2em,-2em 2em,-3em 0 0 -1em,-2em -2em 0 -1em}62.5%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em,-2em 2em 0 .2em,-3em 0,-2em -2em 0 -1em}75%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em,-3em 0 0 .2em,-2em -2em}87.5%{box-shadow:0 -3em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em,-3em 0,-2em -2em 0 .2em}}@keyframes load4{0%,to{box-shadow:0 -3em 0 .2em,2em -2em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em}12.5%{box-shadow:0 -3em,2em -2em 0 .2em,3em 0,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}25%{box-shadow:0 -3em 0 -.5em,2em -2em,3em 0 0 .2em,2em 2em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}37.5%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0,2em 2em 0 .2em,0 3em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}50%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em,0 3em 0 .2em,-2em 2em,-3em 0 0 -1em,-2em -2em 0 -1em}62.5%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em,-2em 2em 0 .2em,-3em 0,-2em -2em 0 -1em}75%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em,-3em 0 0 .2em,-2em -2em}87.5%{box-shadow:0 -3em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em,-3em 0,-2em -2em 0 .2em}}@media (hover: none){button:active,a:active,[role=button]:active{opacity:.7;transform:scale(.98)}}.modal,.fixed-element{position:fixed;max-height:100vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.tool-card{cursor:pointer;transition:all .2s ease}.tool-card:focus-visible{outline:2px solid var(--ant-color-primary);outline-offset:2px}.welcome-section{background:var(--ant-color-bg-layout);border-radius:16px;padding:var(--spacing-xl);margin:var(--spacing-lg) var(--spacing-md);text-align:center}@media (max-width: 576px){.welcome-section{padding:var(--spacing-lg);margin:var(--spacing-md) var(--spacing-sm)}}.welcome-section h1{font-size:36px;font-weight:700;margin-bottom:var(--spacing-md);color:var(--ant-color-text)}@media (max-width: 576px){.welcome-section h1{font-size:28px}}.welcome-section p{font-size:18px;color:var(--ant-color-text-secondary);line-height:1.6;margin-bottom:var(--spacing-xl);max-width:600px;margin-left:auto;margin-right:auto}@media (max-width: 576px){.welcome-section p{font-size:16px;margin-bottom:var(--spacing-lg)}}.stats-container{display:flex;justify-content:center;gap:var(--spacing-xl);margin-top:var(--spacing-lg)}@media (max-width: 576px){.stats-container{gap:var(--spacing-lg);flex-direction:column;align-items:center}}.stats-container .stat-item{text-align:center}.stats-container .stat-item .stat-value{font-size:48px;font-weight:700;color:#1890ff;line-height:1;margin-bottom:var(--spacing-sm)}@media (max-width: 576px){.stats-container .stat-item .stat-value{font-size:36px}}.stats-container .stat-item .stat-label{font-size:18px;color:var(--ant-color-text-secondary)}@media (max-width: 576px){.stats-container .stat-item .stat-label{font-size:16px}}.section-title{font-size:24px;font-weight:600;color:var(--ant-color-text);margin:var(--spacing-xl) var(--spacing-md) var(--spacing-md)}@media (max-width: 576px){.section-title{font-size:20px;margin:var(--spacing-lg) var(--spacing-sm) var(--spacing-sm)}}.theme-page-container{background:var(--ant-color-bg-layout);min-height:100vh}.theme-card-container{background:var(--ant-color-bg-container);border-radius:8px;padding:var(--spacing-lg);box-shadow:0 2px 8px #00000014}.theme-primary-text{color:var(--ant-color-text)}.theme-secondary-text{color:var(--ant-color-text-secondary)}.theme-error-message{background-color:var(--ant-color-error-bg);color:var(--ant-color-error);border:1px solid var(--ant-color-error-border);padding:var(--spacing-sm) var(--spacing-md);border-radius:4px;margin:var(--spacing-md) 0}.loading-skeleton{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;padding:0;width:100%}@media (max-width: 768px){.loading-skeleton{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}}@media (max-width: 576px){.loading-skeleton{grid-template-columns:1fr;gap:16px}}.skeleton-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid rgba(0,0,0,.05);min-height:180px}.skeleton-card .skeleton-title{height:24px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px;margin-bottom:12px;width:70%}.skeleton-card .skeleton-description{margin-bottom:16px}.skeleton-card .skeleton-description .skeleton-line{height:16px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px;margin-bottom:8px}.skeleton-card .skeleton-description .skeleton-line:last-child{margin-bottom:0}.skeleton-card .skeleton-description .skeleton-line.short{width:60%}.skeleton-card .skeleton-footer{display:flex;align-items:center;gap:8px}.skeleton-card .skeleton-footer .skeleton-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-color-scheme: dark){.skeleton-card{background:#1f1f1f;border-color:#424242}.skeleton-card .skeleton-title,.skeleton-card .skeleton-line,.skeleton-card .skeleton-avatar{background:linear-gradient(90deg,#2a2a2a 25%,#3a3a3a,#2a2a2a 75%);background-size:200% 100%}}.loading-spinner{display:flex;justify-content:center;align-items:center;min-height:200px;width:100%}.loading-spinner .ant-spin .ant-spin-text{color:#1890ff;font-size:14px}