:root{--bg: #0b0d12;--bg-2: #10141d;--panel: #12161f;--panel-2: #171c28;--panel-3: #1d2432;--border: #232b3b;--border-2: #2e3850;--text: #e8eaf0;--text-2: #aab3c5;--text-3: #7d879c;--accent: #6ea8ff;--accent-2: #4d7cff;--accent-soft: rgba(110, 168, 255, .12);--ok: #3ecf8e;--ok-soft: rgba(62, 207, 142, .12);--warn: #f5b94e;--warn-soft: rgba(245, 185, 78, .12);--err: #ff6b6b;--err-soft: rgba(255, 107, 107, .12);--radius: 12px;--radius-sm: 8px;--shadow: 0 8px 32px rgba(0, 0, 0, .45);--font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;--fog-alpha: .07;--fog-color: 200, 210, 230;--fog-vignette: rgba(0, 0, 0, .45);--fog-grain: .05}[data-theme=light]{--bg: #f2f4f8;--bg-2: #e9ecf2;--panel: #ffffff;--panel-2: #f4f6fa;--panel-3: #eceff5;--border: #d9dee8;--border-2: #c3cad8;--text: #1c2230;--text-2: #4a5468;--text-3: #8790a3;--accent: #3a74e0;--accent-2: #2c5fd0;--accent-soft: rgba(58, 116, 224, .1);--ok: #17a86b;--ok-soft: rgba(23, 168, 107, .1);--warn: #c98a12;--warn-soft: rgba(201, 138, 18, .1);--err: #d64545;--err-soft: rgba(214, 69, 69, .1);--shadow: 0 8px 24px rgba(30, 40, 70, .12);--fog-alpha: .14;--fog-color: 60, 70, 95;--fog-vignette: rgba(30, 40, 70, .1);--fog-grain: .03}*{box-sizing:border-box}.atmosphere{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none}.atmosphere__blob{position:absolute;border-radius:50%;will-change:transform;background:radial-gradient(closest-side,rgba(var(--fog-color),var(--fog-alpha)),rgba(var(--fog-color),0) 70%)}.atmosphere__blob--a{width:85vmax;height:85vmax;top:-35vmax;left:-28vmax;animation:fogDriftA 64s ease-in-out infinite alternate}.atmosphere__blob--b{width:75vmax;height:75vmax;bottom:-32vmax;right:-26vmax;animation:fogDriftB 78s ease-in-out infinite alternate}.atmosphere__blob--c{width:55vmax;height:55vmax;top:38%;left:30%;animation:fogDriftC 52s ease-in-out infinite alternate}@keyframes fogDriftA{0%{transform:translateZ(0) scale(1) rotate(0)}to{transform:translate3d(6vmax,4vmax,0) scale(1.12) rotate(8deg)}}@keyframes fogDriftB{0%{transform:translateZ(0) scale(1.08)}to{transform:translate3d(-5vmax,-6vmax,0) scale(.96)}}@keyframes fogDriftC{0%{transform:translate3d(-4vmax,3vmax,0) scale(1)}to{transform:translate3d(5vmax,-3vmax,0) scale(1.15)}}.atmosphere__wave{position:absolute;width:116%;height:100%;left:-8%;top:0;will-change:transform}.atmosphere__wave--a{animation:fogWaveA 56s ease-in-out infinite alternate}.atmosphere__wave--b{animation:fogWaveB 74s ease-in-out infinite alternate}@keyframes fogWaveA{0%{transform:translate3d(-2.5%,0,0) scaleY(1)}to{transform:translate3d(2.5%,-2%,0) scaleY(1.06)}}@keyframes fogWaveB{0%{transform:translate3d(2%,1.5%,0)}to{transform:translate3d(-2%,-1.5%,0)}}.atmosphere__vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(120% 90% at 50% 0%,transparent 55%,var(--fog-vignette) 100%),radial-gradient(140% 120% at 50% 55%,transparent 62%,var(--fog-vignette) 100%)}.atmosphere__grain{position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");opacity:var(--fog-grain)}html,body,#root{margin:0;padding:0;min-height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .4s ease,color .4s ease}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4{margin:0 0 8px;font-weight:650;letter-spacing:.01em}h1{font-size:1.5rem}h2{font-size:1.2rem}h3{font-size:1.02rem}code,pre{font-family:Consolas,Cascadia Code,monospace}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-main{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:20px 24px 120px}.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:12px;padding:10px 20px;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}.topbar .brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.05rem;letter-spacing:.04em;color:var(--text);text-decoration:none}.topbar .brand:hover{text-decoration:none}.brand-badge{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem}.topbar .spacer{flex:1}.topbar nav{display:flex;gap:4px;align-items:center}.topbar nav a{color:var(--text-2);padding:7px 12px;border-radius:8px;font-weight:550}.topbar nav a:hover{color:var(--text);background:var(--panel-3);text-decoration:none}.topbar nav a.active{color:var(--accent);background:var(--accent-soft)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border-2);background:var(--panel-2);color:var(--text);padding:9px 16px;border-radius:10px;font:inherit;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .15s,border-color .15s,transform .1s;min-height:40px}.btn:hover{background:var(--panel-3)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:linear-gradient(135deg,var(--accent-2),var(--accent));border-color:transparent;color:#fff}.btn.primary:hover{filter:brightness(1.08);background:linear-gradient(135deg,var(--accent-2),var(--accent))}.btn.danger{border-color:var(--err);color:var(--err);background:transparent}.btn.danger:hover{background:var(--err-soft)}.btn.ok{border-color:var(--ok);color:var(--ok);background:transparent}.btn.ok:hover{background:var(--ok-soft)}.btn.ghost{border-color:transparent;background:transparent;color:var(--text-2)}.btn.ghost:hover{background:var(--panel-2);color:var(--text)}.btn.small{padding:5px 10px;min-height:32px;font-size:.86rem;border-radius:8px}.btn.icon{padding:8px;min-width:38px;justify-content:center}label.field{display:block;margin-bottom:14px}label.field>span{display:block;font-size:.82rem;font-weight:650;color:var(--text-2);margin-bottom:5px;letter-spacing:.02em}label.field>small{display:block;color:var(--text-3);margin-top:4px}input[type=text],input[type=password],input[type=email],input[type=url],input[type=number],input[type=color],textarea,select{width:100%;background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px 12px;font:inherit;outline:none;transition:border-color .15s,box-shadow .15s}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}textarea{resize:vertical;min-height:88px}input[type=color]{padding:4px;height:44px;cursor:pointer}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}.card+.card{margin-top:16px}.card h2{display:flex;align-items:center;gap:8px}.grid{display:grid;gap:14px}.grid.cols-2{grid-template-columns:repeat(2,1fr)}.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}@media(max-width:900px){.grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:1fr}}.tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--border);margin-bottom:18px}.tabs .tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;color:var(--text-2);font:inherit;font-weight:600;padding:11px 16px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;display:inline-flex;align-items:center;gap:8px;border-radius:8px 8px 0 0}.tabs .tab:hover{color:var(--text);background:var(--panel-2)}.tabs .tab.active{color:var(--accent);border-bottom-color:var(--accent)}.tabs .tab .step-num{width:22px;height:22px;border-radius:50%;background:var(--panel-3);color:var(--text-2);font-size:.75rem;display:inline-flex;align-items:center;justify-content:center}.tabs .tab.active .step-num{background:var(--accent);color:#fff}.tabs .tab.done .step-num{background:var(--ok);color:#fff}.badge{display:inline-flex;align-items:center;gap:6px;font-size:.76rem;font-weight:700;padding:3px 10px;border-radius:99px;letter-spacing:.02em}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.err{background:var(--err-soft);color:var(--err)}.badge.info{background:var(--accent-soft);color:var(--accent)}.badge.dim{background:var(--panel-3);color:var(--text-2)}.dot{width:8px;height:8px;border-radius:50%;background:currentColor}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--border)}.table th{font-size:.8rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.05em}.table tr:hover td{background:var(--panel-2)}.alert{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:10px;border:1px solid var(--border-2);background:var(--panel-2);margin-bottom:14px}.alert.err{border-color:var(--err);background:var(--err-soft)}.alert.ok{border-color:var(--ok);background:var(--ok-soft)}.alert.warn{border-color:var(--warn);background:var(--warn-soft)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.modal{background:var(--panel);border:1px solid var(--border-2);border-radius:14px;padding:22px;width:100%;max-width:520px;max-height:88vh;overflow:auto;box-shadow:var(--shadow)}.diff{background:var(--bg-2);border:1px solid var(--border);border-radius:10px;padding:12px;font-family:Consolas,monospace;font-size:.8rem;overflow:auto;max-height:320px;white-space:pre-wrap;word-break:break-word}.diff .d-add{color:var(--ok);background:var(--ok-soft);display:block}.diff .d-del{color:var(--err);background:var(--err-soft);display:block}.diff .d-same{color:var(--text-3);display:block}.robot-chat-panel{position:fixed;top:64px;right:16px;bottom:16px;width:380px;max-width:calc(100vw - 32px);background:var(--panel);border:1px solid var(--border-2);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;z-index:90;overflow:hidden}.robot-chat-head{padding:10px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.robot-chat-stage{height:132px;flex:none;display:flex;align-items:flex-end;justify-content:center;background:var(--bg-2);border-bottom:1px solid var(--border);overflow:hidden}.robot-holder{width:104px;height:118px}.robot-chat-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}.robot-chat-input{padding:12px;border-top:1px solid var(--border);display:flex;gap:8px}.robot-chat-input .input{flex:1}.msg{max-width:82%;padding:9px 13px;border-radius:14px;font-size:.92rem;white-space:pre-wrap}.msg.user{align-self:flex-end;background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#fff;border-bottom-right-radius:4px}.msg.bot{align-self:flex-start;background:var(--panel-2);border:1px solid var(--border);border-bottom-left-radius:4px}.msg.bot.msg-error{border-color:var(--err);color:var(--err)}.msg-meta{margin-top:5px;font-size:.68rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em}.companion-dock{position:fixed;right:18px;bottom:18px;width:150px;height:170px;z-index:80;pointer-events:none;transition:transform .3s ease,opacity .3s ease}.companion-dock.hidden{opacity:0;transform:translateY(20px) scale(.9)}.companion-dock .dock-robot{position:absolute;top:0;right:0;bottom:0;left:0}.companion-dock .speech{position:absolute;top:0;right:0;background:var(--panel-2);border:1px solid var(--border-2);border-radius:12px;padding:6px 12px;font-size:.8rem;max-width:240px;box-shadow:var(--shadow);animation:pop-in .25s ease}@keyframes pop-in{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.preview-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.preview-frame-wrap{border:1px solid var(--border-2);border-radius:var(--radius);overflow:hidden;background:#fff;transition:width .25s ease}.preview-frame-wrap iframe{border:none;width:100%;height:70vh;background:#fff}.preview-frame-wrap.mobile{max-width:390px;margin:0 auto}.preview-frame-wrap.tablet{max-width:800px;margin:0 auto}.dropzone{border:2px dashed var(--border-2);border-radius:var(--radius);padding:36px 20px;text-align:center;color:var(--text-2);cursor:pointer;transition:border-color .15s,background .15s}.dropzone:hover,.dropzone.over{border-color:var(--accent);background:var(--accent-soft)}.file-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;margin-bottom:6px;background:var(--panel)}.file-row .name{flex:1;font-family:Consolas,monospace;font-size:.82rem;word-break:break-all}.map-target{display:flex;gap:6px;align-items:center;font-family:Consolas,monospace;font-size:.78rem;background:var(--bg-2);border:1px solid var(--border);border-radius:6px;padding:4px 8px;margin:3px 0}.muted{color:var(--text-2)}.dim{color:var(--text-3)}.small{font-size:.85rem}.row{display:flex;gap:10px;align-items:center}.row.wrap{flex-wrap:wrap}.spread{display:flex;align-items:center;justify-content:space-between;gap:10px}.spinner{width:18px;height:18px;border:2px solid var(--border-2);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:48px 20px;color:var(--text-3)}.empty-state h3{color:var(--text-2)}@media(max-width:640px){.app-main{padding:14px 12px 140px}.topbar{padding:8px 12px;gap:6px}.topbar nav a{padding:7px 9px}.robot-chat-panel{top:auto;bottom:0;right:0;left:0;width:auto;height:70vh;border-radius:16px 16px 0 0}.companion-dock{right:8px;bottom:8px;width:110px;height:130px}}
