@import"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600&family=IBM+Plex+Sans:wght@400;500;600&display=swap";:root{font-family:IBM Plex Sans,system-ui,sans-serif;line-height:1.5;font-weight:400;color:#102a2f;background-color:#eef4f6;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 20%,rgba(191,226,229,.6),transparent 55%),radial-gradient(circle at 80% 10%,rgba(231,235,250,.8),transparent 50%),linear-gradient(140deg,#eef4f6,#e7eff2 45%,#f7fafb);background-attachment:fixed}:root[data-theme=light]{color:#102a2f;background-color:#eef4f6}html[data-theme=light] body{background:radial-gradient(circle at 20% 20%,rgba(191,226,229,.6),transparent 55%),radial-gradient(circle at 80% 10%,rgba(231,235,250,.8),transparent 50%),linear-gradient(140deg,#eef4f6,#e7eff2 45%,#f7fafb)}:root[data-theme=dark]{color:#e6f1f4;background-color:#0b1417}html[data-theme=dark] body{background:radial-gradient(circle at 20% 20%,rgba(16,70,78,.35),transparent 55%),radial-gradient(circle at 80% 10%,rgba(26,34,52,.5),transparent 50%),linear-gradient(140deg,#0b1417,#0e1a1f 45%,#111c22)}@media(prefers-color-scheme:dark){:root:not([data-theme]){color:#e6f1f4;background-color:#0b1417}html:not([data-theme]) body{background:radial-gradient(circle at 20% 20%,rgba(16,70,78,.35),transparent 55%),radial-gradient(circle at 80% 10%,rgba(26,34,52,.5),transparent 50%),linear-gradient(140deg,#0b1417,#0e1a1f 45%,#111c22)}}a{color:inherit;text-decoration:none}button,input,select{font-family:inherit}#root{min-height:100vh}:root{--ink: #102a2f;--muted: #5a6b70;--panel: rgba(255, 255, 255, .92);--edge: rgba(16, 42, 47, .12);--accent: #0c7c8b;--accent-soft: rgba(12, 124, 139, .14)}:root[data-theme=dark]{--ink: #e6f1f4;--muted: #9fb4bb;--panel: rgba(12, 22, 26, .92);--edge: rgba(230, 241, 244, .12);--accent: #3fb2c4;--accent-soft: rgba(63, 178, 196, .2)}@media(prefers-color-scheme:dark){:root:not([data-theme]){--ink: #e6f1f4;--muted: #9fb4bb;--panel: rgba(12, 22, 26, .92);--edge: rgba(230, 241, 244, .12);--accent: #3fb2c4;--accent-soft: rgba(63, 178, 196, .2)}}.app{max-width:1200px;margin:0 auto;padding:12px 16px 16px;display:flex;flex-direction:column;gap:12px;height:100vh}@keyframes floatIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.layout{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:14px;height:100%}.controls{display:flex;flex-direction:column;gap:10px}.panel{background:var(--panel);border-radius:18px;padding:12px 14px;border:1px solid var(--edge);box-shadow:0 16px 30px #102a2f14;display:flex;flex-direction:column;gap:10px;animation:floatIn .65s ease both}.panel h2{margin:0;font-size:.95rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}.segmented{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.segmented button{border-radius:12px;border:1px solid transparent;padding:8px 10px;font-size:.82rem;background:#f2f7f8;color:var(--ink);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.segmented button.active{background:var(--accent);color:#f3fbfd;box-shadow:0 12px 24px #0c7c8b33}.file-input{display:inline-flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;border:1px dashed rgba(12,124,139,.4);background:#f5fbfccc;color:var(--ink);cursor:pointer}.file-input input{display:none}.text-input,.select-input{border-radius:12px;border:1px solid var(--edge);padding:8px 10px;font-size:.85rem;background:#ffffffe6;color:var(--ink)}.field{display:flex;flex-direction:column;gap:6px}.field-head{display:flex;justify-content:space-between;font-size:.78rem;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--accent)}.emboss-actions{display:flex;flex-wrap:wrap;gap:8px}.emboss-actions button{border-radius:10px;padding:6px 10px;font-size:.8rem;border:1px solid transparent;background:var(--accent);color:#f2fbfd;cursor:pointer}.hint{margin:0;font-size:.78rem;color:var(--muted)}.viewer{position:relative;background:#f8fbfc;border-radius:22px;border:1px solid var(--edge);min-height:0;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 22px 40px #102a2f1f;animation:floatIn .7s ease .1s both}.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px;background:#f8fbfceb;border-bottom:1px solid var(--edge)}.viewer-title{font-size:.78rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.14em}.viewer-actions{display:flex;flex-wrap:wrap;gap:6px}.viewer-actions .toggle{border-radius:10px;padding:6px 10px;font-size:.8rem;border:1px solid transparent;background:var(--accent);color:#f2fbfd;cursor:pointer}.viewer-actions .toggle.active{box-shadow:0 10px 20px #0c7c8b33}.viewer:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(12,124,139,.06) 1px,transparent 1px),linear-gradient(180deg,rgba(12,124,139,.06) 1px,transparent 1px);background-size:28px 28px;opacity:.4;pointer-events:none}.hover-readout{position:absolute;right:12px;bottom:120px;padding:6px 10px;border-radius:999px;background:#f8fbfceb;border:1px solid var(--edge);font-size:.74rem;color:var(--muted);box-shadow:0 10px 20px #102a2f1f;z-index:2;pointer-events:none}.viewer canvas{flex:1}.viewer-footer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;padding:8px 12px;font-size:.74rem;color:var(--muted);background:#f8fbfceb;border-top:1px solid var(--edge)}.viewer-meta{display:inline-flex;align-items:center;gap:6px}.viewer-meta strong{color:var(--ink);font-weight:600}.viewer-toggles{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 10px;background:#f8fbfcf2;border-top:1px solid var(--edge)}.viewer-toggles .toggle{border-radius:999px;padding:6px 10px;font-size:.74rem;border:1px solid var(--edge);background:#f0f7f8;color:var(--ink);cursor:pointer}html[data-theme=dark] .panel{box-shadow:0 16px 30px #0006}html[data-theme=dark] .segmented button{background:#142126e6;border-color:#3fb2c440}html[data-theme=dark] .segmented button.active{background:var(--accent);color:#071317;border-color:transparent;box-shadow:0 12px 24px #3fb2c440}html[data-theme=dark] .file-input{background:#0e1a20f2;border-color:#3fb2c466;color:var(--ink)}html[data-theme=dark] .text-input,html[data-theme=dark] .select-input{background:#0c161af2;border-color:#e6f1f433;color:var(--ink)}html[data-theme=dark] .viewer{background:#0f1c22;box-shadow:0 22px 40px #00000073}html[data-theme=dark] .viewer-header{background:#0c1418eb}html[data-theme=dark] .viewer:before{opacity:.25}html[data-theme=dark] .hover-readout{background:#0c1418eb;box-shadow:0 10px 20px #00000059}html[data-theme=dark] .viewer-footer{background:#0c1418eb}html[data-theme=dark] .viewer-toggles{background:#0c1418f2}html[data-theme=dark] .viewer-toggles .toggle{background:#142126e6}html[data-theme=dark] .viewer-toggles .toggle.active{background:var(--accent);color:#f2fbfd;border-color:transparent;box-shadow:0 10px 20px #3fb2c440}@media(prefers-color-scheme:dark){html:not([data-theme]) .panel{box-shadow:0 16px 30px #0006}html:not([data-theme]) .segmented button{background:#142126e6}html:not([data-theme]) .segmented button.active{background:var(--accent);color:#071317;border-color:transparent;box-shadow:0 12px 24px #3fb2c440}html:not([data-theme]) .file-input{background:#0e1a20f2;border-color:#3fb2c466;color:var(--ink)}html:not([data-theme]) .text-input,html:not([data-theme]) .select-input{background:#0c161af2;border-color:#e6f1f433;color:var(--ink)}html:not([data-theme]) .viewer{background:#0f1c22;box-shadow:0 22px 40px #00000073}html:not([data-theme]) .viewer-header{background:#0c1418eb}html:not([data-theme]) .viewer:before{opacity:.25}html:not([data-theme]) .hover-readout{background:#0c1418eb;box-shadow:0 10px 20px #00000059}html:not([data-theme]) .viewer-footer{background:#0c1418eb}html:not([data-theme]) .viewer-toggles{background:#0c1418f2}html:not([data-theme]) .viewer-toggles .toggle{background:#142126e6}html:not([data-theme]) .viewer-toggles .toggle.active{background:var(--accent);color:#f2fbfd;border-color:transparent;box-shadow:0 10px 20px #3fb2c440}}.viewer-toggles .toggle.active{background:var(--accent);color:#f2fbfd;border-color:transparent}@media(max-width:960px){.layout{grid-template-columns:1fr}.viewer{min-height:420px}}
