@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&display=swap";:root{font-family:Space Grotesk,sans-serif;color:#2f262b;background:#f5efef;--bg-base: #f4eceb;--bg-soft: #f8f3f2;--rose-main: #b98a92;--rose-deep: #8f5f67;--rose-muted: #d7c0c3;--ink-strong: #332a2f;--ink-soft: #5c4d53;--line-soft: #dbc9cc;--accent-sage: #9aaea2;--accent-clay: #d9b8a2;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 8% 8%,rgba(185,138,146,.28),transparent 42%),radial-gradient(circle at 90% 10%,rgba(154,174,162,.24),transparent 45%),radial-gradient(circle at 50% 90%,rgba(217,184,162,.22),transparent 55%),var(--bg-base);color:var(--ink-strong)}#root{min-height:100vh}button,input,select{font:inherit}.app-shell{display:grid;grid-template-columns:minmax(290px,360px) 1fr;min-height:100vh;gap:16px;padding:14px}.control-panel{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:18px;background:linear-gradient(165deg,#fcf6f5f2,#f2e8e7f5);border:1px solid var(--line-soft);box-shadow:0 18px 40px #5f3f491f;max-height:calc(100vh - 28px);overflow:auto}.panel-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.top-actions{display:inline-flex;align-items:center;gap:8px}.home-link-btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;min-width:40px;padding:0;border-radius:10px;border:1px solid var(--rose-muted);background:#ffffffb8;color:var(--ink-soft);text-decoration:none}.home-link-btn:hover{background:#ffffffe6}.home-link-btn svg{width:20px;height:20px}.steps-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.steps-row span{display:inline-flex;justify-content:center;align-items:center;min-height:28px;border-radius:999px;border:1px solid var(--line-soft);background:#fff9;color:var(--ink-soft);font-size:.76rem;font-weight:600}.control-panel h1{margin:0;font-size:1.04rem;letter-spacing:.01em;color:var(--ink-strong)}.lang-btn{border:1px solid var(--rose-muted);background:#ffffffb8;color:var(--ink-soft);border-radius:10px;padding:8px 10px;min-height:40px;font-weight:600;cursor:pointer}.panel-section{display:flex;flex-direction:column;gap:10px;padding:11px;border-radius:14px;background:linear-gradient(180deg,#ffffffb8,#f9f1f0e6);border:1px solid var(--line-soft)}.panel-section h2{margin:0;font-size:.95rem;letter-spacing:.01em;color:var(--rose-deep)}.mobile-tabs{display:none}.tab-btn{min-height:40px;border-radius:10px;border:1px solid var(--line-soft);background:#ffffffb3;color:var(--ink-soft);font-weight:600}.tab-btn.active{background:linear-gradient(120deg,#b98a923b,#9aaea233);border-color:var(--rose-main);color:var(--rose-deep)}.section-toggle{display:flex;align-items:center;justify-content:space-between;gap:10px;border:0;background:transparent;text-align:left;padding:0;cursor:pointer}.section-toggle span{font-size:.8rem;color:var(--ink-soft);background:#b98a9229;border:1px solid var(--rose-muted);border-radius:999px;padding:3px 8px}.field{display:flex;flex-direction:column;gap:6px;font-size:.9rem;color:var(--ink-soft)}.field-label{display:inline-flex;align-items:center;gap:6px}.tip-icon{display:inline-flex;width:16px;height:16px;border-radius:999px;align-items:center;justify-content:center;font-size:.72rem;font-style:normal;border:1px solid var(--rose-muted);background:#ffffffe6;color:var(--ink-soft);cursor:help}.hint-text{margin:-2px 0 2px;font-size:.79rem;line-height:1.35;color:#7a666d}.field input,.field select{width:100%;min-height:42px;border:1px solid var(--line-soft);border-radius:10px;background:#ffffffe0;color:var(--ink-strong);padding:9px 10px}.stepper-wrap{display:grid;grid-template-columns:40px 1fr 40px;gap:6px;align-items:center}.stepper-btn{min-height:42px;border:1px solid var(--line-soft);border-radius:10px;background:#ffffffdb;color:var(--ink-strong);font-size:1.1rem;font-weight:700;cursor:pointer}.advanced-block{border:1px solid var(--line-soft);border-radius:12px;background:#ffffff94;padding:8px}.advanced-block summary{cursor:pointer;color:var(--ink-soft);font-size:.88rem;font-weight:600}.advanced-content{display:flex;flex-direction:column;gap:10px;padding-top:8px}.field input:focus-visible,.field select:focus-visible,.toggle-row input:focus-visible,button:focus-visible{outline:2px solid var(--rose-main);outline-offset:2px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.preset-row{display:flex;flex-direction:column;gap:6px}.preset-row>span{font-size:.84rem;color:var(--ink-soft)}.preset-buttons{display:grid;grid-template-columns:1fr 1fr;gap:6px}.preset-buttons .secondary-btn{min-height:34px;padding:6px 8px;font-size:.82rem}.meta-row{display:flex;justify-content:space-between;align-items:center;background:#ede0e299;border-radius:10px;padding:8px 10px;font-size:.86rem;color:var(--ink-soft)}.meta-row strong{color:var(--ink-strong)}.warning-text{margin:0;font-size:.82rem;line-height:1.45;color:#6d3f49;background:#b98a9224;border:1px solid rgba(185,138,146,.38);border-radius:10px;padding:8px 10px}.toggle-row{display:flex;flex-wrap:wrap;gap:10px}.toggle-row label{display:inline-flex;align-items:center;gap:6px;min-height:32px;font-size:.88rem;color:var(--ink-soft)}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}button{min-height:42px}.primary-btn,.button-row .primary-btn{border:0;border-radius:10px;padding:10px;color:#fff;font-weight:700;background:linear-gradient(120deg,var(--rose-main),var(--rose-deep));cursor:pointer}.secondary-btn,.button-row .secondary-btn{border:1px solid var(--rose-muted);border-radius:10px;padding:10px;color:var(--ink-strong);font-weight:600;background:#ffffffc7;cursor:pointer}button:disabled{opacity:.48;cursor:not-allowed}.action-sticky{position:sticky;bottom:-14px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 0 0;margin-top:auto;background:linear-gradient(180deg,#f4eceb00,#f4ecebf2 36%)}.toast{position:sticky;bottom:64px;margin-left:auto;max-width:88%;border:1px solid rgba(154,174,162,.6);border-radius:10px;background:#f4fdf8e6;color:#365249;font-size:.82rem;padding:8px 10px}.viewer-area{position:relative;min-height:70vh;border-radius:20px;overflow:hidden;border:1px solid rgba(184,148,155,.45);background:linear-gradient(145deg,#fff8f8,#f0e4e6 60%,#e8d9db);box-shadow:inset 0 0 0 1px #ffffff59}.canvas-wrap{position:absolute;inset:0;overscroll-behavior:contain}.canvas-wrap canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}.canvas-wrap canvas:active{cursor:grabbing}.usage-hint,.inspect-help-hint,.shortcut-hint{position:absolute;right:12px;width:270px;background:#f7eceed6;border:1px solid rgba(185,138,146,.5);border-radius:12px;padding:10px 12px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 8px 20px #5f3f491a;pointer-events:none}.usage-hint h3,.inspect-help-hint h3,.shortcut-hint h3{margin:0 0 6px;font-size:.86rem;color:var(--rose-deep)}.usage-hint p,.inspect-help-hint p,.shortcut-hint p{margin:0 0 4px;font-size:.78rem;color:var(--ink-soft);line-height:1.35}.usage-hint p:last-child,.inspect-help-hint p:last-child,.shortcut-hint p:last-child{margin-bottom:0}.usage-hint{top:12px}.shortcut-hint{bottom:12px}.inspect-help-hint{top:148px}.heatmap-overlay{position:absolute;right:14px;bottom:14px;width:min(290px,calc(100% - 28px));background:#fff8f8e0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--line-soft);border-radius:12px;padding:12px}.heatmap-overlay h2{margin:0 0 6px;font-size:.95rem;color:var(--rose-deep)}.heatmap-overlay p{margin:0 0 9px;color:var(--ink-soft);font-size:.81rem}.metric{display:flex;justify-content:space-between;align-items:baseline;font-size:.84rem;color:var(--ink-soft)}.metric strong{color:var(--ink-strong)}.bar{margin:6px 0 10px;height:8px;border-radius:99px;background:#aa939733;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#d9898c,#e5b085,#98baac)}@media(max-width:950px){.app-shell{grid-template-columns:1fr;padding:12px}.mobile-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mobile-hide{display:none}.viewer-area{min-height:58vh}.usage-hint,.inspect-help-hint,.shortcut-hint{right:10px;width:230px}}
