﻿.text-tools-container{max-width:1000px;margin:2rem auto 4rem;padding:1.5rem 1.5rem 3rem;background:linear-gradient(180deg, #fbfdff 0%, #f6f7fb 100%);border-radius:20px;border:1px solid rgba(148,163,184,0.35);box-shadow:0 20px 40px rgba(15,23,42,0.08);position:relative;overflow:hidden;color:#0f172a;font-family:'IBM Plex Sans JP', 'Noto Sans JP', sans-serif}.text-tools-container::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 20%, rgba(56,189,248,0.12), transparent 55%),radial-gradient(circle at 80% 0%, rgba(249,115,22,0.15), transparent 45%),radial-gradient(circle at 80% 80%, rgba(59,130,246,0.1), transparent 50%);pointer-events:none;opacity:0.9;z-index:0}.text-tools-container>*{position:relative;z-index:1}.text-tools-container h1,.text-tools-container h2,.text-tools-container h3{font-family:'M PLUS 1p', 'M PLUS Rounded 1c', sans-serif}.overview-section{margin-bottom:2.5rem;padding:2.5rem 2rem;border-radius:18px;background:linear-gradient(135deg, rgba(255,247,237,0.9), rgba(239,246,255,0.9));border:1px solid rgba(191,219,254,0.6);position:relative;overflow:hidden;z-index:1;animation:rise 0.6s ease both}.overview-section::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 15% 15%, rgba(14,116,144,0.08), transparent 55%),radial-gradient(circle at 85% 20%, rgba(249,115,22,0.1), transparent 50%);pointer-events:none;opacity:0.9;z-index:0}.hero-content{position:relative;z-index:1;text-align:left;max-width:780px;margin:0 auto}.hero-content h1{font-size:2.6rem;color:#0f172a;margin:0.5rem 0 1rem;font-weight:700}.hero-content .description{color:#475569;font-size:1.1rem;line-height:1.7;margin-bottom:1.5rem}.hero-kicker{font-size:0.85rem;letter-spacing:0.08em;text-transform:uppercase;color:#0e7490;font-weight:700}.hero-list{list-style:none;margin:0 0 1.5rem;padding:0;display:grid;gap:0.5rem}.hero-list li{position:relative;padding-left:1.5rem;color:#334155;font-size:0.95rem}.hero-list li::before{content:'✔';position:absolute;left:0;top:0.05rem;color:#0ea5e9;font-weight:700}.hero-actions{display:flex;flex-wrap:wrap;gap:0.75rem;align-items:center;margin-bottom:1.5rem}.overview-links{position:relative;z-index:1;display:flex;justify-content:center;gap:0.75rem;margin-top:2rem;flex-wrap:wrap}.overview-link{text-decoration:none;font-weight:600;color:#2563eb;padding:0.4rem 0.9rem;border-radius:999px;border:1px solid rgba(37,99,235,0.25);background:rgba(255,255,255,0.8);transition:all 0.2s ease}.overview-link:hover{background:rgba(37,99,235,0.12);border-color:rgba(37,99,235,0.5)}.guide-section,.use-cases-section{position:relative;z-index:1;margin-bottom:2.5rem;padding:2rem;background:rgba(255,255,255,0.85);border-radius:16px;border:1px solid rgba(226,232,240,0.9);box-shadow:0 12px 24px rgba(15,23,42,0.04);scroll-margin-top:120px;animation:rise 0.6s ease both}.section-lead{color:#475569;margin:0.5rem 0 1.5rem}.guide-grid,.use-cases-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr))}.guide-card,.use-case-card{background:white;border-radius:12px;border:1px solid rgba(226,232,240,0.9);padding:1.25rem;box-shadow:0 8px 18px rgba(15,23,42,0.04)}.guide-card h3,.use-case-card h3{margin-top:0;color:#1e3a8a;font-size:1.05rem}.guide-card p,.use-case-card p{margin-bottom:0;color:#475569;font-size:0.92rem}.tools-section{display:flex;flex-direction:column;gap:2.5rem;position:relative;z-index:1}.tool-section{background:rgba(255,255,255,0.92);border-radius:16px;padding:2rem;border:1px solid rgba(226,232,240,0.9);box-shadow:0 16px 30px rgba(15,23,42,0.06);scroll-margin-top:120px;animation:rise 0.6s ease both}.tool-section h2{color:#0f172a;font-size:1.5rem;margin-bottom:0.75rem;font-weight:600;display:flex;align-items:center;gap:0.5rem}.tool-lead{margin:0 0 1.5rem;color:#475569;font-size:0.95rem}.tool-grid{display:grid;gap:1.5rem}.tool-action-row{display:flex;flex-wrap:wrap;gap:0.75rem;align-items:center}.tool-actions{display:flex;flex-wrap:wrap;gap:0.5rem}.tool-actions .btn{padding:0.6rem 1.3rem;font-size:0.9rem}.section-spacer{height:3rem}.tools-navigation{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:1rem;margin-top:2.5rem;position:relative;z-index:1}.nav-tool-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:rgba(255,255,255,0.92);border:1px solid rgba(148,163,184,0.4);border-radius:14px;text-decoration:none;color:inherit;transition:all 0.2s ease;box-shadow:0 10px 22px rgba(15,23,42,0.06);animation:float-in 0.6s ease both}.nav-tool-card:hover{border-color:rgba(37,99,235,0.4);background:rgba(239,246,255,0.8);transform:translateY(-2px);box-shadow:0 16px 30px rgba(37,99,235,0.12)}.nav-tool-card:active{transform:translateY(0)}.nav-tool-card.active{border-color:rgba(37,99,235,0.7);background:rgba(219,234,254,0.9);box-shadow:0 12px 26px rgba(37,99,235,0.2)}.nav-tool-card.active .nav-icon{background:rgba(191,219,254,0.8);transform:scale(1.1)}.nav-tool-card:focus-visible,.overview-link:focus-visible{outline:2px solid rgba(37,99,235,0.7);outline-offset:3px}.nav-icon{font-size:2rem;flex-shrink:0;width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;background:rgba(239,246,255,0.9);border-radius:50%;border:1px solid rgba(191,219,254,0.8)}.nav-content{flex:1}.nav-content h3{margin:0 0 0.25rem 0;font-size:1rem;font-weight:600;color:#1e3a8a}.nav-content p{margin:0;font-size:0.85rem;color:var(--text-secondary, #6b7280);line-height:1.3}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:0.5rem;font-weight:500;color:var(--text-primary, #1f2937);font-size:0.9rem}.form-group-label{display:block;margin-bottom:0.5rem;font-weight:600;color:#1f2937;font-size:0.9rem}.checkbox-grid{display:grid;gap:0.5rem;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr))}.checkbox-option{display:flex;align-items:center;gap:0.5rem;padding:0.6rem 0.8rem;border-radius:10px;border:1px solid rgba(226,232,240,0.9);background:rgba(248,250,252,0.9);font-size:0.85rem;color:#334155}.inline-fields{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr))}.inline-field label{margin-bottom:0.4rem}.form-group input,.form-group textarea,.form-group select{width:100%;padding:0.75rem;border:1px solid var(--border-secondary, #d1d5db);border-radius:6px;font-size:1rem;background:white;transition:border-color 0.2s ease}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--primary-500, #3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,0.1)}.form-group input[type='checkbox'],.form-group input[type='radio']{accent-color:#2563eb}.form-group textarea{min-height:120px;resize:vertical;font-family:'Courier New', monospace;line-height:1.5}.form-group select{cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 0.75rem center;background-repeat:no-repeat;background-size:16px 16px;padding-right:2.5rem}.radio-group{display:flex;flex-direction:column;gap:1rem;margin-top:0.5rem}.radio-option{display:flex;align-items:center;gap:1rem;padding:1rem;border:2px solid var(--border-secondary, #d1d5db);border-radius:8px;background:white;cursor:pointer;transition:all 0.2s ease}.radio-option:hover{border-color:var(--primary-300, #93c5fd);background:var(--primary-25, #f8faff)}.radio-option:has(.radio-input-hidden:checked){border-color:var(--primary-500, #3b82f6);background:var(--primary-50, #eff6ff);box-shadow:0 0 0 1px var(--primary-500, #3b82f6)}.radio-input-hidden{position:absolute;opacity:0;width:0;height:0;margin:0;cursor:pointer}.radio-label{flex:1;cursor:pointer}.radio-label strong{color:var(--text-primary, #1f2937);font-size:1rem;display:block;margin-bottom:0.25rem}.radio-label small{color:var(--text-secondary, #6b7280);font-size:0.85rem;line-height:1.4}.form-hint{display:block;margin-top:0.5rem;font-size:0.8rem;color:var(--text-tertiary, #9ca3af);font-style:italic}.form-error{margin-top:0.75rem;padding:0.75rem 1rem;border-radius:10px;background:rgba(239,68,68,0.12);border:1px solid rgba(239,68,68,0.25);color:#b91c1c;font-size:0.9rem;font-weight:600}.btn{display:inline-block;padding:0.75rem 2rem;background:linear-gradient(135deg, #2563eb, #1d4ed8);color:white;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;text-decoration:none;box-shadow:0 12px 24px rgba(37,99,235,0.2)}.btn:hover{background:linear-gradient(135deg, #1d4ed8, #1e40af);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-secondary{background:linear-gradient(135deg, #0ea5e9, #0284c7);box-shadow:0 10px 20px rgba(14,165,233,0.2)}.btn-secondary:hover{background:linear-gradient(135deg, #0284c7, #0369a1)}.btn-ghost{background:transparent;color:#2563eb;border:1px solid rgba(37,99,235,0.4);box-shadow:none}.btn-ghost:hover{background:rgba(37,99,235,0.12);color:#1e40af}.result-box{margin-top:2rem;background:rgba(248,250,252,0.95);border:1px solid rgba(226,232,240,0.9);border-radius:14px;padding:1.5rem;box-shadow:0 10px 22px rgba(15,23,42,0.05)}.result-box h3{color:var(--primary-600, #2563eb);margin-bottom:1rem;font-size:1.2rem;display:flex;align-items:center;justify-content:space-between}.result-box pre{background:var(--bg-tertiary, #f1f5f9);border:1px solid var(--border-secondary, #d1d5db);border-radius:4px;padding:1rem;white-space:pre-wrap;word-wrap:break-word;font-family:'Courier New', monospace;font-size:0.9rem;line-height:1.4;max-height:300px;overflow-y:auto}.result-box.wide{grid-column:1 / -1}.result-summary{margin-bottom:0.75rem}.summary-chips{display:flex;flex-wrap:wrap;gap:0.5rem}.summary-chip{padding:0.35rem 0.75rem;border-radius:999px;background:rgba(14,165,233,0.12);color:#0f172a;font-size:0.8rem;font-weight:600;border:1px solid rgba(14,165,233,0.2)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));gap:1rem}.stat-item{background:white;border:1px solid var(--border-primary, #e2e8f0);border-radius:6px;padding:1rem;text-align:center}.stat-item .stat-label{font-size:0.85rem;color:var(--text-secondary, #6b7280);margin-bottom:0.5rem;display:block}.stat-item .stat-value{font-size:1.5rem;font-weight:700;color:var(--primary-600, #2563eb);display:block}.regex-examples{margin-bottom:1.5rem}.regex-examples h4{margin-bottom:0.75rem;color:var(--text-primary, #1f2937);font-size:1rem}.regex-example-buttons{display:flex;flex-wrap:wrap;gap:0.5rem}.regex-example-btn{background:var(--bg-tertiary, #f1f5f9);border:1px solid var(--border-secondary, #d1d5db);border-radius:4px;padding:0.5rem 1rem;font-size:0.85rem;cursor:pointer;transition:all 0.2s ease}.regex-example-btn:hover{background:var(--primary-50, #eff6ff);border-color:var(--primary-300, #93c5fd);color:var(--primary-700, #1d4ed8)}.winmerge-container{margin-top:1rem;border:1px solid var(--border-primary, #e2e8f0);border-radius:6px;overflow:hidden}.winmerge-header{display:grid;grid-template-columns:1fr 60px 1fr;background:var(--bg-tertiary, #f1f5f9);border-bottom:1px solid var(--border-primary, #e2e8f0)}.winmerge-left-header,.winmerge-right-header{padding:0.75rem;font-size:0.9rem;font-weight:600;text-align:center;border-right:1px solid var(--border-primary, #e2e8f0)}.winmerge-right-header{border-right:none;border-left:1px solid var(--border-primary, #e2e8f0)}.winmerge-center-header{background:var(--bg-tertiary, #f1f5f9)}.winmerge-content{max-height:400px;overflow-y:auto;font-family:'Courier New', monospace;font-size:0.85rem}.winmerge-row{display:grid;grid-template-columns:1fr 60px 1fr;border-bottom:1px solid var(--border-secondary, #d1d5db)}.winmerge-left,.winmerge-right{padding:0.5rem;border-right:1px solid var(--border-secondary, #d1d5db);min-height:32px}.winmerge-left .line-number,.winmerge-right .line-number{color:var(--text-tertiary, #9ca3af);margin-right:0.5rem;font-size:0.8rem}.winmerge-right{border-right:none;border-left:1px solid var(--border-secondary, #d1d5db)}.winmerge-center{display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary, #f1f5f9);border-left:1px solid var(--border-secondary, #d1d5db);border-right:1px solid var(--border-secondary, #d1d5db)}.winmerge-added{background:rgba(34,197,94,0.1)}.winmerge-added .line-number{color:#059669;font-weight:600}.winmerge-deleted{background:rgba(239,68,68,0.1)}.winmerge-deleted .line-number{color:#dc2626;font-weight:600}.winmerge-modified{background:rgba(245,158,11,0.1)}.winmerge-modified .line-number{color:#d97706;font-weight:600}.winmerge-unchanged{background:white}.winmerge-missing{background:rgba(156,163,175,0.1)}.winmerge-missing .empty-line{font-style:italic;opacity:0.6;color:var(--text-tertiary, #9ca3af)}.char-diff-old{background:rgba(239,68,68,0.3);padding:1px 2px;border-radius:2px;font-weight:600}.char-diff-new{background:rgba(34,197,94,0.3);padding:1px 2px;border-radius:2px;font-weight:600}.diff-arrow-right{color:#059669;font-size:0.85rem}.diff-arrow-left{color:#dc2626;font-size:0.85rem}.diff-arrow-both{color:#d97706;font-size:0.85rem}.winmerge-left .line-content,.winmerge-right .line-content{flex:1;word-break:break-all;white-space:pre-wrap;font-family:'Courier New', monospace}.diff-stats{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.diff-stats .stat-item{background:var(--primary-50, #eff6ff);color:var(--primary-700, #1d4ed8);padding:0.5rem 1rem;border-radius:4px;font-size:0.85rem;font-weight:500}.copy-icon{color:var(--primary-600, #2563eb);cursor:pointer;padding:0.5rem;border-radius:4px;transition:all 0.2s ease}.copy-icon:hover{background:var(--primary-50, #eff6ff);color:var(--primary-700, #1d4ed8)}.copy-icon.success{color:var(--success, #10b981)}.toast{position:fixed;top:20px;right:20px;background:var(--success, #10b981);color:white;padding:1rem 1.5rem;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:1000;opacity:0;transform:translateX(100%);transition:all 0.3s ease}.toast.show{opacity:1;transform:translateX(0)}textarea.warning{border-color:var(--warning, #f59e0b);box-shadow:0 0 0 3px rgba(245,158,11,0.1)}.hidden{display:none}@media (min-width: 960px){.tool-grid{grid-template-columns:repeat(2, minmax(0, 1fr));align-items:start}.tool-grid .result-box{margin-top:0}}@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes float-in{from{opacity:0;transform:translateY(10px) scale(0.98)}to{opacity:1;transform:translateY(0) scale(1)}}.nav-tool-card:nth-child(1){animation-delay:0.05s}.nav-tool-card:nth-child(2){animation-delay:0.1s}.nav-tool-card:nth-child(3){animation-delay:0.15s}.nav-tool-card:nth-child(4){animation-delay:0.2s}.nav-tool-card:nth-child(5){animation-delay:0.25s}.nav-tool-card:nth-child(6){animation-delay:0.3s}@media (prefers-reduced-motion: reduce){.tool-section,.overview-section,.guide-section,.use-cases-section,.nav-tool-card{animation:none}}@media (max-width: 768px){.text-tools-container{margin:1rem;padding:1rem 1rem 2rem}.overview-section{padding:2rem 1.5rem}.hero-content h1{font-size:2.1rem}.hero-actions{flex-direction:column;align-items:stretch}.section-spacer{height:2rem}.tools-navigation{grid-template-columns:1fr;gap:0.75rem}.nav-tool-card{padding:0.75rem}.nav-tool-card .nav-icon{width:2.5rem;height:2.5rem;font-size:1.5rem}.nav-tool-card .nav-content h3{font-size:0.9rem}.nav-tool-card .nav-content p{font-size:0.8rem}.tool-section,.guide-section,.use-cases-section{padding:1.5rem}.tool-action-row{flex-direction:column;align-items:stretch}.tool-actions{width:100%}.tool-actions .btn{width:auto}.stats-grid{grid-template-columns:1fr}.winmerge-header{grid-template-columns:1fr}.winmerge-header .winmerge-left-header:first-child{border-bottom:1px solid var(--border-primary, #e2e8f0)}.winmerge-header .winmerge-right-header,.winmerge-header .winmerge-center-header{display:none}.winmerge-row{grid-template-columns:1fr}.winmerge-left,.winmerge-right{border-right:none;border-left:none}.winmerge-center{display:none}.btn{width:100%}.toast{left:20px;right:20px;transform:translateY(-100%)}.toast.show{transform:translateY(0)}}@media (max-width: 480px){.hero-content h1{font-size:1.9rem}.regex-example-buttons{justify-content:center}.regex-example-btn{flex:1;text-align:center;min-width:80px}}
