:root{color:#0f172a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff8ef;font-family:Avenir Next,PingFang SC,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}h1{letter-spacing:-.05em;color:#0f172a;margin:0 0 12px;font-size:clamp(2.3rem,5vw,3.75rem);line-height:.95}h2,p{margin:0}a{color:inherit}#root{min-height:100vh}.app-shell{min-height:100vh;padding:32px;position:relative}.app-backdrop{pointer-events:none;background:radial-gradient(circle at 0 0,#ff8c5c33,#0000 32%),radial-gradient(circle at 100% 0,#0e74902e,#0000 28%),linear-gradient(#fff8eff5,#f0f9ffe0);position:fixed;inset:0}.hero-banner,.layout-grid{z-index:1;position:relative}.hero-banner{justify-content:space-between;align-items:flex-start;gap:24px;max-width:1480px;margin:0 auto 24px;display:flex}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:#0f766e;margin:0 0 10px;font-size:.78rem;font-weight:700}.hero-copy{color:#475569;max-width:760px;margin:0;font-size:1rem}.hero-badges{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.layout-grid{grid-template-columns:minmax(0,2.2fr) minmax(320px,1fr);gap:24px;max-width:1480px;margin:0 auto;display:grid}.workspace-column,.sidebar-column{flex-direction:column;gap:24px;display:flex}.tab-strip{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffc7;border:1px solid #94a3b82e;border-radius:24px;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:10px;display:grid;box-shadow:0 20px 45px #0f172a14}.tab-pill{color:#475569;cursor:pointer;background:0 0;border:0;border-radius:16px;padding:14px 18px;font-weight:700;transition:background .2s,color .2s,transform .2s}.tab-pill:hover{background:#0f766e14;transform:translateY(-1px)}.tab-pill.active{color:#fff;background:linear-gradient(135deg,#0f766e,#f97316);box-shadow:0 14px 28px #0f766e38}.split-grid{grid-template-columns:minmax(0,1.7fr) minmax(300px,.9fr);gap:24px;display:grid}.panel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffdb;border:1px solid #94a3b82e;border-radius:28px;overflow:hidden;box-shadow:0 24px 60px #0f172a14}.panel-header{justify-content:space-between;align-items:center;gap:12px;padding:22px 24px 0;display:flex}.panel-title-wrap{color:#0f172a;align-items:center;gap:10px;display:inline-flex}.panel-title-wrap h2{margin:0;font-size:1.05rem}.panel-body{padding:20px 24px 24px}.upload-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;display:grid}.upload-dropzone,.preview-panel,.note-card,.toggle-card,.result-box,.history-card,.preview-empty{border-radius:24px}.upload-dropzone{text-align:center;cursor:pointer;color:#0f172a;background:linear-gradient(135deg,#f0fdfae6,#fff7edf5),#fff;border:2px dashed #0f766e38;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:300px;padding:28px;transition:transform .2s,border-color .2s;display:flex}.upload-dropzone:hover{border-color:#f9731673;transform:translateY(-2px)}.upload-dropzone strong{font-size:1.1rem}.upload-dropzone span{color:#64748b}.hidden-input{display:none}.preview-panel{background:#f8fafccc;border:1px solid #94a3b83d;flex-direction:column;justify-content:center;gap:14px;min-height:300px;padding:18px;display:flex}.preview-image{object-fit:contain;border-radius:18px;width:100%;max-height:420px}.preview-empty{color:#64748b;background:#ffffffc7;place-items:center;min-height:264px;display:grid}.form-grid{gap:16px;margin-bottom:16px;display:grid}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.field{flex-direction:column;gap:8px;display:flex}.field span{color:#475569;font-size:.92rem;font-weight:600}.field input,.field select,.field textarea{color:#0f172a;width:100%;font:inherit;box-sizing:border-box;background:#fffffff5;border:1px solid #94a3b847;border-radius:18px;padding:14px 16px;transition:border-color .2s,box-shadow .2s}.field textarea{resize:vertical;min-height:130px}.field input:focus,.field select:focus,.field textarea:focus{border-color:#0f766e80;outline:none;box-shadow:0 0 0 4px #0f766e1a}.chip-row{flex-wrap:wrap;gap:10px;display:flex}.chip-button,.secondary-button,.text-button{color:#0f172a;background:#ffffffe0;border:1px solid #94a3b842}.chip-button{cursor:pointer;font:inherit;border-radius:999px;padding:10px 14px;transition:transform .2s,border-color .2s}.chip-button:hover,.secondary-button:hover,.text-button:hover{border-color:#0f766e59;transform:translateY(-1px)}.insight-row,.insight-block{flex-direction:column;gap:8px;display:flex}.insight-row{border-bottom:1px solid #94a3b82e;flex-direction:row;justify-content:space-between;align-items:center;padding-bottom:14px}.insight-block+.insight-block{margin-top:18px}.checklist{flex-direction:column;gap:10px;display:flex}.check-item{color:#1e293b;align-items:flex-start;gap:10px;display:flex}.toggle-stack{flex-direction:column;gap:14px;display:flex}.toggle-card{background:#ffffffc7;border:1px solid #94a3b838;justify-content:space-between;align-items:center;gap:16px;padding:18px;display:flex}.toggle-card strong{margin-bottom:4px;display:block}.toggle-card span{color:#64748b;font-size:.92rem;display:block}.toggle-card input{accent-color:#0f766e;width:22px;height:22px}.note-card{color:#334155;background:linear-gradient(135deg,#fff8efd9,#f0f9ffcc);border:1px solid #94a3b82e;padding:18px 20px}.note-card p{margin:6px 0 0}.note-title{color:#0f172a;align-items:center;gap:8px;display:inline-flex}.action-row{flex-wrap:wrap;gap:12px;margin-bottom:18px;display:flex}.primary-button,.secondary-button,.text-button{font:inherit;cursor:pointer;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-weight:700;transition:transform .2s,opacity .2s;display:inline-flex}.primary-button{color:#fff;background:linear-gradient(135deg,#0f766e,#f97316);border:0;box-shadow:0 18px 32px #0f766e3d}.secondary-button:disabled,.primary-button:disabled{cursor:not-allowed;opacity:.55;transform:none}.primary-button:hover:not(:disabled),.secondary-button:hover:not(:disabled){transform:translateY(-1px)}.result-box{white-space:pre-wrap;color:#0f172a;background:#ffffffe0;border:1px solid #94a3b833;min-height:380px;padding:22px;line-height:1.8}.error-box{color:#b91c1c;background:#fef2f2f5;border:1px solid #f871714d;border-radius:18px;margin-bottom:16px;padding:14px 16px}.history-list{flex-direction:column;gap:12px;max-height:520px;padding-right:4px;display:flex;overflow:auto}.history-card{text-align:left;cursor:pointer;background:#ffffffd1;flex-direction:column;align-items:flex-start;gap:6px;width:100%;padding:16px;transition:transform .2s,border-color .2s;display:flex}.history-card:hover{border-color:#f9731652;transform:translateY(-1px)}.history-time{color:#64748b;font-size:.84rem}.history-card p{color:#334155;margin:4px 0 0;line-height:1.65}.tip-list,.capability-list{flex-direction:column;gap:14px;display:flex}.tip-item{color:#1e293b;align-items:flex-start;gap:10px;display:flex}.badge{color:#0f172a;background:#ffffffd9;border:1px solid #94a3b82e;border-radius:999px;justify-content:center;align-items:center;min-height:34px;padding:0 14px;font-size:.84rem;font-weight:700;display:inline-flex}.badge-solid{color:#fff;background:linear-gradient(135deg,#0f766e,#f97316);border-color:#0000}.muted-text{color:#64748b}.text-button{padding:8px 12px}.spin{animation:.9s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=1220px){.layout-grid,.split-grid{grid-template-columns:1fr}.sidebar-column{order:-1}}@media (width<=960px){.app-shell{padding:18px}.hero-banner,.upload-grid,.form-grid.two,.form-grid.four{grid-template-columns:1fr}.hero-banner{flex-direction:column}.hero-badges{justify-content:flex-start}.tab-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.panel-header,.panel-body{padding-left:18px;padding-right:18px}.panel-header{padding-top:18px}.tab-pill{padding:12px}.action-row{flex-direction:column}.primary-button,.secondary-button,.text-button{width:100%}}
