:root{--text:#142132;--muted:#546377;--bg:#e7edf2;--surface:#ffffffe6;--border:#94a3b84d;--accent-strong:#0f766e;--shadow-soft:0 20px 40px #0f172a14;--mono:"IBM Plex Mono", "Cascadia Code", "Cascadia Mono", Consolas, monospace;--sans:"Aptos", "Aptos Display", "Segoe UI Variable Display", "Segoe UI Variable Text", "Trebuchet MS", sans-serif;font-family:var(--sans);color:var(--text);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 0 0,#0e749014,#0000 25%),radial-gradient(circle at 100% 100%,#d977061a,#0000 26%),linear-gradient(#eef4f7,#e3e9ef);font-weight:400;line-height:1.4}*{box-sizing:border-box}html{scroll-behavior:smooth}body,h1,h2,h3,p,figure,pre{margin:0}a{color:inherit}#root{min-height:100vh}.app-shell{min-height:100vh;padding:24px}.hero,.part-panel,.builder-grid,.guide-panel,.status-grid,.panel{max-width:1360px;margin:0 auto 16px}.panel{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-soft);text-align:left;border-radius:22px}.hero,.part-panel,.workspace-panel,.preview-panel,.guide-panel,.status-panel,.code-panel,.panel:last-child{padding:20px}.hero{background:radial-gradient(circle at 0 0,#0f766e29,#0000 34%),radial-gradient(circle at 100% 100%,#d9770629,#0000 32%),linear-gradient(145deg,#fffffffa,#f4f8fcf5)}.hero-topbar,.hero-body,.hero-actions,.panel-heading,.example-actions,.example-buttons,.planner-footer{align-items:center;gap:12px;display:flex}.hero-topbar,.panel-heading,.planner-footer{justify-content:space-between}.hero-topbar{align-items:flex-start}.eyebrow{color:var(--accent-strong);letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px;font-size:12px;font-weight:700}.hero h1{letter-spacing:-.04em;margin:0;font-size:clamp(2rem,3vw,3.1rem);line-height:1}.hero-lead{max-width:860px;color:var(--muted);margin-top:14px;font-size:1rem;line-height:1.7}.hero-body{justify-content:space-between;align-items:flex-end;margin-top:18px}.hero-summary{gap:14px;display:grid}.quick-steps,.guide-list,.issue-list{margin:0;padding-left:20px}.quick-steps{color:var(--muted);gap:8px;line-height:1.55;display:grid}.hero-badges,.guide-tabs,.segmented,.locale-switch{flex-wrap:wrap;gap:8px;display:flex}.badge,.pill{color:var(--accent-strong);background:#0f766e1a;border-radius:999px;justify-content:center;align-items:center;padding:7px 12px;font-size:12px;font-weight:700;display:inline-flex}.pill{color:var(--text);background:#0f172a0f}.pill.success{color:#166534;background:#15803d1f}.hero-actions{flex-wrap:wrap;justify-content:flex-end}.export-format{width:min(280px,100%)}.segment-button,button{min-height:42px;color:var(--text);cursor:pointer;background:#ffffffe0;border:1px solid #94a3b880;border-radius:999px;padding:0 16px;transition:transform .16s,border-color .16s,box-shadow .16s,background .16s}.segment-button{min-height:38px;padding:0 14px}.segment-button.active{color:var(--accent-strong);background:#0f766e1f;border-color:#0f766e80}button:hover,.segment-button:hover{border-color:#0f766e8c;transform:translateY(-1px);box-shadow:0 10px 20px #0f172a14}button.primary{color:#f8fafc;background:linear-gradient(135deg,#0f766e,#155e75);border-color:#0000}button:disabled{cursor:not-allowed;opacity:.6;box-shadow:none;transform:none}input,select,textarea,button{font:inherit}input,select,textarea{box-sizing:border-box;width:100%;color:var(--text);background:#ffffffeb;border:1px solid #94a3b88c;border-radius:14px}input,select{height:44px;padding:0 14px}textarea{resize:vertical;min-height:280px;font-family:var(--mono);padding:14px;line-height:1.55}label{color:var(--muted);text-align:left;text-transform:uppercase;gap:8px;font-size:12px;font-weight:700;display:grid}.label-row{align-items:center;gap:8px;display:inline-flex}.hint-dot{width:18px;height:18px;color:var(--text);background:#0f172a14;border-radius:999px;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:inline-flex}.panel-heading{margin-bottom:14px}.panel-heading h2,.panel h2,.guide-content h3,.example-card h3,.screenshot-card h3{margin:0}.panel-heading span,.guide-content p,.message,.example-card p,.screenshot-card p,.guide-list,.quick-steps{color:var(--muted)}.part-fields{gap:14px;display:grid}.part-fields-basic{grid-template-columns:minmax(220px,1.7fr) 140px 220px}.part-fields-advanced{grid-template-columns:minmax(260px,1.2fr) minmax(260px,1fr);margin-top:14px}.advanced-fields{border-top:1px solid #94a3b82e;margin-top:14px;padding-top:14px}.advanced-fields summary,.code-panel summary{cursor:pointer;font-weight:700;list-style:none}.advanced-fields summary::-webkit-details-marker{display:none}.code-panel summary::-webkit-details-marker{display:none}.builder-grid,.status-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:16px;display:grid}.workspace-block{gap:14px;display:grid}.import-source{grid-template-columns:minmax(240px,.9fr) minmax(240px,1fr);gap:12px;display:grid}.file-drop,.recognition-summary{border-radius:18px;min-height:108px;padding:16px}.file-drop{text-transform:none;background:linear-gradient(#ffffffe6,#f1f5f9f2),radial-gradient(circle at 0 0,#0e74901f,#0000 40%);border:1px dashed #0e749073;align-content:center}.file-drop span{color:var(--text);font-size:.98rem;font-weight:700}.file-drop small,.recognition-summary small,.message{font-size:.92rem;line-height:1.6}.file-drop input{background:0 0;border:0;height:auto;padding:0}.recognition-summary{background:linear-gradient(145deg,#fffffff0,#f1f5f9fa);border:1px solid #94a3b859;align-content:space-between;display:grid}.recognition-summary strong{color:var(--text);margin-bottom:6px;font-size:2rem;line-height:1;display:block}.message{margin:0}.message.warm{color:#9a3412}.message.error{color:#b91c1c}.image-review{background:linear-gradient(#f8fafcf2,#fffffff2);border:1px solid #94a3b859;border-radius:18px;margin:0;overflow:hidden}.image-review img{object-fit:contain;width:100%;max-height:280px;display:block}.image-review figcaption{border-top:1px solid #94a3b847;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.image-review figcaption span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.ocr-action{justify-items:end;gap:8px;min-width:min(320px,100%);display:grid}.progress-button{width:min(320px,100%);position:relative;overflow:hidden}.progress-button-label{z-index:1;position:relative}.progress-button.is-busy{justify-content:center}.progress-button-fill{background:linear-gradient(90deg,#0f766e,#0ea5a4);border-radius:999px;height:100%;transition:width .18s;display:block;position:absolute;inset:0 auto 0 0;overflow:hidden}.progress-button-fill.processing:after{content:"";background:linear-gradient(90deg,#0000,#ffffff59,#0000);animation:1.1s linear infinite ocr-progress-sheen;position:absolute;inset:0}.ocr-status{width:min(320px,100%);color:var(--muted);text-align:right;font-size:.92rem;line-height:1.4}@keyframes ocr-progress-sheen{0%{transform:translate(-100%)}to{transform:translate(100%)}}.preview{background:linear-gradient(#fffffff2,#f5f7fafa),radial-gradient(circle at 100% 0,#0ea5e914,#0000 35%);border:1px solid #94a3b847;border-radius:18px;overflow:auto}.preview svg{width:100%;min-height:360px;display:block}.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.preset-card{text-align:left;background:linear-gradient(#fffffff0,#f1f5f9f2);border-radius:18px;gap:8px;min-height:102px;padding:14px;display:grid}.preset-card span{text-transform:none;font-size:.88rem;line-height:1.5}.preset-card.active{background:radial-gradient(circle at 100% 0,#0d948829,#0000 38%),linear-gradient(#f0fdfafa,#fffffff5);border-color:#0f766e7a}.planner-fields,.side-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.planner-footer{align-items:flex-start}.planner-footer .message{flex:1}.guide-tabs{margin-bottom:16px}.guide-content{gap:14px;display:grid}.example-grid,.screenshot-grid{gap:12px;display:grid}.example-card,.screenshot-card{background:#ffffffdb;border-radius:18px;padding:16px}.example-actions{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px}.example-buttons{flex-wrap:wrap}.example-card pre,.code-panel pre{color:#d9f99d;font-family:var(--mono);background:#0f172a;border-radius:16px;margin:0;padding:14px;font-size:.87rem;line-height:1.6;overflow:auto}.screenshot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.screenshot-card.good{border:1px solid #15803d2e}.screenshot-card.bad{border:1px solid #b91c1c24}.screenshot-mock{font-family:var(--mono);border-radius:16px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0;padding:16px;font-size:.88rem;display:grid}.screenshot-mock.good{background:linear-gradient(135deg,#fffffff0,#ecfdf5f5),radial-gradient(circle at 0 0,#15803d1f,#0000 36%)}.screenshot-mock.bad{background:linear-gradient(135deg,#fffffff0,#fef2f2f5),radial-gradient(circle at 0 0,#b91c1c1f,#0000 36%)}.guide-list{gap:10px;line-height:1.65;display:grid}.pin-table-wrap{overflow-x:auto}.pin-table{border-collapse:collapse;table-layout:fixed;width:100%}.pin-table th,.pin-table td{vertical-align:middle;border-bottom:1px solid #94a3b82e;padding:10px 8px}.pin-table th{text-align:left;text-transform:uppercase;color:var(--muted);font-size:12px}.pin-table th:first-child,.pin-table td:first-child{width:86px}.pin-table th:nth-child(3),.pin-table td:nth-child(3),.pin-table th:nth-child(4),.pin-table td:nth-child(4){width:154px}.pin-table th:last-child,.pin-table td:last-child{width:112px}.confidence{color:#166534;background:#dcfce7;border-radius:999px;justify-content:center;min-width:60px;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.confidence.low{color:#92400e;background:#fef3c7}.issue-list{padding:0;list-style:none}.issue-list li{border-bottom:1px solid #94a3b82e;padding:8px 0}.issue-list .ok{color:#166534}.issue-list .error{color:#b91c1c}.issue-list .warning{color:#92400e}.code-panel{gap:12px;display:grid}@media (width<=1180px){.builder-grid,.status-grid,.part-fields-basic,.part-fields-advanced,.planner-fields,.side-grid{grid-template-columns:1fr 1fr}.hero-body{flex-direction:column;align-items:stretch}.hero-actions{justify-content:flex-start}}@media (width<=900px){.app-shell{padding:16px}.builder-grid,.status-grid,.part-fields-basic,.part-fields-advanced,.planner-fields,.side-grid,.import-source,.preset-grid,.screenshot-grid{grid-template-columns:1fr}.hero-topbar,.panel-heading,.planner-footer,.example-actions,.image-review figcaption{flex-direction:column;align-items:stretch}.ocr-action{justify-items:stretch;min-width:0}.progress-button,.ocr-status{width:100%}.ocr-status{text-align:left}}@media (width<=640px){.app-shell{padding:12px}.panel,.hero,.workspace-panel,.preview-panel,.guide-panel,.status-panel,.code-panel{border-radius:18px}.pin-table{min-width:760px}}