.app-shell{display:flex;flex-direction:row;min-height:100vh;background:#151515}
.app-shell .sidebar{width:244px;height:100vh;min-height:100vh;flex:none;display:flex;flex-direction:column;align-items:stretch;padding:26px 16px 14px;background:#151515;border-right:1px solid #2b2b2b;border-bottom:0}
.app-shell .brand{height:34px;padding:0 10px;gap:8px;color:#f6f6f4;font-size:18px;font-weight:800;letter-spacing:-.3px}
.app-shell .brand-logo{display:block;width:150px;height:34px;max-width:100%;object-fit:contain;object-position:left center;image-rendering:auto}
.app-shell .brand>span:last-child{display:inline}
.app-shell .brand b{color:#f6f6f4}
.app-shell .new-btn{height:38px;margin:23px 4px 14px;text-align:left;padding:0 12px;background:#16c4e8;color:#071216;border:0;border-radius:8px;font-size:14px;font-weight:800;box-shadow:none}
.app-shell .new-btn:before{content:'+';display:inline-block;margin-right:10px;font-size:22px;font-weight:400;line-height:0;vertical-align:-2px}
.app-shell .nav-list{display:grid;gap:4px;margin:0}
.app-shell .nav-item{height:36px;width:100%;display:flex;align-items:center;gap:10px;padding:0 10px;text-align:left;color:#e7e7e7;background:transparent;border:0;border-radius:8px;font-size:14px;white-space:nowrap}
.app-shell .nav-item:hover{background:#242424;color:#fff}
.app-shell .nav-item.active{background:#303030;color:#fff}
.app-shell .nav-list .nav-item:not(:last-child){margin-right:0}
.app-shell .nav-list .nav-item:after,.app-shell .nav-list .nav-item:before{display:none}
.app-shell .nav-icon{width:18px;height:18px;display:grid;place-items:center;flex:none;color:#f2f2f2;font-size:16px;font-weight:400;line-height:1}
.app-shell .nav-item em{margin-left:auto;min-width:20px;height:20px;padding:0 6px;display:inline-grid;place-items:center;border-radius:999px;background:#3a3a3a;color:#f5f5f5;font-size:11px;font-style:normal}
.app-shell .sidebar-foot{display:grid;gap:4px;margin-top:auto}
.app-shell .sidebar-foot .nav-item{font-size:13px}
.app-shell .status-pill{margin:8px 10px 0;color:#8f8f8f}
.app-shell .main{width:calc(100% - 244px);min-width:0}
.app-shell .content{min-height:100vh;height:auto}
.app-shell .topbar{display:flex}
.app-shell .home-btn{height:32px;display:inline-flex;align-items:center;gap:6px;padding:0 11px;border:1px solid #3a3a3a;border-radius:7px;background:#242424;color:#f3f3f3;font-size:12px}
.app-shell .home-btn:hover{background:#303030}
.app-shell .home-btn span{font-size:16px;line-height:1}
.app-shell .mode-tabs{display:none!important}
.app-shell .hero-copy:after{display:none!important;background:none!important;opacity:0!important}
.app-shell .hero-copy,.app-shell .panel,.app-shell .task-row,.app-shell .model-chip,.app-shell textarea,.app-shell .control select,.app-shell .upload-tile,.app-shell .quick-prompts button,.app-shell .secondary-btn,.app-shell .primary-btn,.app-shell .generate-btn{border-radius:11px}
.app-shell .hero-copy,.app-shell .panel{border-color:#303030}
.welcome-main{padding-bottom:clamp(118px,14vh,160px)!important}
.welcome-brand .brand-logo{display:block;width:170px;height:42px;object-fit:contain;object-position:left center}
.login-aside .welcome-brand .brand-logo{width:190px;height:46px}
.help-copy{display:grid;gap:10px;color:#bdbdbd;font-size:13px;line-height:1.7}.help-copy p{margin:0;padding:10px 12px;background:#202020;border-radius:7px}
.account-summary{display:flex;align-items:center;gap:12px;padding:14px;background:#202020;border-radius:8px;color:#f2f2f2}.account-avatar{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#16c4e8;color:#071216;font-weight:800}.account-summary strong,.account-summary small{display:block}.account-summary small{margin-top:4px;color:#999;font-size:11px}
.account-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.account-fields>div{padding:11px 12px;background:#202020;border-radius:8px}.account-fields span,.account-fields b{display:block}.account-fields span{color:#999;font-size:11px;margin-bottom:5px}.account-fields b{color:#f2f2f2;font-size:13px}.account-fields i{font-style:normal;color:#16c4e8}
.balance-btn{height:32px;display:inline-flex;align-items:center;gap:5px;padding:0 11px;border:1px solid #3a3a3a;border-radius:7px;background:#242424;color:#f3f3f3;font-size:12px}.balance-btn:hover{background:#303030}.balance-btn span{color:#16c4e8}.balance-btn b{color:#fff;font-weight:800}
.balance-hero{display:flex;align-items:flex-end;justify-content:space-between;padding:16px 14px;background:#202020;border-radius:9px;color:#a9a9a9}.balance-hero strong{font-size:26px;color:#fff}.balance-hero strong i{font-style:normal;color:#16c4e8}.balance-hero small{font-size:12px;color:#aaa}.recharge-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.recharge-option{position:relative;min-height:72px;padding:10px;border:1px solid #3b3b3b;border-radius:9px;background:#1b1b1b;color:#f1f1f1;text-align:left}.recharge-option:hover,.recharge-option.selected{border-color:#16c4e8;background:#18282b}.recharge-option strong,.recharge-option span{display:block}.recharge-option strong{font-size:19px}.recharge-option span{margin-top:3px;color:#a5a5a5;font-size:11px}.recharge-option em{position:absolute;top:7px;right:7px;color:#16c4e8;font-size:9px;font-style:normal}.recharge-custom{display:block;margin-top:14px;color:#bbb;font-size:12px}.recharge-custom input{margin-top:7px}.recharge-note{margin-top:12px;padding:10px 12px;border-radius:8px;background:#202020;color:#999;font-size:11px;line-height:1.6}
.canvas-shell{min-height:calc(100vh - 56px);display:flex;flex-direction:column}.canvas-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.canvas-toolbar h2{margin:0 0 5px;font-size:24px}.canvas-toolbar p{margin:0;color:#888;font-size:12px}.canvas-actions{display:flex;align-items:center;gap:6px}.canvas-add,.canvas-tool{height:34px;border:1px solid #3b3b3b;border-radius:8px;background:#202020;color:#eee;padding:0 11px;font-size:12px}.canvas-add{background:#16c4e8;border-color:#16c4e8;color:#071216;font-weight:800}.canvas-tool{width:34px;padding:0;font-size:17px}.canvas-tool:hover,.canvas-add:hover{filter:brightness(1.12)}#canvasZoomLabel{min-width:42px;text-align:center;color:#aaa;font-size:11px}.canvas-layout{display:grid;grid-template-columns:220px 1fr;gap:12px;flex:1;min-height:620px}.canvas-inspector{padding:18px;background:#171717;border:1px solid #303030;border-radius:12px}.canvas-eyebrow{color:#16c4e8;font-size:10px;letter-spacing:1.4px;text-transform:uppercase}.canvas-inspector h3{margin:14px 0 6px;color:#f3f3f3;font-size:16px}.canvas-inspector>p{margin:0 0 20px;color:#929292;font-size:12px;line-height:1.6}.canvas-field{display:block;margin-top:14px;color:#aaa;font-size:11px}.canvas-field input,.canvas-field textarea{display:block;width:100%;margin-top:7px;background:#202020;border:1px solid #363636;color:#eee;border-radius:8px;padding:9px;font-size:12px;outline:none}.canvas-field textarea{resize:vertical}.canvas-inspector-actions{display:grid;gap:8px;margin-top:20px}.canvas-stage{position:relative;overflow:hidden;min-height:620px;background:#101010;border:1px solid #303030;border-radius:12px}.canvas-stage:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#343434 1px,transparent 1px);background-size:22px 22px;opacity:.32}.canvas-layer{position:absolute;inset:0;transform-origin:0 0;z-index:1}.canvas-node{position:absolute;width:194px;min-height:78px;display:flex;align-items:flex-start;gap:10px;padding:14px 12px;background:#1d1d1d;border:1px solid #3d3d3d;border-radius:11px;color:#f0f0f0;box-shadow:0 12px 30px #0005;cursor:grab;user-select:none}.canvas-node:active{cursor:grabbing}.canvas-node.selected{border-color:#16c4e8;box-shadow:0 0 0 2px #16c4e833,0 12px 30px #0005}.canvas-node-icon{width:26px;height:26px;display:grid;place-items:center;flex:none;border-radius:7px;background:#273236;color:#16c4e8}.canvas-node strong,.canvas-node small{display:block;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas-node strong{font-size:12px}.canvas-node small{margin-top:6px;color:#999;font-size:10px}.node-menu{margin-left:auto;color:#999;font-size:13px}.canvas-empty{position:absolute;z-index:2;inset:0;display:grid;place-content:center;text-align:center;color:#777;pointer-events:none}.canvas-empty[hidden]{display:none}.canvas-empty span{font-size:34px;color:#16c4e8}.canvas-empty strong{margin-top:10px;color:#aaa;font-size:14px}.canvas-empty small{margin-top:6px;font-size:11px}.canvas-hint{position:absolute;z-index:2;right:14px;bottom:12px;color:#777;font-size:10px}
.canvas-add.active{box-shadow:0 0 0 2px #16c4e833}.canvas-create-menu{position:absolute;z-index:5;display:none;grid-template-columns:1fr 1fr;gap:5px;padding:7px;background:#252525;border:1px solid #444;border-radius:10px;box-shadow:0 16px 35px #0008}.canvas-create-menu.visible{display:grid}.canvas-create-menu button{height:30px;padding:0 9px;border-radius:6px;background:#303030;color:#e7e7e7;font-size:11px;text-align:left;white-space:nowrap}.canvas-create-menu button:hover{background:#16c4e8;color:#071216}
.asset-grid.drag-over{outline:1px solid #16c4e8;outline-offset:6px;border-radius:10px}.asset-item{position:relative}.asset-footer{display:flex;align-items:center;justify-content:space-between;gap:4px;min-width:0}.asset-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.asset-remove{flex:none;color:#d28484;font-size:10px;padding:2px 0}.asset-remove:hover{color:#ff8e8e;text-decoration:underline}
.app-shell .workspace-grid{grid-template-columns:minmax(0,1.1fr) minmax(300px,.85fr) 230px;gap:14px}
.task-sidebar{min-height:620px;display:flex;flex-direction:column;min-width:0}
.side-task-list{display:grid;gap:8px;overflow:auto;max-height:calc(100vh - 220px);padding-right:2px}
.side-task-row{position:relative;display:block;width:100%;min-height:78px;padding:10px 10px 10px 12px;border:1px solid #333;border-radius:9px;background:#1d1d1d;color:#eee;text-align:left;cursor:pointer}
.side-task-row:hover{border-color:#16c4e8;background:#20282a}
.side-task-row strong,.side-task-row small{display:block;max-width:175px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-task-row strong{padding-right:30px;font-size:12px;line-height:1.45}.side-task-row small{margin-top:5px;color:#888;font-size:10px}.side-task-kind{display:inline-block;margin-bottom:6px;color:#16c4e8;font-size:10px}.side-task-status{position:absolute;right:9px;top:10px;color:#999;font-size:10px}.side-task-status.done{color:#67cf9a}.side-task-status.running{color:#f0c674}.side-task-empty{padding:22px 8px;color:#777;text-align:center;font-size:12px}.side-task-all{margin-top:auto;height:34px;border:1px solid #3a3a3a;border-radius:8px;background:#202020;color:#bbb;font-size:11px;cursor:pointer}.side-task-all:hover{border-color:#16c4e8;color:#fff}.side-task-all span{margin-left:5px;color:#16c4e8}
@media(max-width:900px){.canvas-layout{grid-template-columns:1fr}.canvas-inspector{min-height:220px}.canvas-stage{min-height:520px}.canvas-toolbar{align-items:flex-start;gap:12px;flex-direction:column}}
@media(max-width:1200px){.app-shell .workspace-grid{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr)}.task-sidebar{grid-column:1/-1;min-height:180px}.side-task-list{max-height:220px;grid-template-columns:repeat(3,minmax(0,1fr))}.side-task-all{margin-top:12px}}
@media(max-width:820px){.welcome-main{padding-bottom:88px!important}}
@media(max-width:620px){.app-shell{display:flex;flex-direction:row}.app-shell .sidebar{width:72px;height:100vh;min-height:100vh;padding:18px 8px}.app-shell .brand{padding:0;justify-content:center;font-size:0}.app-shell .brand-logo{width:54px;height:28px}.app-shell .brand>span:last-child{display:none}.app-shell .new-btn{font-size:0;margin:20px 0 14px;padding:0;text-align:center}.app-shell .new-btn:before{margin:0;font-size:24px}.app-shell .nav-item{font-size:0;justify-content:center;gap:0;padding:0}.app-shell .nav-item em{position:absolute;margin:0;transform:translate(13px,-13px);min-width:16px;height:16px;padding:0;font-size:9px}.app-shell .sidebar-foot .nav-item{font-size:0}.app-shell .main{width:calc(100% - 72px)}.app-shell .topbar{height:58px;padding:0 14px}.app-shell .content{min-height:calc(100vh - 58px);padding:16px 12px}}
dialog.settings-card{width:min(520px,calc(100vw - 32px));padding:0;border:1px solid #d5d5d5;border-radius:12px;background:#f1f1f1;color:#202124;box-shadow:0 24px 80px rgba(0,0,0,.42)}
dialog.settings-card::backdrop{background:rgba(0,0,0,.58)}
dialog.settings-card .dialog-head{padding:20px 22px 14px;border-bottom:1px solid #dedede}dialog.settings-card .dialog-head h3{color:#18191b}dialog.settings-card .dialog-head p{color:#777;margin-top:4px}dialog.settings-card .close-btn{color:#666;border-radius:7px}dialog.settings-card .close-btn:hover{background:#dedede;color:#111}
dialog.settings-card>form,dialog.settings-card form{padding:0 22px 20px}dialog.settings-card .help-copy{padding-top:16px;color:#4d4f53}dialog.settings-card .help-copy p{background:#e6e6e6;color:#4d4f53;border-radius:8px}
dialog.settings-card .account-summary,dialog.settings-card .balance-hero{background:#e4e4e4;color:#292a2c}dialog.settings-card .account-summary{margin-top:16px}dialog.settings-card .account-summary strong{color:#222}dialog.settings-card .account-summary small{color:#747474}dialog.settings-card .account-avatar{background:#16c4e8;color:#071216}dialog.settings-card .account-fields>div{background:#e4e4e4}dialog.settings-card .account-fields span{color:#777}dialog.settings-card .account-fields b{color:#222}dialog.settings-card .account-fields i{color:#079ab8}dialog.settings-card .balance-hero{margin-top:16px}dialog.settings-card .balance-hero strong{color:#222}dialog.settings-card .balance-hero strong i{color:#079ab8}dialog.settings-card .balance-hero small{color:#666}
dialog.settings-card label,dialog.settings-card .recharge-custom{color:#4e5053}dialog.settings-card input{background:#fff;border-color:#c8c8c8;color:#202124;border-radius:7px}dialog.settings-card input:focus{border-color:#16b8d8;box-shadow:0 0 0 2px rgba(22,196,232,.15)}dialog.settings-card .settings-divider{background:#d8d8d8}dialog.settings-card .demo-tip,dialog.settings-card .recharge-note{background:#e4e4e4;color:#686a6e}dialog.settings-card .recharge-option{background:#fff;border-color:#c9c9c9;color:#202124}dialog.settings-card .recharge-option:hover,dialog.settings-card .recharge-option.selected{background:#e5f8fb;border-color:#16c4e8}dialog.settings-card .recharge-option span{color:#777}dialog.settings-card .recharge-option em{color:#079ab8}dialog.settings-card .secondary-btn{background:#e3e3e3;border-color:#c4c4c4;color:#3c3d40}dialog.settings-card .secondary-btn:hover{background:#d8d8d8}dialog.settings-card .primary-btn{background:#1e2022;border-color:#1e2022;color:#fff}dialog.settings-card .primary-btn:hover{background:#080909}
.settings-card{width:min(520px,calc(100vw - 32px));padding:22px;background:#f1f1f1;color:#202124;border:1px solid #d5d5d5;border-radius:12px;box-shadow:0 24px 80px rgba(0,0,0,.42)}
dialog::backdrop{background:rgba(0,0,0,.58)}
.settings-card .dialog-head{padding:0 0 14px;border-bottom:1px solid #dedede}.settings-card .dialog-head h3{color:#18191b}.settings-card .dialog-head p{color:#777}.settings-card .close-btn{color:#666}.settings-card .close-btn:hover{background:#dedede;color:#111}
.settings-card .help-copy{padding-top:16px;color:#4d4f53}.settings-card .help-copy p{background:#e6e6e6;color:#4d4f53;border-radius:8px}.settings-card .account-summary,.settings-card .balance-hero{background:#e4e4e4;color:#292a2c}.settings-card .account-summary{margin-top:16px}.settings-card .account-summary strong{color:#222}.settings-card .account-summary small{color:#747474}.settings-card .account-fields>div{background:#e4e4e4}.settings-card .account-fields span{color:#777}.settings-card .account-fields b{color:#222}.settings-card .account-fields i,.settings-card .balance-hero strong i{color:#079ab8}.settings-card .balance-hero{margin-top:16px}.settings-card .balance-hero strong{color:#222}.settings-card .balance-hero small{color:#666}
.settings-card label,.settings-card .recharge-custom{color:#4e5053}.settings-card input{background:#fff;border-color:#c8c8c8;color:#202124;border-radius:7px}.settings-card input:focus{border-color:#16b8d8;box-shadow:0 0 0 2px rgba(22,196,232,.15)}.settings-card .settings-divider{background:#d8d8d8}.settings-card .demo-tip,.settings-card .recharge-note{background:#e4e4e4;color:#686a6e}.settings-card .recharge-option{background:#fff;border-color:#c9c9c9;color:#202124}.settings-card .recharge-option:hover,.settings-card .recharge-option.selected{background:#e5f8fb;border-color:#16c4e8}.settings-card .recharge-option span{color:#777}.settings-card .recharge-option em{color:#079ab8}.settings-card .secondary-btn{background:#e3e3e3;border-color:#c4c4c4;color:#3c3d40}.settings-card .secondary-btn:hover{background:#d8d8d8}.settings-card .primary-btn{background:#1e2022;border-color:#1e2022;color:#fff}.settings-card .primary-btn:hover{background:#080909}
