:root{--surface:#ffffffeb;--surface-strong:#fff;--surface-soft:#f8fbff;--border:#091e421f;--text:#172b4d;--muted:#5e6c84;--primary:#0052cc;--primary-soft:#0052cc1a;--secondary:#36b37e;--shadow:0 24px 60px #091e421f, inset 0 1px 0 #ffffffb8;color:var(--text);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(#f8fbff 0%,#eef2f8 100%);font-family:IBM Plex Sans JP,Noto Sans JP,Hiragino Sans,Yu Gothic,sans-serif}*{box-sizing:border-box}body{min-height:100vh;color:inherit;background:linear-gradient(#f8fbff 0%,#eef2f8 100%);margin:0}button,code,textarea{font:inherit}button,textarea{-webkit-tap-highlight-color:transparent;touch-action:manipulation}#root{min-height:100vh}.skipLink{z-index:20;color:#fff;background:#091e42;border-radius:12px;padding:10px 14px;text-decoration:none;transition:top .18s;position:absolute;top:-48px;left:16px}.skipLink:focus-visible{top:16px}.appShell{width:min(1180px,100% - 32px);margin:0 auto;padding:36px 0 56px}.heroSection,.workspaceSection,.supportCard{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:28px;animation:.65s both riseIn}.heroSection{gap:18px;padding:30px;display:grid}.workspaceSection{margin-top:24px;padding:28px;animation-delay:80ms}.heroTag{background:var(--primary-soft);width:fit-content;color:var(--primary);border-radius:999px;align-items:center;gap:8px;padding:8px 12px;font-size:.86rem;font-weight:700;display:inline-flex}h1,h2,h3,p,ul,li{margin:0}h1,h2,h3{text-wrap:balance;scroll-margin-top:24px}p,li{text-wrap:pretty}h1{letter-spacing:-.03em;max-width:12ch;font-size:clamp(2.2rem,4.8vw,4.4rem);line-height:.98}.lead,.workspaceHeader p,.supportCard p,.supportList{max-width:720px;color:var(--muted);font-size:1.02rem;line-height:1.9}.heroMeta{flex-wrap:wrap;gap:12px;display:flex}.heroMetaCard{border:1px solid var(--border);background:var(--surface-strong);border-radius:18px;min-width:180px;padding:14px 16px}.heroMetaCard strong{font-size:1rem;display:block}.heroMetaCard span{color:var(--muted);margin-top:6px;font-size:.92rem;line-height:1.6;display:block}.workspaceHeader{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.workspaceHeaderContent{min-width:0}.workspaceHeader h2{font-size:clamp(1.4rem,2vw,1.9rem)}.workspaceHeader p{max-width:620px;margin-top:10px;line-height:1.8}code{color:#24406c;background:#091e420f;border-radius:999px;padding:2px 8px}.statusCard{min-width:min(100%,300px);color:var(--text);background:linear-gradient(135deg,#0052cc1a,#36b37e1f);border-radius:20px;gap:6px;padding:18px;display:grid}.statusCard strong{font-size:1rem}.statusCard span{color:#344563;font-size:.94rem;line-height:1.7}.workspaceBody{grid-template-columns:minmax(0,1fr) 180px minmax(0,1fr);gap:18px;margin-top:24px;display:grid}.panelCard{border:1px solid var(--border);background:var(--surface-strong);border-radius:24px;gap:12px;min-width:0;padding:20px;transition:border-color .2s,box-shadow .2s;display:grid}.panelCard:focus-within{box-shadow:0 0 0 4px #0052cc14, var(--shadow);border-color:#0052cc4d}.panelCardHeader{justify-content:space-between;align-items:center;gap:12px;display:flex}.editorLabel{color:var(--text);cursor:pointer;font-size:1rem;font-weight:700;display:inline-block}.miniLabel{color:var(--muted);font-size:.86rem}.statusChip,.featureChip{border:1px solid var(--border);background:#ffffffd6;border-radius:999px;padding:9px 12px;font-size:.86rem;font-weight:600}.editorArea{resize:none;background:var(--surface-soft);min-height:320px;color:var(--text);border:1px solid #091e4224;border-radius:20px;padding:18px;line-height:1.9;transition:border-color .2s,box-shadow .2s}.editorArea::placeholder{color:#6b778c}.editorArea:focus-visible{border-color:#0052ccb8;outline:none;box-shadow:0 0 0 4px #0052cc1f}.resultArea{background:linear-gradient(#f4f7fceb,#fffffff2)}.panelFooter{color:var(--muted);justify-content:space-between;align-items:flex-start;gap:12px;font-size:.88rem;display:flex}.panelFooter span:last-child,.statusChip{font-variant-numeric:tabular-nums}.actionsPanel{align-content:center;gap:12px;display:grid}.actionButton{cursor:pointer;border:1px solid #0000;border-radius:16px;padding:14px 16px;font-weight:700;transition:transform .18s,box-shadow .18s,background-color .18s,border-color .18s}.actionButton:hover:not(:disabled){transform:translateY(-2px)}.actionButton:focus-visible{outline:none;box-shadow:0 0 0 4px #0052cc24}.actionPrimary{background:var(--primary);color:#fff;box-shadow:0 14px 24px #0052cc2e}.actionSecondary{background:var(--secondary);color:#0f1f1a;box-shadow:0 14px 24px #36b37e2e}.actionGhost{border-color:var(--border);color:var(--text);background:#091e420a}.actionButton:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.supportGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:24px;display:grid}.supportCard{min-width:0;padding:22px}.supportCard h3{font-size:1.05rem}.supportCard p{margin-top:10px;line-height:1.8}.supportList{margin-top:14px;padding-left:1.2rem;line-height:1.8}.chipRow{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}@media (width<=900px){.workspaceHeader{flex-direction:column}.statusCard{width:100%}.workspaceBody{grid-template-columns:1fr}.actionsPanel{align-content:initial;grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.appShell{width:min(100% - 20px,1180px);padding-top:20px;padding-bottom:32px}.heroSection,.workspaceSection,.supportCard{border-radius:22px;padding:20px}h1{max-width:none;font-size:clamp(2rem,9vw,3rem)}.actionsPanel,.supportGrid{grid-template-columns:1fr}.actionButton{width:100%}.panelFooter{flex-direction:column}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@keyframes riseIn{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
