*{margin:0;padding:0;box-sizing:border-box}:root{font-family:Noto Sans JP,-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;color:#333}#root{width:100%}:root{--primary-color: #EC6C00;--nav-bg: transparent;--nav-text-color: #2D2D2D;--nav-hover-bg: #F8F8F8;--nav-hover-color: #EC6C00;--card-bg: #FFFFFF;--card-text-color: #2D2D2D;--footer-bg: #F8F8F8;--footer-text-color: #666666;--button-primary-bg: #EC6C00;--button-primary-text: #FFFFFF;--bg-light: #FAFAFA;--border-color: #E0E0E0;--text-primary: #2D2D2D;--text-secondary: #666666}[data-theme=default]{--primary-color: #EC6C00;--nav-bg: transparent;--nav-text-color: #2D2D2D;--nav-hover-bg: #F8F8F8;--nav-hover-color: #EC6C00}.nav-logo{color:var(--nav-text-color)}.nav-logo svg{color:var(--primary-color)}.nav-links>a{color:var(--nav-text-color)}.nav-links>a:hover{background:var(--nav-hover-bg);color:var(--nav-hover-color)}.nav-tools-trigger{color:var(--nav-text-color)}.nav-tools-trigger:hover{background:var(--nav-hover-bg);color:var(--nav-hover-color)}.tool-card{background:var(--card-bg)}.tool-tag{background:#ec6c001a;color:var(--primary-color)}.home-header h1 svg{color:var(--primary-color)}.app-footer{background:var(--footer-bg)}.app-footer .footer-info{color:var(--footer-text-color)}.app-nav{background:transparent;box-shadow:0 2px 10px #0000000d;position:sticky;top:0;z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-container{max-width:1400px;margin:0 auto;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}.nav-logo{font-size:1.5rem;font-weight:700;color:#2d2d2d;text-decoration:none;transition:all .3s;display:flex;align-items:center;gap:.5rem}.nav-logo svg{color:#ec6c00}.nav-logo:hover{opacity:.8}.nav-links{display:flex;gap:1rem;align-items:center}.nav-links>a{color:#2d2d2d;text-decoration:none;font-weight:500;padding:.5rem 1rem;border-radius:8px;transition:all .3s}.nav-links>a:hover{background:#f8f8f8;color:#ec6c00}.nav-tools-trigger{color:#2d2d2d;background:transparent;border:none;font-weight:500;padding:.5rem 1rem;border-radius:8px;transition:all .3s;cursor:pointer;font-size:1rem;display:flex;align-items:center;gap:.25rem}.nav-tools-trigger:hover{background:#f8f8f8;color:#ec6c00}.side-menu-overlay{position:fixed;inset:0;background:#00000080;z-index:1999;animation:fadeIn .3s ease}.side-menu{position:fixed;top:0;right:0;bottom:0;width:320px;background:#fff;box-shadow:-4px 0 20px #00000026;z-index:2000;animation:slideIn .3s ease;display:flex;flex-direction:column}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.side-menu-header{padding:1.5rem;border-bottom:1px solid #E5E5E5;display:flex;justify-content:space-between;align-items:center;background:#ffe900}.side-menu-header h2{font-size:1.5rem;font-weight:700;color:#2d2d2d;margin:0}.side-menu-close{background:transparent;border:none;font-size:2rem;color:#2d2d2d;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .3s;line-height:1}.side-menu-close:hover{background:#0000001a}.side-menu-content{flex:1;overflow-y:auto;padding:1rem}.side-menu-content a{display:block;padding:1rem;color:#2d2d2d;text-decoration:none;font-weight:500;border-radius:8px;margin-bottom:.5rem;transition:all .3s}.side-menu-content a:hover{background:#fff4b3;color:#ec6c00}.side-menu-content a.active{background:transparent;color:#ec6c00}.app-footer{background:#2d2d2d;color:#fff;padding:2rem}.app-footer .footer-content{max-width:1400px;margin:0 auto}.app-footer .footer-info{text-align:center;color:#999;font-size:.9rem}@media(max-width:768px){.nav-container{flex-direction:column;gap:1rem}.nav-links{gap:1rem}.nav-links a{font-size:.9rem;padding:.4rem .8rem}}.loading-fallback{display:flex;align-items:center;justify-content:center;min-height:50vh;font-size:1.1rem;color:#888}.home-page{position:relative;min-height:100vh;background:#f2f2f2;overflow:hidden}.bg-circles{opacity:.25;background-image:radial-gradient(circle at 15% 25%,#FFE900 150px,transparent 150px),radial-gradient(circle at 85% 15%,#EC6C00 120px,transparent 120px),radial-gradient(circle at 75% 75%,#A8D8EA 200px,transparent 200px),radial-gradient(circle at 10% 85%,#FFB3BA 140px,transparent 140px),radial-gradient(circle at 50% 40%,#B4E7CE 100px,transparent 100px),radial-gradient(circle at 90% 50%,#FFF4B3 90px,transparent 90px),radial-gradient(circle at 30% 60%,#C5B3E6 110px,transparent 110px),radial-gradient(circle at 60% 20%,#FFD4A3 60px,transparent 60px),radial-gradient(circle at 20% 50%,#FFE900 50px,transparent 50px),radial-gradient(circle at 70% 90%,#EC6C00 70px,transparent 70px)}.bg-triangles{opacity:.2;background-image:conic-gradient(from 0deg at 40% 30%,#FFE900 0deg,#FFE900 120deg,transparent 120deg),conic-gradient(from 60deg at 80% 40%,#EC6C00 0deg,#EC6C00 120deg,transparent 120deg),conic-gradient(from 180deg at 25% 70%,#A8D8EA 0deg,#A8D8EA 120deg,transparent 120deg),conic-gradient(from 90deg at 65% 80%,#FFB3BA 0deg,#FFB3BA 120deg,transparent 120deg),conic-gradient(from 270deg at 90% 80%,#B4E7CE 0deg,#B4E7CE 120deg,transparent 120deg),conic-gradient(from 45deg at 55% 50%,#C5B3E6 0deg,#C5B3E6 120deg,transparent 120deg);background-size:240px 240px,200px 200px,280px 280px,220px 220px,180px 180px,160px 160px;background-repeat:no-repeat}.home-content{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:2rem}.home-header{text-align:center;padding:1rem 2rem 3rem}.home-header h1{font-size:3rem;margin-bottom:1rem;font-weight:700;color:#2d2d2d;display:flex;align-items:center;justify-content:center;gap:1rem;line-height:1.2}.home-header h1 svg{font-size:3rem;color:#ec6c00}.home-subtitle{font-size:1.5rem;margin-bottom:1rem;color:#666;font-weight:600}.home-description{font-size:1rem;color:#666;line-height:1.6;max-width:600px;margin:0 auto}.tools-section{margin-bottom:4rem}.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:3rem}.tool-card{background:#fff;border-radius:20px;padding:0;text-decoration:none;color:inherit;box-shadow:0 2px 8px #00000014;transition:all .3s ease;display:flex;flex-direction:column;overflow:hidden}.tool-card:hover{transform:translateY(-8px);box-shadow:0 8px 24px #0000001f}.tool-card-image{width:100%;padding:2rem 2rem 0;display:flex;align-items:center;justify-content:center;transition:all .3s}.tool-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:3.5rem;color:#fff;transition:all .3s}.tool-card:nth-child(10n+1) .tool-icon{background:linear-gradient(135deg,#ec6c00,#ff8c00)}.tool-card:nth-child(10n+2) .tool-icon{background:linear-gradient(135deg,#ffe900,#ffc107)}.tool-card:nth-child(10n+3) .tool-icon{background:linear-gradient(135deg,#004097,#06c)}.tool-card:nth-child(10n+4) .tool-icon{background:linear-gradient(135deg,#e91e63,#c2185b)}.tool-card:nth-child(10n+5) .tool-icon{background:linear-gradient(135deg,#9c27b0,#7b1fa2)}.tool-card:nth-child(10n+6) .tool-icon{background:linear-gradient(135deg,#4caf50,#388e3c)}.tool-card:nth-child(10n+7) .tool-icon{background:linear-gradient(135deg,#00bcd4,#0097a7)}.tool-card:nth-child(10n+8) .tool-icon{background:linear-gradient(135deg,#ff5722,#e64a19)}.tool-card:nth-child(10n+9) .tool-icon{background:linear-gradient(135deg,#607d8b,#455a64)}.tool-card:nth-child(10n+10) .tool-icon{background:linear-gradient(135deg,#795548,#5d4037)}.tool-card:hover .tool-icon{transform:scale(1.1) rotate(5deg)}.tool-card-info{padding:1.5rem;background:#fff;display:flex;flex-direction:column;gap:.5rem}.tool-card-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}.tool-tag{display:inline-block;padding:.3rem .8rem;border:1px solid #2D2D2D;border-radius:20px;font-size:.85rem;color:#2d2d2d;font-weight:400}.tool-card h3{font-size:1.35rem;margin-bottom:.5rem;color:#2d2d2d;font-weight:600;line-height:1.4}.tool-card p{color:#666;line-height:1.6;margin-bottom:.5rem;font-size:.95rem}.tool-company{color:#999;font-size:.85rem}@media(max-width:1024px){.tools-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.home-header h1{font-size:2.5rem}.home-subtitle{font-size:1.2rem}.tools-grid,.footer-cta{grid-template-columns:1fr}}.bg-circles,.bg-triangles{position:absolute;inset:-10%;z-index:0;pointer-events:none;will-change:transform;transition:transform .1s ease-out}.bg-circles{opacity:.3;background-image:radial-gradient(circle at 15% 25%,#FFE900 150px,transparent 150px),radial-gradient(circle at 85% 15%,#EC6C00 120px,transparent 120px),radial-gradient(circle at 75% 75%,#00B8E6 200px,transparent 200px),radial-gradient(circle at 10% 85%,#FF6B9D 140px,transparent 140px),radial-gradient(circle at 50% 40%,#00D084 100px,transparent 100px),radial-gradient(circle at 90% 50%,#FFD700 90px,transparent 90px),radial-gradient(circle at 30% 60%,#9B59B6 110px,transparent 110px),radial-gradient(circle at 60% 20%,#FF9500 60px,transparent 60px),radial-gradient(circle at 20% 50%,#FFE900 50px,transparent 50px),radial-gradient(circle at 70% 90%,#EC6C00 70px,transparent 70px)}.bg-triangles{opacity:.25;background-image:conic-gradient(from 0deg at 40% 30%,#FFE900 0deg,#FFE900 120deg,transparent 120deg),conic-gradient(from 60deg at 80% 40%,#EC6C00 0deg,#EC6C00 120deg,transparent 120deg),conic-gradient(from 180deg at 25% 70%,#00B8E6 0deg,#00B8E6 120deg,transparent 120deg),conic-gradient(from 90deg at 65% 80%,#FF6B9D 0deg,#FF6B9D 120deg,transparent 120deg),conic-gradient(from 270deg at 90% 80%,#00D084 0deg,#00D084 120deg,transparent 120deg),conic-gradient(from 45deg at 55% 50%,#9B59B6 0deg,#9B59B6 120deg,transparent 120deg);background-size:240px 240px,200px 200px,280px 280px,220px 220px,180px 180px,160px 160px;background-repeat:no-repeat}:root{--tool-primary: #1e75d3;--tool-primary-hover: #1a66bd;--tool-primary-light: #e3f2fd;--tool-secondary: #764ba2;--tool-secondary-hover: #5d3a7f;--tool-success: #50C878;--tool-warning: #F39C12;--tool-error: #E74C3C;--tool-info: #4DD0E1;--tool-info-hover: #26C6DA;--tool-text-dark: #2D2D2D;--tool-text-medium: #666666;--tool-text-light: #999999;--tool-border: #E0E0E0;--tool-bg-light: #F8F8F8;--tool-bg-white: #FFFFFF;--tool-spacing-xs: .5rem;--tool-spacing-sm: 1rem;--tool-spacing-md: 1.5rem;--tool-spacing-lg: 2rem;--tool-spacing-xl: 3rem;--tool-radius-sm: 8px;--tool-radius-md: 12px;--tool-radius-lg: 16px;--tool-shadow-light: 0 2px 8px rgba(0, 0, 0, .08);--tool-shadow-medium: 0 4px 16px rgba(0, 0, 0, .12);--tool-shadow-strong: 0 6px 20px rgba(102, 126, 234, .3)}.tool-input,.tool-textarea,.tool-select{width:100%;padding:8px;border:1px solid var(--tool-border);border-radius:5px;font-size:14px;font-family:Noto Sans JP,-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;background:var(--tool-bg-white);color:var(--tool-text-dark);transition:all .3s}.tool-textarea{padding:10px;resize:vertical;min-height:100px}.tool-input:focus,.tool-textarea:focus,.tool-select:focus{border-color:var(--tool-primary);outline:none;box-shadow:0 0 0 3px #667eea1a}.tool-input:hover,.tool-textarea:hover,.tool-select:hover{border-color:var(--tool-primary)}.tool-range{padding:0;background:var(--tool-border);height:6px;border-radius:3px;outline:none;-webkit-appearance:none;width:100%}.tool-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--tool-primary);cursor:pointer;transition:all .3s}.tool-range::-webkit-slider-thumb:hover{background:var(--tool-primary-hover);transform:scale(1.2)}.tool-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--tool-primary);cursor:pointer;border:none}.tool-range::-moz-range-thumb:hover{background:var(--tool-primary-hover)}.tool-btn{padding:10px 20px;border:none;border-radius:5px;font-size:14px;cursor:pointer;transition:all .3s;font-weight:600}.tool-btn-primary{background-color:var(--tool-primary);color:#fff}.tool-btn-primary:hover{background-color:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:var(--tool-shadow-strong)}.tool-btn-primary:disabled{background:#a5b3f0;opacity:.6;cursor:not-allowed}.tool-btn-secondary{background:#f5f5f5;color:var(--tool-text-medium);border:1px solid var(--tool-border);font-weight:500}.tool-btn-secondary:hover{background:var(--tool-border);color:var(--tool-text-dark);transform:translateY(-2px)}.tool-btn-info{background-color:var(--tool-info);color:#fff}.tool-btn-info:hover{background-color:var(--tool-info-hover);transform:translateY(-2px);box-shadow:0 4px 12px #4dd0e14d}.tool-btn-full{width:100%;padding:12px 20px}.tool-form-group{margin-bottom:20px}.tool-label{display:block;margin-bottom:5px;color:var(--tool-text-medium);font-weight:500;font-size:13px}.tool-range-value{font-size:12px;color:var(--tool-text-light);margin-top:5px;text-align:center}.tool-option{border:2px solid var(--tool-border);border-radius:8px;padding:10px;cursor:pointer;transition:all .3s;background:var(--tool-bg-white)}.tool-option:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.tool-option.active{border-color:var(--tool-primary);background-color:var(--tool-primary-light)}.tool-header-content{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem}.tool-guide-link{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--tool-primary);color:#fff;text-decoration:none;border-radius:var(--tool-radius-sm);font-weight:600;font-size:1rem;transition:all .3s;white-space:nowrap;flex-shrink:0}.tool-guide-link:hover{background:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:var(--tool-shadow-strong)}.tool-guide-link svg{font-size:1.25rem}.tool-page{position:relative;min-height:100vh;background:var(--tool-bg-light);padding:2rem;overflow:hidden}.tool-title{font-size:2rem;color:var(--tool-text-dark);margin:0;font-weight:700;text-align:left}.tool-title svg{font-size:2rem;color:var(--tool-primary)}.tool-error{color:var(--tool-error);font-size:14px;margin-top:5px}@media(max-width:768px){.tool-container{padding:15px}}.flat-icon-tool{position:relative;min-height:100vh;background:var(--tool-bg-light);padding:2rem;overflow:hidden}.tool-container{position:relative;z-index:1;max-width:1200px;margin:0 auto;background:#fff;border-radius:var(--tool-radius-lg);padding:3rem;box-shadow:0 10px 40px #0000001a}.tool-header{text-align:center;color:var(--tool-text-dark);margin-bottom:2rem}.tool-header h1{font-size:2rem;margin-bottom:.75rem;font-weight:700;display:flex;gap:.5rem}.tool-header h1 svg{font-size:2rem;color:#ec6c00}.tool-header p{font-size:1rem;color:var(--tool-text-medium);line-height:1.6}.flat-icon-tool__container{display:grid;grid-template-columns:400px 1fr;gap:2rem;align-items:start}.flat-icon-tool__controls-panel{background:var(--tool-bg-white);border-radius:var(--tool-radius-lg);padding:1.2rem}.flat-icon-tool__control-section{margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px solid var(--tool-border)}.flat-icon-tool__control-section:last-child{border-bottom:none}.flat-icon-tool__control-section h2{font-size:.95rem;margin-bottom:.75rem;color:var(--tool-text-dark);display:flex;align-items:center;gap:.4rem;font-weight:600}.flat-icon-tool__control-section h2 svg{font-size:1.1rem;color:var(--tool-primary)}.flat-icon-tool__file-input{width:100%;padding:.6rem;border:2px dashed var(--tool-border);border-radius:var(--tool-radius-sm);cursor:pointer;transition:all .3s;margin-bottom:.5rem;font-size:.85rem;background:var(--tool-bg-white);color:var(--tool-text-dark)}.flat-icon-tool__file-input:hover{border-color:var(--tool-primary)}.flat-icon-tool__file-input:focus{border-color:var(--tool-primary);outline:none;box-shadow:0 0 0 3px #667eea1a}.flat-icon-tool__shape-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem}.flat-icon-tool__shape-button{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.7rem;border:2px solid var(--tool-border);border-radius:var(--tool-radius-sm);background:var(--tool-bg-white);cursor:pointer;transition:all .3s;font-size:.8rem}.flat-icon-tool__shape-button:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.flat-icon-tool__shape-button--active{border-color:var(--tool-primary);background:var(--tool-primary-light)}.flat-icon-tool__shape-button:disabled{opacity:.5;cursor:not-allowed}.flat-icon-tool__shape-button:disabled:hover{border-color:var(--tool-border);transform:none}.flat-icon-tool__shape-preview{width:32px;height:32px;background:var(--tool-primary)}.flat-icon-tool__shape-preview--square{border-radius:0}.flat-icon-tool__shape-preview--rounded{border-radius:6px}.flat-icon-tool__shape-preview--circle{border-radius:50%}.flat-icon-tool__shape-preview--image-ratio{width:40px;height:28px;border-radius:5px}.flat-icon-tool__color-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:.75rem}.flat-icon-tool__color-preset{width:80%;aspect-ratio:1;border:2px solid transparent;border-radius:6px;cursor:pointer;transition:all .3s;font-size:1rem;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.3)}.flat-icon-tool__color-preset:hover{transform:scale(1.05);box-shadow:0 4px 12px #0003}.flat-icon-tool__color-preset--active{border-color:var(--tool-primary);transform:scale(1.1);box-shadow:0 0 0 2px #667eea33}.flat-icon-tool__color-info{font-size:.8rem;color:var(--tool-text-medium);line-height:1.5}.flat-icon-tool__color-info strong{color:var(--tool-text-dark)}.flat-icon-tool__slider-control{margin-bottom:.8rem}.flat-icon-tool__slider-control label{display:block;font-size:.8rem;color:var(--tool-text-medium);margin-bottom:.4rem}.flat-icon-tool__slider-control input[type=range]{width:100%;height:6px;border-radius:3px;background:var(--tool-border);outline:none;-webkit-appearance:none;margin-top:.5rem}.flat-icon-tool__slider-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--tool-primary);cursor:pointer;transition:all .3s}.flat-icon-tool__slider-control input[type=range]::-webkit-slider-thumb:hover{background:var(--tool-primary-hover);transform:scale(1.2)}.flat-icon-tool__slider-control input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--tool-primary);cursor:pointer;border:none}.flat-icon-tool__slider-control input[type=range]::-moz-range-thumb:hover{background:var(--tool-primary-hover)}.flat-icon-tool__toggle-control{padding:1rem;background:#f9f9f9;border-radius:var(--tool-radius-sm);border:1px solid var(--tool-border)}.flat-icon-tool__toggle-control label{display:flex;align-items:center;gap:.75rem;font-size:1rem;color:var(--tool-text-dark);cursor:pointer;margin:0}.flat-icon-tool__toggle-control input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--tool-primary)}.flat-icon-tool__actions{display:flex;gap:.4rem}.flat-icon-tool__btn{flex:1;padding:.6rem 1rem;border:none;border-radius:var(--tool-radius-sm);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:.3rem}.flat-icon-tool__btn--primary{background:var(--tool-primary);color:#fff}.flat-icon-tool__btn--primary:hover:not(:disabled){background:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:var(--tool-shadow-strong)}.flat-icon-tool__btn--primary:disabled{background:#a5b3f0;opacity:.6;cursor:not-allowed}.flat-icon-tool__btn--secondary{background:#f5f5f5;color:var(--tool-text-medium);border:1px solid var(--tool-border)}.flat-icon-tool__btn--secondary:hover{background:var(--tool-border);color:var(--tool-text-dark);transform:translateY(-2px)}.flat-icon-tool__preview-panel{background:var(--tool-bg-white);border-radius:var(--tool-radius-lg);padding:1.5rem;display:flex;flex-direction:column;align-items:center}.flat-icon-tool__preview-panel h2{font-size:1.2rem;margin-bottom:1rem;color:var(--tool-text-dark)}.flat-icon-tool__canvas-container{background:linear-gradient(45deg,#f0f0f0 25%,transparent 25%),linear-gradient(-45deg,#f0f0f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f0f0f0 75%),linear-gradient(-45deg,transparent 75%,#f0f0f0 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;padding:1.5rem;border-radius:var(--tool-radius-md);display:inline-flex}.flat-icon-tool__preview-canvas{display:block;max-width:400px;height:auto;border-radius:var(--tool-radius-sm)}.flat-icon-tool__preview-info{margin-top:.75rem;color:var(--tool-text-medium);font-size:.85rem}@media(max-width:1024px){.flat-icon-tool__container{grid-template-columns:1fr}.flat-icon-tool__controls-panel{position:static;max-height:none}}@media(max-width:640px){.flat-icon-tool{padding:1rem}.tool-header h1{font-size:1.8rem}.flat-icon-tool__color-presets{grid-template-columns:repeat(4,1fr)}.flat-icon-tool__shape-buttons{grid-template-columns:repeat(3,1fr)}.flat-icon-tool__actions{flex-direction:column}.flat-icon-tool__canvas-container{padding:1rem}}.qr-code-tool{position:relative;min-height:100vh;background:#f8f8f8;padding:2rem;overflow:hidden}.qr-code-tool .input-section{margin-bottom:30px}.qr-code-tool .form-group{margin-bottom:20px}.qr-code-tool label{display:block;margin-bottom:5px;color:#555;font-weight:500}.qr-code-tool textarea{width:100%;padding:10px;border:1px solid #E0E0E0;border-radius:5px;font-size:14px;resize:vertical;min-height:100px;font-family:Noto Sans JP,-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;background:#fff;color:#333;transition:all .3s}.qr-code-tool textarea:focus{border-color:var(--tool-primary);outline:none;box-shadow:0 0 0 3px #667eea1a}.qr-code-tool textarea:hover{border-color:var(--tool-primary)}.qr-code-tool input[type=number],.qr-code-tool input[type=range],.qr-code-tool select{width:100%;padding:8px;border:1px solid #E0E0E0;border-radius:5px;font-size:14px;font-family:Noto Sans JP,-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;background:#fff;color:#333;transition:all .3s}.qr-code-tool input[type=number]:focus,.qr-code-tool select:focus{border-color:var(--tool-primary);outline:none;box-shadow:0 0 0 3px #667eea1a}.qr-code-tool input[type=number]:hover,.qr-code-tool select:hover{border-color:var(--tool-primary)}.qr-code-tool input[type=range]{padding:0;background:#e0e0e0;height:6px;border-radius:3px;outline:none;-webkit-appearance:none;appearance:none}.qr-code-tool input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--tool-primary);cursor:pointer;transition:all .3s}.qr-code-tool input[type=range]::-webkit-slider-thumb:hover{background:var(--tool-primary-hover);transform:scale(1.2)}.qr-code-tool input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--tool-primary);cursor:pointer;border:none}.qr-code-tool input[type=range]::-moz-range-thumb:hover{background:var(--tool-primary-hover)}.qr-code-tool__logo-selector{display:flex;gap:20px;margin-bottom:20px;justify-content:flex-start;flex-wrap:wrap}.qr-code-tool__logo-option{min-width:120px;border:2px solid #E0E0E0;border-radius:8px;padding:10px;cursor:pointer;transition:all .3s;text-align:center;background:#fff}.qr-code-tool__logo-option:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.qr-code-tool__logo-option.selected{border-color:var(--tool-primary);background-color:var(--tool-primary-light)}.qr-code-tool__logo-preview{width:80px;height:80px;margin:auto auto 5px;display:flex;align-items:center;justify-content:center}.qr-code-tool__logo-preview--no-logo{background-color:#f5f5f5;border-radius:4px}.qr-code-tool__logo-label{font-size:12px;color:#666}.qr-code-tool .controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:20px}.qr-code-tool .range-value{font-size:12px;color:#999;margin-top:5px}.qr-code-tool__generate-btn{background-color:var(--tool-primary);color:#fff;width:100%;padding:12px 20px;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:all .3s}.qr-code-tool__generate-btn:hover{background-color:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:var(--tool-shadow-strong)}.qr-code-tool__qr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:30px}.qr-code-tool__qr-item{display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #ddd;border-radius:8px;padding:15px;background-color:#fafafa}.qr-code-tool__url-text{font-size:12px;color:#666;margin-bottom:10px;word-break:break-all;min-height:30px}.qr-code-tool__qr-wrapper{display:flex;justify-content:center;align-items:center;margin:20px 0;position:relative;max-width:100%;overflow:hidden}.qr-code-tool__qr-wrapper canvas,.qr-code-tool__qr-wrapper svg{max-width:100%;height:auto}.qr-code-tool__download-buttons{display:flex;gap:10px;justify-content:center;margin-top:15px}.qr-code-tool__download-btn{padding:8px 16px;font-size:14px;background-color:var(--tool-info);color:#fff;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:all .3s}.qr-code-tool__download-btn:hover{background-color:var(--tool-info-hover);transform:translateY(-2px);box-shadow:0 4px 12px #4dd0e14d}.qr-code-tool__error{color:var(--tool-error);font-size:14px;margin-top:5px}.qr-code-tool__download-all-btn{margin-top:20px;background-color:#ec6c00;color:#fff;width:100%;padding:12px 20px;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:all .3s}.qr-code-tool__download-all-btn:hover{background-color:#ff8c00;transform:translateY(-2px);box-shadow:0 4px 12px #ec6c004d}.qr-code-tool__progress-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1000;display:flex;justify-content:center;align-items:center}.qr-code-tool__progress-content{background-color:#fff;padding:30px;border-radius:10px;text-align:center}.qr-code-tool__progress-bar{width:300px;height:20px;background-color:#f0f0f0;border-radius:10px;overflow:hidden;margin-top:10px}.qr-code-tool__progress-fill{height:100%;background-color:#ec6c00;transition:width .3s;width:0%}@media(max-width:768px){.qr-code-tool__qr-grid,.qr-code-tool .controls{grid-template-columns:1fr}}.qr-code-tool-advanced{position:relative;min-height:100vh;background:#f8f8f8;padding:2rem;overflow:hidden}.qr-code-tool-advanced__subtitle{text-align:center;color:#666;margin-bottom:2rem;font-size:1rem;line-height:1.6}.qr-code-tool-advanced .input-section{margin-bottom:30px}.qr-code-tool-advanced .form-group{margin-bottom:12px}.qr-code-tool-advanced label{display:block;margin-bottom:3px;color:#555;font-weight:500;font-size:13px}.qr-code-tool-advanced textarea,.qr-code-tool-advanced input[type=number],.qr-code-tool-advanced input[type=range],.qr-code-tool-advanced input[type=color],.qr-code-tool-advanced select{width:100%;padding:8px;border:1px solid #E0E0E0;border-radius:5px;font-size:14px;font-family:Noto Sans JP,-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;background:#fff;color:#333;transition:all .3s}.qr-code-tool-advanced textarea{padding:10px;resize:vertical;min-height:100px}.qr-code-tool-advanced textarea:focus,.qr-code-tool-advanced input[type=number]:focus,.qr-code-tool-advanced input[type=color]:focus,.qr-code-tool-advanced select:focus{border-color:var(--tool-primary);outline:none;box-shadow:0 0 0 3px #667eea1a}.qr-code-tool-advanced textarea:hover,.qr-code-tool-advanced input[type=number]:hover,.qr-code-tool-advanced input[type=color]:hover,.qr-code-tool-advanced select:hover{border-color:var(--tool-primary)}.qr-code-tool-advanced input[type=color]{height:40px;cursor:pointer}.qr-code-tool-advanced input[type=range]{padding:0;background:#e0e0e0;height:6px;border-radius:3px;outline:none;-webkit-appearance:none;appearance:none}.qr-code-tool-advanced input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--tool-primary);cursor:pointer;transition:all .3s}.qr-code-tool-advanced input[type=range]::-webkit-slider-thumb:hover{background:var(--tool-primary-hover);transform:scale(1.2)}.qr-code-tool-advanced input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--tool-primary);cursor:pointer;border:none}.qr-code-tool-advanced input[type=range]::-moz-range-thumb:hover{background:var(--tool-primary-hover)}.qr-code-tool-advanced__logo-selector{display:flex;gap:20px;margin-bottom:20px;justify-content:flex-start;flex-wrap:wrap}.qr-code-tool-advanced__logo-option{min-width:120px;border:2px solid #E0E0E0;border-radius:8px;padding:10px;cursor:pointer;transition:all .3s;text-align:center;background:#fff}.qr-code-tool-advanced__logo-option:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.qr-code-tool-advanced__logo-option.selected{border-color:var(--tool-primary);background-color:var(--tool-primary-light)}.qr-code-tool-advanced__logo-preview{width:80px;height:80px;margin:auto auto 5px;display:flex;align-items:center;justify-content:center}.qr-code-tool-advanced__logo-preview--no-logo{background-color:#f5f5f5;border-radius:4px}.qr-code-tool-advanced__logo-label{font-size:12px;color:#666}.qr-code-tool-advanced .controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:20px}.qr-code-tool-advanced .range-value{font-size:12px;color:#999;margin-top:5px;text-align:center}.qr-code-tool-advanced__section-title{font-size:16px;font-weight:600;color:#333;margin:20px 0 10px;padding-bottom:5px;border-bottom:2px solid var(--tool-primary)}.qr-code-tool-advanced__batch-btn{padding:6px 12px;font-size:12px;background-color:var(--tool-info);color:#fff;margin-right:5px;margin-top:5px;border:none;border-radius:4px;cursor:pointer;transition:all .3s;font-weight:600}.qr-code-tool-advanced__batch-btn:hover{background-color:var(--tool-info-hover);transform:translateY(-1px)}.qr-code-tool-advanced__design-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:20px}.qr-code-tool-advanced__design-column{border:1px solid #e0e0e0;border-radius:8px;padding:15px;background-color:#fafafa;min-width:0;flex:1}.qr-code-tool-advanced__design-column-title{font-size:14px;font-weight:600;color:#333;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--tool-primary)}.qr-code-tool-advanced__design-subsection{margin-bottom:12px;padding-bottom:12px}.qr-code-tool-advanced__design-subsection:not(:last-child){border-bottom:1px solid #eee}.qr-code-tool-advanced__form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.qr-code-tool-advanced__gradient-controls{display:block;background-color:#f5f5f5;border-left:3px solid var(--tool-primary);padding:10px;border-radius:4px;margin-top:8px}.qr-code-tool-advanced__gradient-controls .form-group{margin-bottom:10px}.qr-code-tool-advanced__generate-btn{background-color:var(--tool-primary);color:#fff;width:100%;padding:12px 20px;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:all .3s}.qr-code-tool-advanced__generate-btn:hover{background-color:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:var(--tool-shadow-strong)}.qr-code-tool-advanced__qr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:30px}.qr-code-tool-advanced__qr-item{display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #ddd;border-radius:8px;padding:15px;background-color:#fafafa}.qr-code-tool-advanced__url-text{font-size:12px;color:#666;margin-bottom:10px;word-break:break-all;min-height:30px}.qr-code-tool-advanced__qr-wrapper{display:flex;justify-content:center;align-items:center;margin:20px 0;position:relative;max-width:100%;overflow:hidden}.qr-code-tool-advanced__qr-wrapper canvas,.qr-code-tool-advanced__qr-wrapper svg{max-width:100%;height:auto}.qr-code-tool-advanced__download-buttons{display:flex;gap:10px;justify-content:center;margin-top:15px}.qr-code-tool-advanced__download-btn{padding:8px 16px;font-size:14px;background-color:var(--tool-info);color:#fff;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:all .3s}.qr-code-tool-advanced__download-btn:hover{background-color:var(--tool-info-hover);transform:translateY(-2px);box-shadow:0 4px 12px #4dd0e14d}.qr-code-tool-advanced__error{color:var(--tool-error);font-size:14px;margin-top:5px}.qr-code-tool-advanced__download-all-btn{margin-top:20px;background-color:#ec6c00;color:#fff;width:100%;padding:12px 20px;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:all .3s}.qr-code-tool-advanced__download-all-btn:hover{background-color:#ff8c00;transform:translateY(-2px);box-shadow:0 4px 12px #ec6c004d}.qr-code-tool-advanced__progress-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1000;display:flex;justify-content:center;align-items:center}.qr-code-tool-advanced__progress-content{background-color:#fff;padding:30px;border-radius:10px;text-align:center}.qr-code-tool-advanced__progress-bar{width:300px;height:20px;background-color:#f0f0f0;border-radius:10px;overflow:hidden;margin-top:10px}.qr-code-tool-advanced__progress-fill{height:100%;background-color:#ec6c00;transition:width .3s;width:0%}@media(max-width:1200px){.qr-code-tool-advanced__design-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.qr-code-tool-advanced__qr-grid,.qr-code-tool-advanced .controls,.qr-code-tool-advanced__design-grid,.qr-code-tool-advanced__form-row{grid-template-columns:1fr}}.image-aspect-ratio-tool{position:relative;min-height:100vh;padding:2rem;overflow:hidden}.image-aspect-ratio-tool__header{margin-bottom:2rem}.image-aspect-ratio-tool__subtitle{font-size:1.1rem;color:var(--tool-text-medium);margin-top:.5rem;line-height:1.6}.image-aspect-ratio-tool__info-section{background:linear-gradient(135deg,#e3f2fd,#f0f4ff);border:1px solid #2196f3;border-radius:12px;padding:20px 25px;margin-bottom:2rem}.image-aspect-ratio-tool__info-toggle{width:100%;background:none;border:none;padding:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .3s}.image-aspect-ratio-tool__info-toggle:hover{opacity:.8}.image-aspect-ratio-tool__info-toggle h3{color:#1976d2;margin:0;font-size:1.1rem;font-weight:600;display:flex;align-items:center;gap:10px}.image-aspect-ratio-tool__info-icon{color:#1976d2;font-size:.9rem;transition:transform .3s}.image-aspect-ratio-tool__info-icon.open{transform:rotate(180deg)}.image-aspect-ratio-tool__info-content{margin-top:20px;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.image-aspect-ratio-tool__info-block{background:#fff;padding:20px;border-radius:8px;box-shadow:var(--tool-shadow-light);margin-bottom:15px}.image-aspect-ratio-tool__info-block:last-child{margin-bottom:0}.image-aspect-ratio-tool__info-block h4{color:#1976d2;margin-bottom:15px;font-size:1.1rem;display:flex;align-items:center;gap:8px}.image-aspect-ratio-tool__info-block p{color:var(--tool-text-dark);line-height:1.6;margin-bottom:12px}.image-aspect-ratio-tool__feature-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 16px}.image-aspect-ratio-tool__feature-list li{padding:6px 0;color:var(--tool-text-medium);display:flex;align-items:center;gap:8px;flex:0 0 auto}.image-aspect-ratio-tool__feature-list li:before{content:"✓";color:var(--tool-success);font-weight:700;font-size:1.1rem;flex-shrink:0}.image-aspect-ratio-tool__control-panel{background:var(--tool-bg-light);border-radius:10px;margin-bottom:20px;padding:20px;overflow:hidden}.image-aspect-ratio-tool__controls{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 30px}.image-aspect-ratio-tool__control-column{display:flex;flex-direction:column;gap:20px}.image-aspect-ratio-tool__settings-bar{display:grid;grid-template-columns:1fr 1.5fr 1fr .8fr;gap:16px;align-items:end}.image-aspect-ratio-tool__settings-item{display:flex;flex-direction:column;gap:6px}.image-aspect-ratio-tool__settings-item .tool-label{font-size:.8rem;margin-bottom:0}.image-aspect-ratio-tool__bg-color-row{display:flex;flex-direction:column;gap:8px}.image-aspect-ratio-tool__color-picker-inline{display:flex;align-items:center;gap:8px}.image-aspect-ratio-tool__color-picker-inline input[type=color]{width:32px;height:32px;border:none;border-radius:4px;cursor:pointer;padding:0}.image-aspect-ratio-tool__color-text{width:90px!important;font-family:monospace;font-size:13px!important;padding:4px 8px!important}.image-aspect-ratio-tool__fit-toggle{display:flex;border:1px solid var(--tool-border);border-radius:6px;overflow:hidden;background:#fff}.image-aspect-ratio-tool__fit-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;border:none;background:#fff;color:var(--tool-text-medium);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.image-aspect-ratio-tool__fit-btn:first-child{border-right:1px solid var(--tool-border)}.image-aspect-ratio-tool__fit-btn:hover{background:#f5f5f5}.image-aspect-ratio-tool__fit-btn.active{background:var(--tool-primary);color:#fff}.image-aspect-ratio-tool__fit-btn svg{font-size:1rem}.image-aspect-ratio-tool__file-input-wrapper{position:relative;cursor:pointer}.image-aspect-ratio-tool__file-input{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer;z-index:1}.image-aspect-ratio-tool__file-input-display{display:flex;align-items:center;justify-content:center;gap:10px;padding:15px;border:2px dashed var(--tool-primary);border-radius:8px;background:#fff;color:var(--tool-primary);font-weight:700;transition:all .3s;min-height:60px}.image-aspect-ratio-tool__file-input-display svg{font-size:1.5rem}.image-aspect-ratio-tool__file-input-display:hover{border-color:var(--tool-secondary);background:var(--tool-primary-light)}.image-aspect-ratio-tool__file-count{margin-top:10px;font-size:.9rem;color:var(--tool-text-medium);font-weight:700}.image-aspect-ratio-tool__file-list{margin-top:15px;max-height:200px;overflow-y:auto;border:1px solid var(--tool-border);border-radius:8px;background:#fff}.image-aspect-ratio-tool__file-item{padding:10px 15px;border-bottom:1px solid var(--tool-border);display:flex;align-items:center;justify-content:space-between;font-size:.9rem}.image-aspect-ratio-tool__file-item:last-child{border-bottom:none}.image-aspect-ratio-tool__file-name{flex:1;color:var(--tool-text-dark);word-break:break-all}.image-aspect-ratio-tool__file-size{color:var(--tool-text-medium);font-size:.8rem;margin-left:10px}.image-aspect-ratio-tool__remove-file{background:var(--tool-error);color:#fff;border:none;border-radius:4px;padding:4px 8px;cursor:pointer;font-size:.8rem;margin-left:10px;transition:all .3s}.image-aspect-ratio-tool__remove-file:hover{background:#c82333;transform:scale(1.1)}.image-aspect-ratio-tool__clear-all-btn{margin-top:10px;width:100%}.image-aspect-ratio-tool__aspect-ratio-preview{margin-top:10px;padding:8px 12px;background:#e3f2fd;border-radius:4px;font-size:.9rem;color:#1565c0}.image-aspect-ratio-tool__input-note{display:block;color:var(--tool-text-medium);margin-top:5px;font-size:.85rem}.image-aspect-ratio-tool__process-btn{font-size:1.2rem;margin-top:20px}.image-aspect-ratio-tool__process-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.image-aspect-ratio-tool__loading{text-align:center;padding:40px;color:var(--tool-primary)}.image-aspect-ratio-tool__spinner{border:4px solid var(--tool-border);border-top:4px solid var(--tool-primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.image-aspect-ratio-tool__preview-container{margin-top:30px}.image-aspect-ratio-tool__preview-container h2{font-size:1.5rem;color:var(--tool-text-dark);margin-bottom:20px}.image-aspect-ratio-tool__batch-download{margin-bottom:20px;text-align:center}.image-aspect-ratio-tool__preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.image-aspect-ratio-tool__preview-item{background:#fff;border-radius:10px;box-shadow:var(--tool-shadow-light);overflow:hidden;transition:all .3s}.image-aspect-ratio-tool__preview-item:hover{transform:translateY(-4px);box-shadow:var(--tool-shadow-medium)}.image-aspect-ratio-tool__preview-item img{width:100%;height:auto;display:block}.image-aspect-ratio-tool__preview-info{padding:15px;background:var(--tool-bg-light)}.image-aspect-ratio-tool__preview-info h3{margin-bottom:10px;color:var(--tool-text-dark);font-size:1.1rem;word-break:break-all}.image-aspect-ratio-tool__preview-info p{margin:5px 0;color:var(--tool-text-medium);font-size:.9rem}.image-aspect-ratio-tool__preview-info button{margin-top:10px;width:100%}@media(max-width:1024px){.image-aspect-ratio-tool__controls{grid-template-columns:1fr}.image-aspect-ratio-tool__settings-bar{grid-template-columns:1fr 1fr}}@media(max-width:768px){.image-aspect-ratio-tool__preview-grid,.image-aspect-ratio-tool__settings-bar{grid-template-columns:1fr}}.image-aspect-ratio-tool__label-with-help{display:flex;align-items:center;gap:8px;margin-bottom:8px}.image-aspect-ratio-tool__help-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;background:none;color:#666;cursor:pointer;font-size:18px;border-radius:4px;transition:all .2s ease}.image-aspect-ratio-tool__help-btn:hover{background-color:#e8e8e8;color:#333}.image-aspect-ratio-tool__help-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease}.image-aspect-ratio-tool__help-dialog{background:#fff;border-radius:12px;box-shadow:0 8px 32px #00000026;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;animation:slideUp .3s ease}.image-aspect-ratio-tool__help-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e8e8e8}.image-aspect-ratio-tool__help-header h3{margin:0;font-size:18px;font-weight:600;color:#333}.image-aspect-ratio-tool__help-close{width:32px;height:32px;border:none;background:none;color:#999;cursor:pointer;font-size:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease}.image-aspect-ratio-tool__help-close:hover{background-color:#f0f0f0;color:#333}.image-aspect-ratio-tool__help-content{padding:20px}.image-aspect-ratio-tool__help-item{margin-bottom:16px}.image-aspect-ratio-tool__help-item:last-child{margin-bottom:0}.image-aspect-ratio-tool__help-item h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#333}.image-aspect-ratio-tool__help-item p{margin:0;font-size:14px;line-height:1.6;color:#666}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.image-converter-tool{position:relative;min-height:100vh;padding:2rem;overflow:hidden}.image-converter-tool__header{margin-bottom:2rem}.image-converter-tool__subtitle{font-size:1.1rem;color:var(--tool-text-medium);margin-top:.5rem;line-height:1.6}.image-converter-tool__info-section{background:linear-gradient(135deg,#e8f5e9,#f1f8e9);border:1px solid #4CAF50;border-radius:12px;padding:20px 25px;margin-bottom:2rem}.image-converter-tool__info-toggle{width:100%;background:none;border:none;padding:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .3s}.image-converter-tool__info-toggle:hover{opacity:.8}.image-converter-tool__info-toggle h3{color:#2e7d32;margin:0;font-size:1.1rem;font-weight:600;display:flex;align-items:center;gap:10px}.image-converter-tool__info-icon{color:#2e7d32;font-size:.9rem;transition:transform .3s}.image-converter-tool__info-icon.open{transform:rotate(180deg)}.image-converter-tool__info-content{margin-top:20px;animation:slideDown .3s ease-out}.image-converter-tool__info-block{background:#fff;padding:20px;border-radius:8px;box-shadow:var(--tool-shadow-light);margin-bottom:15px}.image-converter-tool__info-block:last-child{margin-bottom:0}.image-converter-tool__info-block h4{color:#2e7d32;margin-bottom:15px;font-size:1.1rem}.image-converter-tool__spec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.image-converter-tool__spec-category h5{margin-bottom:10px;font-size:.95rem}.image-converter-tool__spec-category ul{list-style:none;padding:0;margin:0}.image-converter-tool__spec-category li{padding:4px 0;color:var(--tool-text-medium);font-size:.9rem}.image-converter-tool__spec-category li:before{content:"•";margin-right:8px;color:var(--tool-text-light)}.image-converter-tool__steps{padding-left:20px;margin:0}.image-converter-tool__steps li{padding:5px 0;color:var(--tool-text-medium)}.image-converter-tool__note{margin-top:15px;padding:10px;background:#fff3e0;border-radius:6px;font-size:.9rem;color:#e65100}.image-converter-tool__main{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:20px}.image-converter-tool__upload-section,.image-converter-tool__settings-section{background:var(--tool-bg-light);border-radius:12px;padding:20px}.image-converter-tool__upload-section h2,.image-converter-tool__settings-section h2{font-size:1.2rem;color:var(--tool-text-dark);margin-bottom:15px;display:flex;align-items:center;gap:8px}.image-converter-tool__dropzone{position:relative;border:2px dashed var(--tool-primary);border-radius:12px;padding:40px 20px;text-align:center;transition:all .3s;cursor:pointer;background:#fff}.image-converter-tool__dropzone:hover{border-color:var(--tool-secondary);background:var(--tool-primary-light)}.image-converter-tool__file-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.image-converter-tool__dropzone-content{pointer-events:none}.image-converter-tool__dropzone-icon{font-size:3rem;color:var(--tool-primary);margin-bottom:15px}.image-converter-tool__dropzone-content p{margin:5px 0;color:var(--tool-text-medium)}.image-converter-tool__dropzone-content span{color:var(--tool-primary);font-weight:600}.image-converter-tool__dropzone-content small{color:var(--tool-text-light);font-size:.85rem}.image-converter-tool__file-list{margin-top:20px}.image-converter-tool__file-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.image-converter-tool__file-list-header span{font-weight:600;color:var(--tool-text-dark)}.image-converter-tool__file-items{max-height:300px;overflow-y:auto;border:1px solid var(--tool-border);border-radius:8px;background:#fff}.image-converter-tool__file-item{display:flex;align-items:center;gap:12px;padding:10px;border-bottom:1px solid var(--tool-border)}.image-converter-tool__file-item:last-child{border-bottom:none}.image-converter-tool__file-thumb{width:50px;height:50px;object-fit:cover;border-radius:4px;border:1px solid var(--tool-border)}.image-converter-tool__file-info{flex:1;min-width:0}.image-converter-tool__file-name{display:block;font-size:.9rem;color:var(--tool-text-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.image-converter-tool__file-meta{display:block;font-size:.8rem;color:var(--tool-text-light);margin-top:2px}.image-converter-tool__remove-file{background:var(--tool-error);color:#fff;border:none;border-radius:4px;width:24px;height:24px;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:all .3s}.image-converter-tool__remove-file:hover{background:#c82333;transform:scale(1.1)}.image-converter-tool__preset-groups{display:flex;flex-direction:column;gap:15px}.image-converter-tool__preset-group{background:#fff;border-radius:8px;overflow:hidden;border:1px solid var(--tool-border)}.image-converter-tool__preset-group-header{padding:12px 15px;background:var(--tool-bg-light);border-left:4px solid}.image-converter-tool__group-checkbox{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:600}.image-converter-tool__group-checkbox input[type=checkbox]{width:18px;height:18px;cursor:pointer}.image-converter-tool__preset-items{padding:10px 15px 10px 35px;display:flex;flex-direction:column;gap:8px}.image-converter-tool__preset-item{display:flex;align-items:center;gap:10px;cursor:pointer;padding:8px;border-radius:6px;transition:background .2s}.image-converter-tool__preset-item:hover{background:var(--tool-bg-light)}.image-converter-tool__preset-item input[type=checkbox]{width:16px;height:16px;cursor:pointer}.image-converter-tool__preset-info{display:flex;flex-direction:column}.image-converter-tool__preset-name{font-weight:500;color:var(--tool-text-dark);font-size:.95rem}.image-converter-tool__preset-desc{font-size:.8rem;color:var(--tool-text-light)}.image-converter-tool__picto-slider{padding:15px;background:linear-gradient(135deg,#f3e5f5,#ede7f6);border-radius:8px;margin-top:5px}.image-converter-tool__picto-slider .tool-label{color:#9c27b0;font-weight:600;margin-bottom:10px}.image-converter-tool__picto-slider .tool-range{width:100%;accent-color:#9C27B0}.image-converter-tool__picto-slider-labels{display:flex;justify-content:space-between;margin-top:5px;font-size:.75rem;color:var(--tool-text-light)}.image-converter-tool__options{margin-top:20px;padding-top:20px;border-top:1px solid var(--tool-border)}.image-converter-tool__option-note{display:block;color:var(--tool-text-light);font-size:.8rem;margin-top:5px}.image-converter-tool__fit-mode{display:flex;gap:10px}.image-converter-tool__fit-mode-option{flex:1;display:flex;align-items:center;gap:10px;padding:12px;border:2px solid var(--tool-border);border-radius:10px;cursor:pointer;transition:all .3s;background:#fff}.image-converter-tool__fit-mode-option:hover{border-color:var(--tool-primary);background:var(--tool-primary-light)}.image-converter-tool__fit-mode-option.active{border-color:var(--tool-primary);background:var(--tool-primary-light);box-shadow:0 0 0 3px #1e75d31a}.image-converter-tool__fit-mode-option input[type=radio]{display:none}.image-converter-tool__fit-mode-icon{font-size:1.2rem;color:var(--tool-primary);flex-shrink:0}.image-converter-tool__fit-mode-text{display:flex;flex-direction:column;gap:2px;min-width:0}.image-converter-tool__fit-mode-title{font-weight:600;color:var(--tool-text-dark);font-size:.85rem;line-height:1.2}.image-converter-tool__fit-mode-desc{font-size:.7rem;color:var(--tool-text-medium);line-height:1.2}.image-converter-tool__color-input{display:flex;align-items:center;gap:10px}.image-converter-tool__color-input input[type=color]{width:50px;height:38px;border:none;border-radius:4px;cursor:pointer;padding:0}.image-converter-tool__color-input input[type=text]{width:100px;font-family:monospace}.image-converter-tool__process-btn{font-size:1.1rem;padding:15px 20px;margin-top:20px}.image-converter-tool__process-btn:disabled{opacity:.5;cursor:not-allowed}.image-converter-tool__loading{text-align:center;padding:30px}.image-converter-tool__progress-bar{width:100%;height:20px;background:var(--tool-border);border-radius:10px;overflow:hidden;margin-bottom:15px}.image-converter-tool__progress-fill{height:100%;background:linear-gradient(90deg,var(--tool-primary) 0%,var(--tool-secondary) 100%);transition:width .3s}.image-converter-tool__loading p{color:var(--tool-text-medium);font-weight:500}.image-converter-tool__results{margin-top:30px}.image-converter-tool__results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.image-converter-tool__results-header h2{font-size:1.3rem;color:var(--tool-text-dark);margin:0}.image-converter-tool__results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px}.image-converter-tool__result-item{background:#fff;border-radius:10px;overflow:hidden;box-shadow:var(--tool-shadow-light);transition:all .3s}.image-converter-tool__result-item:hover{transform:translateY(-4px);box-shadow:var(--tool-shadow-medium)}.image-converter-tool__result-preview{width:100%;aspect-ratio:1;overflow:hidden;background:#f0f0f0;display:flex;align-items:center;justify-content:center}.image-converter-tool__result-preview img{max-width:100%;max-height:100%;object-fit:contain}.image-converter-tool__result-info{padding:12px}.image-converter-tool__result-badge{display:inline-block;padding:3px 8px;border-radius:4px;font-size:.75rem;color:#fff;font-weight:600;margin-bottom:8px}.image-converter-tool__result-filename{font-size:.85rem;color:var(--tool-text-dark);margin:0 0 5px;word-break:break-all}.image-converter-tool__result-size{font-size:.8rem;color:var(--tool-text-light);margin:0 0 10px}.image-converter-tool__result-dpi{color:var(--tool-primary);font-weight:500;margin-left:4px}.image-converter-tool__result-info .tool-btn{width:100%;font-size:.85rem;padding:8px}@media(max-width:1024px){.image-converter-tool__main{grid-template-columns:1fr}.image-converter-tool__spec-grid{grid-template-columns:1fr;gap:10px}}@media(max-width:768px){.image-converter-tool{padding:1rem}.image-converter-tool__results-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.image-converter-tool__results-grid{grid-template-columns:1fr}}.image-converter-tool__paste-hint{position:fixed;top:20px;right:20px;background:var(--tool-primary);color:#fff;padding:1rem 1.5rem;border-radius:var(--tool-radius-sm);box-shadow:var(--tool-shadow-strong);display:flex;align-items:center;gap:.5rem;font-weight:600;z-index:9999;animation:slideInRight .3s ease-out}.image-converter-tool__paste-hint svg{font-size:1.5rem}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.logo-generator-tool{position:relative;min-height:100vh;padding:2rem;overflow:hidden}.logo-generator-tool__container{display:grid;grid-template-columns:400px 1fr;gap:2rem;margin-top:2rem;min-width:0}.logo-generator-tool__controls-panel{display:flex;flex-direction:column;gap:1.5rem}.logo-generator-tool__control-section{background:var(--tool-bg-light);padding:1.5rem;border-radius:var(--tool-radius-md)}.logo-generator-tool__control-section h2{font-size:1.1rem;font-weight:600;color:var(--tool-text-dark);margin:0 0 1rem;display:flex;align-items:center;gap:.5rem}.logo-generator-tool__label{display:block;margin-bottom:.5rem;color:var(--tool-text-medium);font-weight:600;font-size:14px}.logo-generator-tool__format-buttons{display:flex;gap:.5rem}.logo-generator-tool__format-btn{flex:1;padding:14px;border:2px solid var(--tool-border);background:var(--tool-bg-white);border-radius:6px;cursor:pointer;transition:all .3s;font-size:16px;font-weight:500;color:var(--tool-text-dark)}.logo-generator-tool__format-btn:hover{background:var(--tool-bg-light);border-color:var(--tool-primary)}.logo-generator-tool__format-btn--active{background:var(--tool-primary);color:#fff;border-color:var(--tool-primary)}.logo-generator-tool__actions{display:flex;flex-direction:column;gap:.75rem}.logo-generator-tool__btn{padding:14px 20px;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.logo-generator-tool__btn:disabled{background:#e0e0e0;color:#999;cursor:not-allowed;opacity:.6}.logo-generator-tool__btn--png{background:#3b82f6;color:#fff}.logo-generator-tool__btn--png:hover:not(:disabled){background:#2563eb;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.logo-generator-tool__btn--svg{background:#10b981;color:#fff}.logo-generator-tool__btn--svg:hover:not(:disabled){background:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.logo-generator-tool__btn--secondary{background:#f5f5f5;color:var(--tool-text-medium);border:1px solid var(--tool-border);font-weight:500}.logo-generator-tool__btn--secondary:hover{background:var(--tool-border);color:var(--tool-text-dark);transform:translateY(-2px)}.logo-generator-tool__info-text{text-align:center;color:var(--tool-text-light);font-size:14px;margin:0;padding:1rem;background:var(--tool-bg-light);border-radius:var(--tool-radius-md)}.logo-generator-tool__preview-panel{background:var(--tool-bg-light);padding:1.5rem;border-radius:var(--tool-radius-md);display:flex;flex-direction:column;gap:1rem;min-width:0;overflow:hidden}.logo-generator-tool__preview-panel h2{font-size:1.1rem;font-weight:600;color:var(--tool-text-dark);margin:0}.logo-generator-tool__preview-area{border:2px solid var(--tool-border);border-radius:10px;padding:60px 40px;text-align:center;background:#fafafa;min-height:300px;max-height:500px;display:flex;align-items:center;justify-content:flex-start;background-image:linear-gradient(45deg,#f5f5f5 25%,transparent 25%),linear-gradient(-45deg,#f5f5f5 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f5f5f5 75%),linear-gradient(-45deg,transparent 75%,#f5f5f5 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;overflow-x:auto;overflow-y:hidden}.logo-generator-tool__logo-container{background:#fff;padding:40px 60px;border-radius:8px;box-shadow:var(--tool-shadow-light);display:inline-block;min-width:min-content;flex-shrink:0}.logo-generator-tool__placeholder{color:var(--tool-text-light);font-size:1rem;font-style:italic}@media(max-width:1024px){.logo-generator-tool__container{grid-template-columns:1fr}.logo-generator-tool__controls-panel{position:static}}@media(max-width:640px){.logo-generator-tool{padding:1rem}.logo-generator-tool__preview-area{padding:30px 20px;min-height:200px}.logo-generator-tool__logo-container{padding:20px 30px}.logo-generator-tool__format-buttons{flex-direction:column}}.guide-page{position:relative;min-height:100vh;background:#f8f8f8;padding:2rem;overflow:hidden}.guide-container{background:#fff;border-radius:16px;padding:3rem;box-shadow:0 10px 40px #0000001a}.guide-header{text-align:center;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:2px solid #E5E5E5}.guide-header h1{font-size:2rem;color:#2d2d2d;margin-bottom:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.5rem}.guide-header h1 svg{font-size:2rem;color:#ec6c00}.guide-header p{font-size:1rem;color:#666;line-height:1.6}.guide-section{margin-bottom:3rem}.guide-section h2{font-size:1.5rem;color:#333;margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:2px solid #e0e0e0;display:flex;align-items:center;gap:.5rem}.guide-section h2 svg{color:#667eea}.guide-content h3{font-size:1.5rem;color:#333;margin:2rem 0 1rem}.guide-content h4{font-size:1.2rem;color:#444;margin:1rem 0 .5rem}.guide-content p{line-height:1.8;color:#555;margin-bottom:1rem}.guide-content ul,.guide-content ol{margin-left:1.5rem;margin-bottom:1.5rem}.guide-content li{line-height:1.8;color:#555;margin-bottom:.5rem}.guide-steps{counter-reset:step-counter;list-style:none;margin-left:0}.guide-steps>li{counter-increment:step-counter;position:relative;padding:1.5rem;margin-bottom:1.5rem;background:#f8f9fa;border-radius:0;border-left:4px solid #667eea}.guide-steps>li:before{content:"STEP " counter(step-counter);display:block;font-size:.8rem;font-weight:700;color:#667eea;margin-bottom:.5rem}.guide-steps>li strong{font-size:1.1rem;color:#333;display:block;margin-bottom:.5rem}.guide-steps>li p{margin-bottom:.5rem}.guide-steps>li ul{margin-top:.5rem;margin-left:1.5rem}.tips{margin:1.5rem 0 1.5rem 1.5rem}.tip-item{background:#fffbea;border-left:4px solid #f1c40f;padding:1.5rem;margin-bottom:1rem;border-radius:0}.tip-item h4{color:#333;margin-top:0;display:flex;align-items:center;gap:.5rem}.tip-item h4 svg{color:#f1c40f}.tip-item p{margin-bottom:0}.spec-table{margin:1.5rem 0;overflow-x:auto}.spec-table table{width:100%;border-collapse:collapse;font-size:.95rem}.spec-table th,.spec-table td{padding:12px 15px;text-align:left;border:1px solid #e0e0e0}.spec-table th{background:#667eea;color:#fff;font-weight:600}.spec-table td{background:#fff}.spec-table tr:hover td{background:#f8f9fa}.warning-box{background:#fff8e1;border:1px solid #ff9800;border-left:4px solid #ff9800;border-radius:8px;padding:1.5rem;margin:1.5rem 0}.warning-box h4{color:#e65100;margin-top:0;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.warning-box h4 svg{color:#ff9800;font-size:1.3rem}.warning-box p{margin-bottom:.75rem}.warning-box p:last-child{margin-bottom:0}.info-box{background:#e3f2fd;border:1px solid #2196f3;border-left:4px solid #2196f3;border-radius:8px;padding:1rem 1.5rem;margin:1rem 0}.info-box p{margin:0;color:#1565c0}.info-box code{background:#ffffffb3;padding:2px 6px;border-radius:3px}.workflow-container{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:25px;background:linear-gradient(135deg,#f5f7fa,#e4e8ec);border-radius:12px;margin:1.5rem 0;overflow-x:auto}.workflow-step{display:flex;align-items:center;gap:12px;background:#fff;padding:15px 20px;border-radius:10px;box-shadow:0 2px 8px #00000014;min-width:180px;flex-shrink:0}.workflow-step-final{background:linear-gradient(135deg,#4caf50,#45a049)}.workflow-step-final .workflow-step-content h4,.workflow-step-final .workflow-step-content p{color:#fff}.workflow-step-number{width:36px;height:36px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;flex-shrink:0}.workflow-step-final .workflow-step-number{background:#fff;color:#4caf50;font-size:1.4rem}.workflow-step-content h4{margin:0 0 4px;font-size:.95rem;color:#333}.workflow-step-content p{margin:0;font-size:.8rem;color:#666}.workflow-arrow{color:#667eea;font-size:1.5rem;flex-shrink:0}.script-download-section{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin:1.5rem 0}.script-download-card{background:#fff;border:1px solid #e0e0e0;border-radius:12px;padding:20px;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s}.script-download-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea26}.script-download-info h4{margin:0 0 5px;font-size:1.1rem;color:#333}.script-download-subtitle{font-size:.85rem;color:#667eea;font-weight:600;margin:0 0 12px}.script-download-info ul{margin:0;padding-left:1.2rem;font-size:.9rem}.script-download-info li{margin-bottom:4px;color:#666}.script-download-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:15px;padding:10px 20px;background:#f5f5f5;color:#333;text-decoration:none;border-radius:8px;font-weight:600;font-size:.95rem;transition:all .3s;border:1px solid #e0e0e0}.script-download-btn:hover{background:#e8e8e8;transform:translateY(-2px)}.script-download-btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none}.script-download-btn-primary:hover{background:linear-gradient(135deg,#5a6fd6,#6a4190);box-shadow:0 4px 12px #667eea66}.script-download-card-featured{position:relative;background:linear-gradient(135deg,#f8f9ff,#f0f4ff);border:2px solid #667eea;grid-column:1 / -1}.script-download-card-featured:hover{border-color:#5a6fd6;box-shadow:0 6px 20px #667eea40}.script-download-badge{position:absolute;top:-12px;left:20px;background:linear-gradient(135deg,#ff6b6b,#ee5a5a);color:#fff;padding:4px 12px;border-radius:12px;font-size:.8rem;font-weight:700;box-shadow:0 2px 8px #ee5a5a4d}.script-download-btn-featured{background:linear-gradient(135deg,#ff6b6b,#ee5a5a);color:#fff;border:none;font-size:1rem;padding:12px 24px}.script-download-btn-featured:hover{background:linear-gradient(135deg,#ee5a5a,#dd4949);box-shadow:0 4px 12px #ee5a5a66}@media(max-width:768px){.script-download-section{grid-template-columns:1fr}.script-download-card-featured{grid-column:1}}.guide-content code{display:inline-block;background:#f5f5f5;padding:8px 16px;border-radius:4px;font-family:Consolas,Monaco,monospace;font-size:.9rem;color:#333;margin:.5rem 0}.guide-footer{text-align:center;padding-top:2rem;margin-top:3rem;border-top:1px solid #e0e0e0}@media(max-width:1024px){.guide-layout{grid-template-columns:1fr}}@media(max-width:768px){.guide-container{padding:1.5rem}.guide-header h1{font-size:1.5rem}.guide-section h2{font-size:1.3rem}.guide-content h3{font-size:1.2rem}}.guide-index-page{position:relative;min-height:100vh;background:#f8f8f8;padding:2rem;overflow:hidden}.guide-layout{position:relative;z-index:1;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:2rem;align-items:start}.guide-index-container{position:relative;z-index:1}.guide-index-header{text-align:left;margin-bottom:2rem}.guide-index-header h1{font-size:2.5rem;color:#2d2d2d;margin-bottom:.5rem;font-weight:700;display:flex;align-items:center;gap:.75rem}.guide-index-header h1 svg{font-size:2.5rem;color:#ec6c00}.guide-index-header p{font-size:1.1rem;color:#666;line-height:1.6}.guide-index-list{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:2rem}@media(min-width:768px){.guide-index-list{grid-template-columns:1fr 1fr}}.guide-list-item{background:#fff;border-radius:12px;padding:1.5rem;text-decoration:none;transition:all .3s;box-shadow:0 2px 8px #00000014;display:flex;align-items:center;gap:1.5rem}.guide-list-item:hover{transform:translate(8px);box-shadow:0 4px 16px #0000001f}.guide-list-icon{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.guide-list-icon svg{font-size:2.5rem;color:#fff}.guide-list-item:nth-child(1) .guide-list-icon{background:linear-gradient(135deg,#ec6c00,#ff8c00)}.guide-list-item:nth-child(2) .guide-list-icon{background:linear-gradient(135deg,#ffe900,#ffc107)}.guide-list-item:nth-child(3) .guide-list-icon{background:linear-gradient(135deg,#004097,#06c)}.guide-list-item:nth-child(4) .guide-list-icon{background:linear-gradient(135deg,#e91e63,#c2185b)}.guide-list-item:nth-child(5) .guide-list-icon{background:linear-gradient(135deg,#9c27b0,#7b1fa2)}.guide-list-item:nth-child(6) .guide-list-icon{background:linear-gradient(135deg,#4caf50,#388e3c)}.guide-list-content{flex:1}.guide-list-content h3{font-size:1.25rem;color:#2d2d2d;margin-bottom:.25rem;font-weight:600}.guide-list-content p{font-size:.95rem;color:#666;line-height:1.5}.guide-list-arrow{font-size:1.5rem;color:#999;flex-shrink:0;transition:all .3s}.guide-list-item:hover .guide-list-arrow{color:#667eea;transform:translate(4px)}.guide-index-footer{text-align:center;padding-top:2rem}.back-link{display:inline-block;padding:.8rem 2rem;background:#667eea;color:#fff;text-decoration:none;border-radius:8px;font-weight:600;transition:all .3s}.back-link:hover{background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}@media(max-width:1024px){.guide-layout{grid-template-columns:1fr}.guide-index-header h1{font-size:2rem}.guide-list-item{padding:1.25rem}.guide-list-icon{width:50px;height:50px}.guide-list-icon svg{font-size:2rem}}@media(max-width:640px){.guide-index-page{padding:1rem}.guide-index-header h1{font-size:1.75rem}.guide-list-item{flex-direction:column;text-align:center;gap:1rem}.guide-list-arrow{display:none}}.amidakuji-tool{min-height:100vh}.amidakuji-layout{display:grid;grid-template-columns:320px 1fr;gap:2rem;margin-top:2rem}@media(max-width:1024px){.amidakuji-layout{grid-template-columns:1fr}}.amidakuji-settings{background:var(--tool-bg-white);border-radius:var(--tool-radius-lg);padding:1.5rem;box-shadow:var(--tool-shadow-medium);height:fit-content;position:sticky;top:100px}.settings-section{margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--tool-border)}.settings-section:last-of-type{border-bottom:none}.settings-section h3{font-size:1rem;color:var(--tool-text-dark);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.participants-list,.prizes-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.participant-item,.prize-item{display:flex;align-items:center;gap:.5rem}.participant-color{width:12px;height:12px;border-radius:50%;flex-shrink:0}.participant-input,.prize-input{flex:1;padding:8px 12px;font-size:14px}.prize-number{width:24px;height:24px;border-radius:50%;background:var(--tool-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}.btn-remove{width:32px;height:32px;border:none;border-radius:50%;background:#f5f5f5;color:var(--tool-text-medium);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s}.btn-remove:hover:not(:disabled){background:var(--tool-error);color:#fff}.btn-remove:disabled{opacity:.3;cursor:not-allowed}.btn-add{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%}.prize-actions{display:flex;gap:.5rem}.prize-actions .btn-add{flex:1}.action-buttons{display:flex;flex-direction:column;gap:.75rem}.run-all-btn{font-size:.9rem;padding:.6rem 1.2rem;background:linear-gradient(135deg,#667eea,#764ba2)}.run-all-btn:hover{background:linear-gradient(135deg,#5a6fd6,#6a4190)}.amidakuji-main{background:transparent;border-radius:0;padding:0;box-shadow:none}.game-phase-controls{margin-bottom:1rem}.phase-control-box{background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--tool-radius-sm);padding:.75rem 1rem;text-align:center;border:1px solid var(--tool-border);display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap}.phase-control-box.selecting{background:linear-gradient(135deg,#fffdf5,#fff9e6);border-color:#ffc107}.phase-control-box.ready{background:linear-gradient(135deg,#f1f8e9,#e8f5e9);border-color:#4caf50}.phase-control-box.running{background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-color:#2196f3;animation:pulse 1s infinite}.phase-control-box.finished{background:linear-gradient(135deg,#fce4ec,#f8bbd9);border-color:#e91e63}.phase-title{font-size:.9rem;font-weight:600;color:var(--tool-text-dark);margin:0}.current-selecting-main{display:flex;align-items:center;gap:.5rem}.selecting-color-large{width:20px;height:20px;border-radius:50%;flex-shrink:0;box-shadow:0 1px 3px #0003}.selecting-info{display:flex;align-items:center;gap:.25rem}.selecting-label{font-size:.8rem;color:var(--tool-text-light)}.selecting-name{font-size:.95rem;font-weight:600;color:var(--tool-text-dark)}.phase-instruction-main{font-size:.85rem;color:var(--tool-text-medium);margin:0}.selection-status{display:flex;align-items:center;gap:.75rem}.selection-progress-main{font-size:.8rem;color:var(--tool-text-medium);background:#fffc;padding:.25rem .75rem;border-radius:12px}.btn-undo{padding:.35rem .75rem;font-size:.8rem}.ready-buttons{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}.ready-buttons .tool-btn{padding:.4rem .8rem;font-size:.85rem}.assignments-section{background:#f8f9fa;border-radius:var(--tool-radius-sm);padding:.75rem}.assignments-section h4{font-size:.85rem;color:var(--tool-text-dark);margin-bottom:.5rem}.amidakuji-canvas{background:#fafafa;border-radius:var(--tool-radius-md);padding:1.5rem;min-height:500px;display:flex;flex-direction:column;overflow:visible}.amidakuji-participants{display:flex;justify-content:space-evenly;align-items:center;margin-bottom:.5rem;width:100%}.participant-header{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.5rem .75rem;background:#fff;border-radius:var(--tool-radius-sm);border:2px solid transparent;cursor:pointer;transition:all .3s;flex:0 0 80px;min-width:80px;max-width:80px}.participant-header:hover{transform:translateY(-2px);box-shadow:var(--tool-shadow-medium)}.participant-header.selected{border-color:currentColor;box-shadow:0 0 20px #667eea4d}.participant-header.completed{background:linear-gradient(135deg,#f5f7fa,#e8f4fd)}.participant-header.selectable{cursor:pointer;animation:pulse-border 1.5s infinite}.participant-header.selectable:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 8px 25px #667eea66}@keyframes pulse-border{0%,to{box-shadow:0 0 #667eea66}50%{box-shadow:0 0 0 8px #667eea00}}.participant-header.chosen{background:linear-gradient(135deg,#e8f4fd,#d0e8ff);border-color:var(--tool-primary);position:relative}.participant-header.assigned{background:linear-gradient(135deg,#e8f4fd,#d0e8ff);position:relative;cursor:default}.chosen-icon{position:absolute;top:-8px;right:-8px;font-size:1.2rem;background:#fff;border-radius:50%}.position-number{font-weight:500;font-size:.85rem;color:var(--tool-text-light)}.empty-marker{background:#ddd}.participant-name{font-weight:600;font-size:.9rem;color:var(--tool-text-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.participant-marker{width:12px;height:12px;border-radius:50%}.amidakuji-svg{flex:1;width:100%;height:300px;min-height:300px;max-height:300px;margin:.5rem 0;background:linear-gradient(180deg,#667eea05,#764ba20a,#667eea05);border-radius:var(--tool-radius-sm);padding:.5rem 0}.amidakuji-prizes{display:flex;justify-content:space-evenly;align-items:center;margin-top:.75rem;padding-bottom:.5rem;width:100%}.prize-slot{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.5rem .75rem;background:linear-gradient(135deg,#fff9e6,#fff3cd);border-radius:var(--tool-radius-sm);border:2px solid #ffc107;flex:0 0 80px;min-width:80px;max-width:80px;transition:all .5s cubic-bezier(.68,-.55,.265,1.55);position:relative}.prize-slot.winner{background:linear-gradient(135deg,#ffe082,#ffca28);border-color:#ff9800;border-width:3px;box-shadow:0 0 30px #ff9800cc,0 0 60px #ffc10766;animation:prize-glow 1s ease-in-out}@keyframes prize-glow{0%,to{transform:scale(1);box-shadow:0 0 30px #ff9800cc,0 0 60px #ffc10766}50%{transform:scale(1.15);box-shadow:0 0 50px #ff9800,0 0 100px #ffc10799}}.prize-slot.loser{background:linear-gradient(135deg,#f5f5f5,#e0e0e0);border-color:#bdbdbd}.prize-slot.hidden{background:linear-gradient(135deg,#e3e3e3,#d0d0d0);border-color:#9e9e9e;border-style:dashed}.prize-icon{font-size:1.5rem}.prize-name{font-weight:600;font-size:.85rem;color:var(--tool-text-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.results-section{margin-top:1.5rem}.results-container{background:#fff;border-radius:var(--tool-radius-md);padding:1rem;box-shadow:var(--tool-shadow-medium);max-width:450px;margin:0 auto}.results-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid var(--tool-border)}.results-title{font-size:1.1rem;font-weight:700;color:var(--tool-text-dark);margin:0;display:flex;align-items:center;gap:.5rem}.results-date{color:var(--tool-text-light);font-size:.75rem;margin:0}.results-grid{display:flex;flex-direction:column;gap:0}.result-item{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:.75rem;padding:.6rem .75rem;border-bottom:1px solid #f0f0f0;transition:all .2s}.result-item:last-child{border-bottom:none}.result-item:hover{background:#fafafa}.result-item.winner-item{background:linear-gradient(90deg,#fffbf0 0%,transparent 100%)}.result-item.winner-item:hover{background:linear-gradient(90deg,#fff9e6 0%,transparent 100%)}.result-color-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.result-participant-side{display:flex;align-items:center;gap:0}.result-participant-name{font-weight:500;color:var(--tool-text-dark);font-size:.9rem}.result-prize-side{display:flex;justify-content:flex-end}.result-prize-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:12px;font-weight:600;font-size:.8rem;white-space:nowrap}.result-prize-badge.winner-badge{background:linear-gradient(135deg,#ffd54f,#ffca28);color:#e65100}.result-prize-badge.loser-badge{background:#f5f5f5;color:var(--tool-text-light);font-weight:500}.results-footer{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--tool-border);display:flex;align-items:center;justify-content:space-between}.results-footer-text{color:var(--tool-text-light);font-size:.75rem}.save-result-btn-inline{font-size:.8rem;padding:.35rem .7rem}.select-phase-message,.ready-phase,.running-phase,.finished-phase{text-align:center}.current-selecting{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:1.1rem;margin-bottom:.75rem;padding:.75rem;background:linear-gradient(135deg,#fff9e6,#fff3cd);border-radius:var(--tool-radius-sm);border:2px solid #ffc107}.selecting-color{width:16px;height:16px;border-radius:50%;flex-shrink:0}.selection-progress{font-size:.9rem;color:var(--tool-text-medium);margin-bottom:.5rem}.phase-instruction{font-size:1rem;color:var(--tool-text-dark);margin-bottom:1rem;padding:.75rem;background:var(--tool-primary-light);border-radius:var(--tool-radius-sm)}.assignments-preview{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;max-height:200px;overflow-y:auto}.assignment-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#f8f9fa;border-radius:var(--tool-radius-sm);font-size:.85rem}.assignment-color{width:12px;height:12px;border-radius:50%;flex-shrink:0}.assignment-name{flex:1;font-weight:600;text-align:left}.assignment-arrow{color:var(--tool-text-light)}.assignment-position{color:var(--tool-primary);font-weight:500}.running-phase .phase-instruction{background:linear-gradient(135deg,#fff9e6,#fff3cd);animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.settings-hint{font-size:.8rem;color:var(--tool-text-light);margin-bottom:.75rem;padding:.5rem;background:#f5f5f5;border-radius:var(--tool-radius-sm)}@media(max-width:768px){.amidakuji-settings{position:relative;top:0}.amidakuji-canvas{padding:1rem;min-height:400px}.participant-header,.prize-slot{min-width:60px;padding:.5rem;font-size:.8rem}.participant-name,.prize-name{font-size:.75rem}.results-container{padding:1rem}.result-card{padding:.75rem 1rem}}@media(max-width:480px){.amidakuji-participants,.amidakuji-prizes{flex-wrap:wrap;gap:.5rem;justify-content:center}.participant-header,.prize-slot{flex:1;min-width:calc(33% - .5rem);max-width:calc(33% - .5rem)}}.kanji-writing-tool{position:relative;min-height:100vh;background:var(--tool-bg-light);padding:2rem;overflow:hidden}.kanji-writing-tool .tool-container{position:relative;z-index:1;max-width:1200px;margin:0 auto;background:#fff;border-radius:var(--tool-radius-lg);padding:3rem;box-shadow:0 10px 40px #0000001a}.kanji-writing-tool .tool-header{text-align:center;color:var(--tool-text-dark);margin-bottom:2rem}.kanji-writing-tool .tool-title{font-size:2rem;margin-bottom:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.5rem}.kanji-writing-tool .tool-title svg{font-size:2rem;color:#ec6c00}.kanji-writing-tool .tool-header p{font-size:1rem;color:var(--tool-text-medium);line-height:1.6}.kanji-writing-tool__container{display:grid;grid-template-columns:400px 1fr;gap:2rem;align-items:start}.kanji-writing-tool__controls{background:var(--tool-bg-white);border-radius:var(--tool-radius-lg);padding:1.2rem}.kanji-writing-tool__control-section{margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px solid var(--tool-border)}.kanji-writing-tool__control-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.kanji-writing-tool__control-section h2{font-size:.95rem;margin-bottom:.75rem;color:var(--tool-text-dark);display:flex;align-items:center;gap:.4rem;font-weight:600}.kanji-writing-tool__control-section h2 svg{font-size:1.1rem;color:var(--tool-primary)}.kanji-writing-tool__size-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.kanji-writing-tool__size-btn{padding:.75rem .5rem;background:#fff;border:2px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-weight:600;font-size:1rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif;display:flex;flex-direction:column;align-items:center;gap:.25rem}.kanji-writing-tool__size-btn .size-info{font-size:.7rem;font-weight:400;color:var(--tool-text-medium)}.kanji-writing-tool__size-btn:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.kanji-writing-tool__size-btn.active{border-color:var(--tool-primary);background:var(--tool-primary-light);color:var(--tool-primary)}.kanji-writing-tool__size-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--tool-bg-light)}.kanji-writing-tool__size-btn:disabled:hover{border-color:var(--tool-border);transform:none}.kanji-writing-tool__preset-select{width:100%;padding:.6rem .8rem;border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-size:.9rem;font-family:Noto Sans JP,sans-serif;background:#fff;cursor:pointer;transition:all .3s}.kanji-writing-tool__preset-select:hover{border-color:var(--tool-primary);box-shadow:0 2px 8px #4c90e21a}.kanji-writing-tool__preset-select:focus{outline:none;border-color:var(--tool-primary);box-shadow:0 0 0 3px #4c90e21a}.kanji-writing-tool__preset-selects{display:flex;flex-direction:column;gap:.75rem}.kanji-writing-tool__preset-row{display:flex;flex-direction:column;gap:.35rem}.kanji-writing-tool__preset-label{font-size:.8rem;font-weight:600;color:var(--tool-text-medium)}.kanji-writing-tool__preset-info{font-size:.8rem;color:var(--tool-text-medium);background:var(--tool-bg-light);padding:.5rem .75rem;border-radius:var(--tool-radius-sm)}.kanji-writing-tool__layout-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.kanji-writing-tool__layout-btn{padding:.75rem .5rem;background:#fff;border:2px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-weight:600;font-size:.95rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif}.kanji-writing-tool__layout-btn:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.kanji-writing-tool__layout-btn.active{border-color:var(--tool-primary);background:var(--tool-primary-light);color:var(--tool-primary)}.kanji-writing-tool__list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.kanji-writing-tool__list-header h2{margin-bottom:0}.kanji-writing-tool__add-btn{display:flex;align-items:center;gap:.3rem;padding:.5rem 1rem;background:var(--tool-success);color:#fff;border:none;border-radius:var(--tool-radius-sm);font-weight:600;font-size:.85rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif}.kanji-writing-tool__add-btn:hover:not(:disabled){background:#45b068;transform:translateY(-2px)}.kanji-writing-tool__add-btn:disabled{background:#ccc;cursor:not-allowed;opacity:.6}.kanji-writing-tool__kanji-items{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1rem;max-height:none;overflow-y:auto}.kanji-writing-tool__kanji-item{background:var(--tool-bg-light);border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);padding:.7rem;transition:all .3s}.kanji-writing-tool__kanji-item:hover{border-color:var(--tool-primary);box-shadow:0 2px 8px #667eea1a}.kanji-writing-tool__item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.kanji-writing-tool__item-number{font-weight:600;color:var(--tool-primary);font-size:.75rem}.kanji-writing-tool__delete-btn{background:none;border:none;color:var(--tool-error);cursor:pointer;padding:.2rem;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .3s}.kanji-writing-tool__delete-btn:hover:not(:disabled){background:#e74c3c1a;transform:scale(1.1)}.kanji-writing-tool__delete-btn:disabled{opacity:.3;cursor:not-allowed}.kanji-writing-tool__item-content{display:grid;grid-template-columns:110px 1fr;gap:.5rem;align-items:center}.kanji-writing-tool__item-right{display:flex;flex-direction:column;gap:.4rem}.kanji-writing-tool__english-row{display:flex;gap:.3rem;align-items:center}.kanji-writing-tool__speak-btn{flex-shrink:0;background:var(--tool-primary);color:#fff;border:none;border-radius:var(--tool-radius-sm);width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s}.kanji-writing-tool__speak-btn:hover{background:var(--tool-primary-hover);transform:scale(1.1)}.kanji-writing-tool__kanji-section{display:flex;flex-direction:column;gap:.4rem;align-items:stretch}.kanji-writing-tool__kanji-section .kanji-writing-tool__input--kanji{flex:1}.kanji-writing-tool__fetch-btn{background:var(--tool-primary);color:#fff;border:none;border-radius:var(--tool-radius-sm);height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s;padding:0 .8rem;gap:.3rem;font-size:.75rem;white-space:nowrap}.kanji-writing-tool__fetch-btn:hover:not(:disabled){background:var(--tool-primary-hover);transform:scale(1.02)}.kanji-writing-tool__fetch-btn:disabled{background:var(--tool-disabled);cursor:not-allowed;opacity:.6}.kanji-writing-tool__input--pronunciation{font-size:.8rem;color:var(--tool-text-medium);font-style:italic}.kanji-writing-tool__input{width:100%;padding:.4rem .5rem;border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-size:.85rem;font-family:Noto Sans JP,sans-serif;transition:all .3s}.kanji-writing-tool__input:focus{outline:none;border-color:var(--tool-primary);box-shadow:0 0 0 3px var(--tool-primary-light)}.kanji-writing-tool__input:hover{border-color:var(--tool-primary)}.kanji-writing-tool__input--kanji{font-size:2rem;text-align:center;font-weight:700;padding:.5rem;height:70px;display:flex;align-items:center;justify-content:center}.kanji-writing-tool__actions{display:flex;flex-direction:row;gap:.75rem;margin-top:1rem}.kanji-writing-tool__btn--primary{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem 1.5rem;background:var(--tool-primary);color:#fff;border:none;border-radius:var(--tool-radius-sm);font-weight:600;font-size:.95rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif}.kanji-writing-tool__btn--primary:hover{background:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:var(--tool-shadow-strong)}.kanji-writing-tool__btn--secondary{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem 1.5rem;background:var(--tool-bg-light);color:var(--tool-text-medium);border:2px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-weight:500;font-size:.95rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif}.kanji-writing-tool__btn--secondary:hover{background:var(--tool-border);color:var(--tool-text-dark);transform:translateY(-2px)}.kanji-writing-tool__preview{background:var(--tool-bg-light);border-radius:var(--tool-radius-lg);padding:1.5rem;display:flex;flex-direction:column}.kanji-writing-tool__canvas-container{display:flex;justify-content:center;align-items:center;background:#e5e5e5;border-radius:var(--tool-radius-sm);padding:1.5rem;flex:1;min-height:600px}.kanji-writing-tool__canvas{max-width:100%;max-height:100%;box-shadow:0 4px 20px #00000026;background:#fff;border-radius:4px}@media(max-width:1024px){.kanji-writing-tool__container{grid-template-columns:1fr}.kanji-writing-tool__actions{flex-direction:row}}@media(max-width:640px){.kanji-writing-tool{padding:1rem}.kanji-writing-tool .tool-container{padding:2rem 1.5rem}.kanji-writing-tool .tool-title{font-size:1.6rem}.kanji-writing-tool .tool-header p{font-size:.95rem}.kanji-writing-tool__controls,.kanji-writing-tool__preview{padding:1rem}.kanji-writing-tool__actions{flex-direction:column;width:100%}.kanji-writing-tool__btn--primary,.kanji-writing-tool__btn--secondary{width:100%}.kanji-writing-tool__canvas-container{padding:1rem;min-height:400px}.kanji-writing-tool__size-buttons{grid-template-columns:1fr}.kanji-writing-tool__kanji-items{max-height:none}.kanji-writing-tool__item-content{grid-template-columns:1fr;gap:.6rem}.kanji-writing-tool__kanji-section,.kanji-writing-tool__item-right{grid-column:1 / -1}}.learning-test-tool{position:relative;min-height:100vh;background:var(--tool-bg-light);padding:2rem;overflow:hidden}.learning-test-tool .tool-container{position:relative;z-index:1;max-width:1200px;margin:0 auto;background:#fff;border-radius:var(--tool-radius-lg);padding:3rem;box-shadow:0 10px 40px #0000001a}.learning-test-tool .tool-header{text-align:center;color:var(--tool-text-dark);margin-bottom:2rem}.learning-test-tool .tool-title{font-size:2rem;margin-bottom:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.5rem}.learning-test-tool .tool-title svg{font-size:2rem;color:#ec6c00}.learning-test-tool .tool-header p{font-size:1rem;color:var(--tool-text-medium);line-height:1.6}.learning-test-tool__container{display:grid;grid-template-columns:400px 1fr;gap:2rem;align-items:start}.learning-test-tool__controls{background:var(--tool-bg-white);border-radius:var(--tool-radius-lg);padding:1.2rem;height:fit-content;position:sticky;top:100px}.learning-test-tool__control-section{margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px solid var(--tool-border)}.learning-test-tool__control-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.learning-test-tool__control-section h2{font-size:.95rem;margin-bottom:.75rem;color:var(--tool-text-dark);display:flex;align-items:center;gap:.4rem;font-weight:600}.learning-test-tool__control-section h2 svg{font-size:1.1rem;color:var(--tool-primary)}.learning-test-tool__mode-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.learning-test-tool__mode-btn{padding:.75rem .5rem;background:#fff;border:2px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif}.learning-test-tool__mode-btn:hover{border-color:var(--tool-primary);transform:translateY(-2px)}.learning-test-tool__mode-btn.active{border-color:var(--tool-primary);background:var(--tool-primary-light);color:var(--tool-primary)}.learning-test-tool__preset-selects{display:flex;flex-direction:column;gap:.75rem}.learning-test-tool__preset-row{display:flex;flex-direction:column;gap:.35rem}.learning-test-tool__preset-label{font-size:.8rem;font-weight:600;color:var(--tool-text-medium)}.learning-test-tool__preset-select{width:100%;padding:.6rem .8rem;border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);font-size:.9rem;font-family:Noto Sans JP,sans-serif;background:#fff;cursor:pointer;transition:all .3s}.learning-test-tool__preset-select:hover{border-color:var(--tool-primary);box-shadow:0 2px 8px #4c90e21a}.learning-test-tool__preset-select:focus{outline:none;border-color:var(--tool-primary);box-shadow:0 0 0 3px #4c90e21a}.learning-test-tool__preset-info{font-size:.8rem;color:var(--tool-text-medium);background:var(--tool-bg-light);padding:.5rem .75rem;border-radius:var(--tool-radius-sm)}.learning-test-tool__setting-row{margin-bottom:.75rem}.learning-test-tool__setting-label{font-size:.8rem;font-weight:600;color:var(--tool-text-medium);display:block;margin-bottom:.35rem}.learning-test-tool__checkbox-group{margin-bottom:.75rem}.learning-test-tool__checkbox-label{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--tool-text-dark);cursor:pointer;-webkit-user-select:none;user-select:none}.learning-test-tool__checkbox-label input[type=checkbox]{cursor:pointer;width:16px;height:16px}.learning-test-tool__button-section{display:flex;flex-direction:column;gap:.75rem}.learning-test-tool__generate-btn,.learning-test-tool__download-btn,.learning-test-tool__reset-btn{padding:.8rem;border:none;border-radius:var(--tool-radius-sm);font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s;font-family:Noto Sans JP,sans-serif;display:flex;align-items:center;justify-content:center;gap:.4rem}.learning-test-tool__generate-btn{background:var(--tool-primary);color:#fff}.learning-test-tool__generate-btn:hover{background:var(--tool-primary-hover);transform:translateY(-2px);box-shadow:0 4px 12px #1e75d34d}.learning-test-tool__download-btn{background:var(--tool-success);color:#fff}.learning-test-tool__download-btn:hover:not(:disabled){background:#40a860;transform:translateY(-2px);box-shadow:0 4px 12px #50c8784d}.learning-test-tool__download-btn:disabled{background:var(--tool-bg-light);color:var(--tool-text-light);cursor:not-allowed}.learning-test-tool__reset-btn{background:var(--tool-warning);color:#fff}.learning-test-tool__reset-btn:hover{background:#d88a0c;transform:translateY(-2px);box-shadow:0 4px 12px #f39c124d}.learning-test-tool__preview{background:var(--tool-bg-light);border-radius:var(--tool-radius-lg);padding:1.5rem}.learning-test-tool__preview h2{font-size:1.1rem;margin-bottom:1rem;color:var(--tool-text-dark);font-weight:600}.learning-test-tool__canvas-container{background:#fff;border:1px solid var(--tool-border);border-radius:var(--tool-radius-md);padding:1rem;overflow:auto;max-height:800px;box-shadow:inset 0 2px 4px #0000000d}.learning-test-tool__canvas{display:block;margin:0 auto;max-width:100%}@media(max-width:1024px){.learning-test-tool__container{grid-template-columns:1fr}.learning-test-tool__controls{position:static}}@media(max-width:768px){.learning-test-tool .tool-container{padding:1.5rem}.learning-test-tool .tool-title{font-size:1.5rem}.learning-test-tool__mode-buttons{grid-template-columns:1fr}.learning-test-tool__preview{padding:1rem}.learning-test-tool__canvas-container{max-height:600px}}.color-quiz{position:relative;min-height:100vh;background:var(--tool-bg-light);padding:2rem;overflow:hidden}.color-quiz .tool-container{position:relative;z-index:1;max-width:900px;margin:0 auto;background:#fff;border-radius:var(--tool-radius-lg);padding:3rem;box-shadow:0 10px 40px #0000001a}.color-quiz .tool-header{text-align:center;color:var(--tool-text-dark);margin-bottom:2rem}.color-quiz .tool-title{font-size:2rem;margin-bottom:.75rem;font-weight:700;color:var(--tool-text-dark)}.color-quiz .tool-header p{font-size:1rem;color:var(--tool-text-medium);line-height:1.6}.color-quiz__content{display:flex;flex-direction:column;gap:2rem}.color-quiz__mode-selector{display:flex;gap:1rem;justify-content:center;margin-bottom:1rem;padding:1rem;background:#f5f5f5;border-radius:var(--tool-radius);flex-wrap:wrap}.color-quiz__mode-btn{padding:.75rem 1.5rem;font-size:1rem;font-weight:600;color:var(--tool-text-medium);background:#fff;border:2px solid #e0e0e0;border-radius:var(--tool-radius);cursor:pointer;transition:all .3s ease}.color-quiz__mode-btn:hover:not(:disabled){border-color:#ec6c00;color:#ec6c00}.color-quiz__mode-btn--active{color:#fff;background:linear-gradient(135deg,#ec6c00,#ffb84d);border-color:#ec6c00}.color-quiz__mode-btn:disabled{opacity:.5;cursor:not-allowed}.color-quiz__start-btn{display:block;margin:2rem auto;padding:1rem 3rem;font-size:1.2rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#ec6c00,#ffb84d);border:none;border-radius:var(--tool-radius);cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ec6c004d}.color-quiz__start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ec6c0066}.color-quiz__counter{font-size:1rem;color:var(--tool-text-medium);text-align:center}.color-quiz__counter-value{font-weight:700;color:var(--tool-text-dark);font-size:1.2rem}.color-quiz__color-display{width:150px;height:150px;margin:0 auto;border-radius:var(--tool-radius-lg);box-shadow:0 4px 15px #00000026;transition:box-shadow .3s ease}.color-quiz__color-display:hover{box-shadow:0 6px 20px #0003}.color-quiz__answers{display:flex;flex-direction:column;gap:1rem}.color-quiz__answer-label{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid #e0e0e0;border-radius:var(--tool-radius);cursor:pointer;transition:all .2s ease;font-size:1.1rem}.color-quiz__answer-label:hover{border-color:#ffb84d;background-color:#ffb84d0d}.color-quiz__radio{width:1.2rem;height:1.2rem;cursor:pointer;accent-color:#EC6C00;flex-shrink:0}.color-quiz__answer-text{color:var(--tool-text-dark);font-weight:500;flex:1}.color-quiz__question-text{font-size:1.3rem;font-weight:600;color:var(--tool-text-dark);text-align:center;margin:1rem 0}.color-quiz__question-color{color:#ec6c00;font-weight:700}.color-quiz__color-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;max-width:960px;margin:0 auto}.color-quiz__choice{display:flex;flex-direction:column;align-items:center;gap:.75rem}.color-quiz__color-block{width:100%;max-width:150px;aspect-ratio:1;background-color:gray;border-radius:var(--tool-radius);box-shadow:0 2px 8px #0000001a;transition:all .3s ease;cursor:pointer;border:3px solid transparent}.color-quiz__color-block:hover{box-shadow:0 4px 12px #00000026;transform:scale(1.05)}.color-quiz__color-block--correct{border:5px solid black}.color-quiz__choice-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.95rem;color:var(--tool-text-medium)}.color-quiz__choice-text{font-weight:500}.color-quiz__submit-btn{padding:1rem 2rem;font-size:1.1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#ec6c00,#ffb84d);border:none;border-radius:var(--tool-radius);cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ec6c004d;margin-top:1rem}.color-quiz__submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #ec6c0066}.color-quiz__submit-btn:disabled{opacity:.5;cursor:not-allowed}.color-quiz__message{text-align:center;font-size:1.2rem;font-weight:600;padding:1rem;border-radius:var(--tool-radius);animation:fadeIn .3s ease}.color-quiz__result{display:flex;flex-direction:column;gap:2rem;text-align:center;padding:2rem 0}.color-quiz__result-message{font-size:1.5rem;font-weight:700;color:var(--tool-text-dark);line-height:1.8;padding:2rem;background:linear-gradient(135deg,#ec6c000d,#ffb84d0d);border-radius:var(--tool-radius-lg);border-left:5px solid #EC6C00}.color-quiz__reset-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 2rem;font-size:1.1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#ec6c00,#ffb84d);border:none;border-radius:var(--tool-radius);cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ec6c004d;margin-top:1rem}.color-quiz__reset-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ec6c0066}.color-quiz__reset-btn svg{font-size:1.3rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.color-quiz .tool-container{padding:2rem 1.5rem}.color-quiz .tool-title{font-size:1.5rem}.color-quiz__mode-selector{flex-direction:column;gap:.5rem}.color-quiz__mode-btn{flex:1}.color-quiz__color-display{width:120px;height:120px}.color-quiz__answer-label{font-size:1rem;padding:.75rem}.color-quiz__color-choices{grid-template-columns:repeat(2,1fr);gap:1rem}.color-quiz__color-block{max-width:100%}.color-quiz__submit-btn,.color-quiz__reset-btn{padding:.75rem 1.5rem;font-size:1rem}.color-quiz__result-message{font-size:1.2rem;padding:1.5rem}}@media(max-width:480px){.color-quiz .tool-container{padding:1.5rem 1rem}.color-quiz .tool-title{font-size:1.3rem}.color-quiz__question-text{font-size:1.1rem}.color-quiz__mode-selector{padding:.75rem}.color-quiz__mode-btn{padding:.6rem 1rem;font-size:.9rem}}
