/*!*********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/site-navigation.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************/
.app-navigation{--nav-paper:#fffdf9;--nav-ink:#302d28;--nav-muted:#80786c;--nav-line:#e8e1d7;--nav-accent:#9e6247;--nav-soft:#f7efe5;flex:none;position:relative;z-index:45;color:var(--nav-ink);font:13px/1.5 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}.app-navigation[data-ui-style=purple]{--nav-paper:#faf7ff;--nav-ink:#392e4e;--nav-muted:#81728e;--nav-line:#e2d8ed;--nav-accent:#7954a1;--nav-soft:#efe6f7}.app-navigation[data-ui-style=sage]{--nav-paper:#f8faf5;--nav-ink:#2b3c30;--nav-muted:#72816a;--nav-line:#dce4d5;--nav-accent:#4f7059;--nav-soft:#e7eee1}.app-site-nav{background:var(--nav-paper);border-bottom:1px solid var(--nav-line);color:var(--nav-ink)}.app-nav-inner{max-width:1440px;margin:0 auto;min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 30px;flex-wrap:wrap}.app-nav-logo{flex:none}.app-navigation .site-logo{color:var(--nav-ink);font-size:22px;white-space:nowrap;text-decoration:none}.app-navigation .app-main-nav{display:flex;gap:25px;align-items:center;justify-content:center;flex:1 1;flex-wrap:wrap;margin:0;padding:0}.app-navigation .app-main-nav a{font-size:13px;text-decoration:none;color:var(--nav-muted);padding:8px 0;white-space:nowrap;position:relative}.app-navigation .app-main-nav a:hover,.app-navigation .app-main-nav a[aria-current=page]{color:var(--nav-ink)}.app-navigation .app-main-nav a[aria-current=page]::after{content:'';position:absolute;bottom:1px;left:0;right:0;height:2px;background:var(--nav-accent)}.app-nav-actions{display:flex;align-items:center;gap:12px;margin-left:auto;flex:none}.app-navigation .app-make-link{border:1px solid var(--nav-ink);background:var(--nav-ink);color:var(--nav-paper);padding:10px 15px;border-radius:7px;text-decoration:none;font-size:12px;font-weight:550;display:inline-flex;gap:12px;align-items:center;white-space:nowrap;min-height:40px}.app-navigation .app-make-link:hover{background:var(--nav-accent);border-color:var(--nav-accent)}.app-more{position:relative}.app-more>summary{list-style:none;display:flex;align-items:center;gap:5px;color:var(--nav-muted);cursor:pointer;padding:9px 7px;font-size:12px;min-height:40px;border-radius:6px}.app-more>summary::-webkit-details-marker{display:none}.app-more[open]>summary{background:var(--nav-soft);color:var(--nav-ink)}.app-more-menu{position:absolute;top:calc(100% + 12px);right:0;width:240px;padding:9px;background:var(--nav-paper);border:1px solid var(--nav-line);border-radius:10px;box-shadow:0 15px 45px #30241520;z-index:70;max-height:75dvh;overflow:auto}.app-navigation .app-more-menu>a{display:block;padding:10px 12px;border-radius:5px;color:var(--nav-ink);text-decoration:none;font-size:12px;overflow-wrap:anywhere}.app-navigation .app-more-menu>a:hover{background:var(--nav-soft)}.app-nav-appearance{border-top:1px solid var(--nav-line);padding:11px 10px 6px;margin-top:6px}.app-nav-appearance>span{font-size:10px;color:var(--nav-muted)}.app-nav-appearance>div{display:flex;gap:7px;margin-top:8px}.app-navigation .app-nav-appearance button{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;background:var(--nav-paper);color:var(--nav-muted);border:1px solid var(--nav-line);border-radius:5px;font:inherit;font-size:11px;cursor:pointer}.app-nav-appearance button i{width:10px;height:10px;border-radius:50%;border:1px solid var(--nav-line);background:#fffdf9}.app-nav-appearance button[data-style=purple] i{background:#c8b2e0}.app-nav-appearance button[data-style=sage] i{background:#9ab198}.app-navigation .app-nav-appearance button[aria-pressed=true]{border-color:var(--nav-accent);color:var(--nav-accent)}.app-navigation .app-menu-toggle{display:none;border:1px solid var(--nav-line);background:var(--nav-paper);color:var(--nav-ink);padding:8px;min-height:40px;min-width:40px;border-radius:6px;cursor:pointer}.app-navigation :focus-visible{outline:2px solid var(--nav-accent);outline-offset:3px}.app-navigation-error{display:flex;gap:10px;align-items:center;justify-content:center;padding:10px 20px;background:#fff1e6;color:#995037;border-bottom:1px solid #edcfb9;font-size:12px;flex-wrap:wrap}.app-navigation-error button{padding:6px 10px;border:1px solid #d8ad8b;background:#fffaf4;color:#8d5034;border-radius:5px;font:inherit;cursor:pointer}.studio .app-navigation,.workspace .app-navigation{flex:none}.home .app-navigation{position:relative;z-index:45}.planning-shell>.app-navigation,.identity-page>.app-navigation{max-width:none;width:100%}.app-resume-card{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:19px 22px;border:1px solid var(--home-line,#e5ded3);border-radius:10px;background:var(--home-surface,#fffdf9);margin:21px 0;max-width:780px}.app-resume-card small{font-size:10px;color:var(--home-muted,#80786c)}.app-resume-card strong{display:block;font-size:16px;font-weight:550;color:var(--home-ink,#302d28);margin:4px 0;overflow-wrap:anywhere}.app-resume-card p{font-size:11px;color:var(--home-muted,#80786c);margin:0}.app-resume-card button,.app-resume-card a{border:1px solid var(--home-accent,#9e6247);background:var(--home-accent,#9e6247);color:white;border-radius:6px;padding:10px 14px;font:inherit;font-size:12px;text-decoration:none;white-space:nowrap;cursor:pointer}.workspace-shell{min-height:100dvh;background:#faf8f3;color:#302d28}.workspace-main{max-width:1100px;padding:35px 24px 70px;margin:auto}.workspace-title{display:flex;justify-content:space-between;gap:20px;align-items:center}.workspace-title h1{font-size:31px;font-weight:550;margin:0 0 10px}.workspace-title p{font-size:12px;color:#80786c}.workspace-title a{font-size:12px;color:#9e6247}.workspace-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-gap:22px;gap:22px;margin-top:25px}.workspace-card{padding:21px;background:#fffdf9;border:1px solid #e5ded3;border-radius:10px;min-width:0}.workspace-card h2{font-size:17px;font-weight:550;overflow-wrap:anywhere}.workspace-card p{font-size:11px;color:#80786c}.workspace-card-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.workspace-card-actions a,.workspace-card-actions button{padding:8px 12px;border:1px solid #d6c5b2;border-radius:6px;background:#fffdf9;color:#8f5f42;font:inherit;font-size:12px;text-decoration:none;cursor:pointer}@media(max-width:1000px){.app-nav-inner{gap:14px;padding-inline:20px}.app-navigation .app-main-nav{gap:18px}.app-navigation .site-logo{font-size:20px}}@media(max-width:850px){.app-nav-inner{padding:12px 17px;min-height:68px;gap:12px}.app-navigation .app-main-nav{display:none;order:3;flex-basis:100%;justify-content:flex-start;gap:0;border-top:1px solid var(--nav-line);padding-top:7px}.app-navigation .app-main-nav[data-open=true]{display:flex}.app-navigation .app-main-nav a{padding:11px 14px;flex:1 1;text-align:center}.app-navigation .app-main-nav a[aria-current=page]::after{left:14px;right:14px}.app-navigation .app-menu-toggle{display:inline-flex;align-items:center;justify-content:center}.app-nav-actions{gap:6px}.app-more>summary>span{display:none}.app-navigation .app-make-link{padding:9px 11px;gap:6px}.app-navigation .site-logo{font-size:18px}.workspace-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio .agent-sidebar{top:calc(var(--app-navigation-height,68px) + 56px)}}@media(max-width:520px){.app-nav-inner{gap:7px;padding-inline:13px}.app-navigation .site-logo{font-size:16px}.app-navigation .logo-mark{width:28px;height:28px;margin-right:6px}.app-navigation .app-make-link{font-size:11px;padding:8px 9px;min-height:36px}.app-more>summary{padding:7px 4px;min-height:36px}.app-navigation .app-menu-toggle{min-height:36px;min-width:36px;padding:6px}.app-nav-actions{gap:4px}.app-more-menu{right:-35px;width:min(250px,calc(100vw - 28px))}.app-resume-card{align-items:flex-start;flex-wrap:wrap;padding:16px}.app-resume-card strong{font-size:15px}.workspace-grid{grid-template-columns:1fr}.workspace-main{padding:26px 17px 45px}.workspace-title{align-items:flex-start;flex-direction:column}.workspace-title h1{font-size:26px}}@media(prefers-reduced-motion:reduce){.app-navigation *{scroll-behavior:auto!important}}

/* Account and navigation spacing */
.app-nav-inner{column-gap:32px}.app-navigation .app-main-nav{gap:clamp(26px,2.7vw,42px)}.app-navigation .app-account-link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--nav-ink);font-size:12px;white-space:nowrap;padding:7px 2px;min-height:38px;box-sizing:border-box}.app-account-avatar{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--nav-line);background:var(--nav-soft);font-size:12px;color:var(--nav-accent)}.app-navigation .app-account-link:hover{color:var(--nav-accent)}@media(max-width:1200px){.app-nav-inner{column-gap:18px}.app-navigation .app-main-nav{gap:24px}.app-nav-actions{gap:9px}}@media(max-width:1000px) and (min-width:851px){.app-navigation .app-main-nav{gap:16px}.app-navigation .app-account-link{gap:5px;font-size:11px}.app-nav-inner{padding-inline:16px;column-gap:14px}.app-navigation .app-make-link{padding-inline:11px}}@media(max-width:850px){.app-navigation .app-main-nav{gap:0}.app-navigation .app-account-link{gap:5px}}@media(max-width:520px){.app-navigation .app-account-link{padding:0;min-height:36px}.app-navigation .app-account-link>span:last-child{font-size:10px;max-width:44px;white-space:normal;line-height:1.4}.app-account-avatar{display:none}.app-nav-inner{column-gap:5px}}

.app-navigation .app-avatar-menu>summary{padding:3px;min-width:40px;min-height:40px;display:grid;place-items:center;border:0;background:transparent;list-style:none}.app-navigation .app-avatar-menu>summary .app-account-avatar{display:grid;width:38px;height:38px;font-size:15px}.app-account-menu-heading{padding:10px 12px;border-bottom:1px solid var(--nav-line);margin-bottom:5px;overflow-wrap:anywhere}.app-account-menu-heading strong,.app-account-menu-heading small{display:block}.app-account-menu-heading strong{color:var(--nav-ink);font-size:13px}.app-account-menu-heading small{color:var(--nav-muted);font-size:10px;margin-top:4px}.app-avatar-menu .app-more-menu{right:0}@media(max-width:520px){.app-navigation .app-avatar-menu>summary .app-account-avatar{display:grid;width:33px;height:33px}.app-navigation .app-avatar-menu>summary{min-width:36px;min-height:36px}}
.app-account-avatar img,.personal-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.app-more-menu>button{border:0;background:transparent;text-align:left;padding:12px 16px;cursor:pointer;color:inherit;font:inherit}.app-more-menu>button:hover{background:#f0edf8}
.profile-dialog{width:min(520px,calc(100vw - 32px));max-height:90dvh;overflow:auto;border:1px solid #ddd7ec;border-radius:24px;padding:28px;color:#302a3d;box-shadow:0 24px 100px #21143040}.profile-dialog::-webkit-backdrop{background:#201a3266;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.profile-dialog::backdrop{background:#201a3266;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.profile-dialog form{display:grid;grid-gap:16px;gap:16px}.profile-dialog label{display:grid;grid-gap:7px;gap:7px}.profile-dialog input,.profile-dialog textarea{width:100%;padding:12px;border:1px solid #ddd7e6;border-radius:10px;font:inherit}.profile-avatar-preview{display:flex;align-items:center;flex-wrap:wrap;gap:16px}.profile-avatar-preview>img,.profile-avatar-preview>span{width:72px;height:72px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:#ebe3f7}.profile-avatar-preview label{max-width:260px}.personal-avatar{overflow:hidden;flex-shrink:0}

/* Compact, equal rows in the signed-in avatar menu. */
.app-navigation .app-avatar-menu .app-more-menu{min-width:154px;width:154px;padding:5px}
.app-navigation .app-avatar-menu .app-more-menu>a,.app-navigation .app-avatar-menu .app-more-menu>button{display:flex;align-items:center;width:100%;min-height:32px;margin:0;padding:7px 10px;border:0;border-radius:7px;background:transparent;box-shadow:none;color:inherit;font:inherit;font-size:12px;line-height:18px;text-align:left;justify-content:flex-start}
.app-navigation .app-avatar-menu .app-more-menu>a:hover,.app-navigation .app-avatar-menu .app-more-menu>button:hover{background:rgba(128,96,197,.1)}

/* Navbar Notification Bell & Popover */
.app-nav-notif-wrap{position:relative;display:flex;align-items:center}
.app-nav-notif-btn{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--nav-line,#e8e1d7);background:var(--nav-paper,#fffdf9);color:var(--nav-ink,#302d28);cursor:pointer;transition:all .15s}
.app-nav-notif-btn:hover{background:var(--nav-soft,#f7efe5);border-color:var(--nav-accent,#9e6247);color:var(--nav-accent,#9e6247)}
.app-nav-notif-badge{position:absolute;top:-3px;right:-3px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#d9482b;color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(217,72,43,.4);border:2px solid var(--nav-paper,#fffdf9)}
.app-notif-popover{position:absolute;top:calc(100% + 10px);right:-20px;width:330px;max-width:calc(100vw - 32px);background:#fffdf9;border:1px solid var(--nav-line,#e8e1d7);border-radius:14px;box-shadow:0 16px 45px rgba(48,45,40,.16);z-index:100;overflow:hidden;animation:fadeIn .15s ease}
.app-notif-popover-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--nav-line,#e8e1d7);background:var(--nav-soft,#f7efe5)}
.app-notif-popover-head strong{font-size:13px;color:var(--nav-ink,#302d28);display:flex;align-items:center;gap:6px}
.app-notif-popover-head small{font-size:11px;color:var(--nav-accent,#9e6247);font-weight:600}
.app-notif-readall{background:none;border:0;color:var(--nav-accent,#9e6247);font-size:11.5px;cursor:pointer;padding:2px 4px}
.app-notif-readall:hover{text-decoration:underline}
.app-notif-popover-body{max-height:340px;overflow-y:auto}
.app-notif-empty{padding:28px 16px;text-align:center;font-size:12.5px;color:var(--nav-muted,#80786c);margin:0}
.app-notif-popover-item{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-bottom:1px solid #f2ece3;transition:background .12s}
.app-notif-popover-item.unread{background:#fffbf7}
.app-notif-popover-item.read{opacity:.72}
.app-notif-popover-item:hover{background:#fbf8f2}
.app-notif-item-content{flex:1 1;min-width:0}
.app-notif-item-content h4{margin:0 0 4px;font-size:12.5px;font-weight:600;color:var(--nav-ink,#302d28);line-height:1.35}
.app-notif-item-content p{margin:0 0 6px;font-size:11.5px;color:var(--nav-muted,#80786c);line-height:1.45;overflow-wrap:anywhere}
.app-notif-item-time{font-size:10px;color:#a49b8e}
.app-notif-ack-btn{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid var(--nav-line,#e8e1d7);background:#fff;color:var(--nav-muted,#80786c);display:grid;place-items:center;cursor:pointer;transition:all .12s}
.app-notif-ack-btn:hover{border-color:#84cc16;color:#65a30d;background:#f7fee7}
.app-notif-popover-footer{padding:9px 16px;text-align:center;border-top:1px solid var(--nav-line,#e8e1d7);background:#faf7f2}
.app-notif-popover-footer a{font-size:11.5px;color:var(--nav-accent,#9e6247);text-decoration:none}
.app-notif-popover-footer a:hover{text-decoration:underline}

/*!***************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/workspace.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************/
/* Template cards (studio design tab + workspace library): mini layout per template + palette dots */
.template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:10px;gap:10px}
.template-card{display:flex;flex-direction:column;gap:7px;padding:7px 7px 9px;border:1px solid #e9ece7;border-radius:11px;background:#fff;transition:border-color .15s,box-shadow .15s,transform .15s}
.template-card:hover{border-color:#cfd4cc;transform:translateY(-1px);box-shadow:0 8px 22px rgba(20,24,20,.07)}
.template-card.active{border-color:var(--orange,#ed694a);box-shadow:0 0 0 3px rgba(237,105,74,.14)}
.tpl-main{display:flex;flex-direction:column;gap:7px;padding:0;border:0;background:none;text-align:left;cursor:pointer;font:inherit;color:inherit}
.tpl-main:focus-visible,.tpl-sw:focus-visible{outline:2px solid var(--orange,#ed694a);outline-offset:2px}
.template-name{display:flex;flex-direction:column;gap:2px;min-width:0;padding:0 2px}
.template-name strong{font-size:12.5px;color:var(--ink,#1d1f1c)}
.template-name small{font-size:11px;color:var(--muted,#777b74);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.template-tip{margin:8px 0 12px;font-size:12px;color:var(--muted,#777b74);line-height:1.6}
.tpl-swatches{display:flex;flex-wrap:wrap;gap:5px;padding:0 2px}
.tpl-sw{width:16px;height:16px;padding:0;border:2px solid #fff;border-radius:50%;background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%);box-shadow:0 0 0 1px rgba(0,0,0,.14);cursor:pointer;transition:transform .12s}
.tpl-sw:hover{transform:scale(1.18)}
.tpl-sw.active{box-shadow:0 0 0 2px var(--ink,#1d1f1c)}
.tpl-mini{position:relative;display:block;height:86px;border:1px solid var(--bd);border-radius:8px;overflow:hidden;background:var(--bg);transition:background .2s}
.tpl-mini i{position:absolute;display:block;border-radius:2px;transition:background .2s,border-color .2s}
/* classic: nav, title, button, three cards */
[data-tpl=classic] .m1{left:8px;top:8px;width:20px;height:4px;background:var(--ink)}
[data-tpl=classic] .m2{right:8px;top:7px;width:14px;height:6px;border-radius:3px;background:var(--ac)}
[data-tpl=classic] .m3{left:8px;top:22px;width:58%;height:7px;background:var(--ink)}
[data-tpl=classic] .m4{left:8px;top:33px;width:40%;height:4px;background:var(--mt);opacity:.6}
[data-tpl=classic] .m5{left:8px;top:43px;width:24px;height:7px;border-radius:4px;background:var(--ac)}
[data-tpl=classic] .m6,[data-tpl=classic] .m7,[data-tpl=classic] .m8{bottom:7px;width:calc((100% - 24px)/3);height:16px;background:var(--sf);border:1px solid var(--bd)}
[data-tpl=classic] .m6{left:8px}
[data-tpl=classic] .m7{left:calc(12px + (100% - 24px)/3)}
[data-tpl=classic] .m8{right:8px}
/* magazine: rules, masthead, columns */
[data-tpl=magazine] .m1{left:8px;right:8px;top:8px;height:1px;background:var(--ink)}
[data-tpl=magazine] .m2{left:8px;top:13px;width:64%;height:12px;background:var(--ink);border-radius:0}
[data-tpl=magazine] .m3{left:8px;right:8px;top:30px;height:2px;background:var(--ink)}
[data-tpl=magazine] .m4{left:8px;top:38px;width:38%;height:40px;background:var(--ac);border-radius:0;opacity:.85}
[data-tpl=magazine] .m5{left:calc(38% + 14px);top:38px;width:1px;height:40px;background:var(--bd)}
[data-tpl=magazine] .m6{left:calc(38% + 20px);right:8px;top:40px;height:3px;background:var(--mt);opacity:.6;box-shadow:0 7px 0 var(--mt),0 14px 0 var(--mt)}
[data-tpl=magazine] .m7{left:calc(38% + 20px);right:20px;top:64px;height:3px;background:var(--mt);opacity:.6;box-shadow:0 7px 0 var(--mt)}
[data-tpl=magazine] .m8{right:8px;top:15px;width:12px;height:8px;border:1px solid var(--ink);border-radius:0}
/* glass: soft blobs behind a frosted card */
[data-tpl=glass] .m1{left:-10px;top:-14px;width:60px;height:60px;border-radius:50%;background:var(--ac);filter:blur(8px);opacity:.75}
[data-tpl=glass] .m2{right:-6px;bottom:-16px;width:66px;height:66px;border-radius:50%;background:var(--mt);filter:blur(10px);opacity:.5}
[data-tpl=glass] .m3{left:16%;right:16%;top:16px;bottom:14px;border-radius:9px;background:rgba(255,255,255,.28);border:1px solid rgba(255,255,255,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 6px 18px rgba(0,0,0,.08)}
[data-tpl=glass] .m4{left:calc(16% + 9px);top:26px;width:40%;height:6px;background:var(--ink);border-radius:3px}
[data-tpl=glass] .m5{left:calc(16% + 9px);top:37px;width:30%;height:4px;background:var(--ink);opacity:.45;border-radius:2px}
[data-tpl=glass] .m6{left:calc(16% + 9px);top:52px;width:28px;height:9px;border-radius:9px;background:var(--ac)}
[data-tpl=glass] .m7{right:calc(16% + 9px);top:24px;width:16px;height:16px;border-radius:50%;background:rgba(255,255,255,.6)}
[data-tpl=glass] .m8{display:none!important}
/* brutal: thick outlines, hard offset shadows */
[data-tpl=brutal] i{border:2px solid var(--ink);border-radius:0!important}
[data-tpl=brutal] .m1{left:-2px;right:-2px;top:-2px;height:14px;background:var(--ac)}
[data-tpl=brutal] .m2{left:8px;top:20px;width:62%;height:12px;background:var(--ink)}
[data-tpl=brutal] .m3{left:8px;top:40px;width:30px;height:12px;background:var(--ac);box-shadow:3px 3px 0 var(--ink)}
[data-tpl=brutal] .m4{right:10px;top:22px;width:24%;height:30px;background:var(--sf);box-shadow:4px 4px 0 var(--ink);transform:rotate(4deg)}
[data-tpl=brutal] .m5{left:8px;bottom:8px;width:40%;height:16px;background:var(--sf);box-shadow:3px 3px 0 var(--ink)}
[data-tpl=brutal] .m6{right:10px;bottom:8px;width:40%;height:16px;background:var(--ac);box-shadow:3px 3px 0 var(--ink)}
[data-tpl=brutal] .m7,[data-tpl=brutal] .m8{display:none!important}
/* bento: tile grid */
[data-tpl=bento] i{border-radius:5px;background:var(--sf);border:1px solid var(--bd)}
[data-tpl=bento] .m1{left:6px;top:6px;width:calc(55% - 9px);height:44px;background:var(--ac);border-color:transparent}
[data-tpl=bento] .m2{left:55%;top:6px;right:6px;height:20px}
[data-tpl=bento] .m3{left:55%;top:30px;width:calc(22% - 2px);height:20px}
[data-tpl=bento] .m4{left:calc(77% + 2px);top:30px;right:6px;height:20px;background:var(--ink)}
[data-tpl=bento] .m5{left:6px;top:54px;width:calc(30% - 6px);bottom:6px}
[data-tpl=bento] .m6{left:30%;top:54px;width:calc(40% - 4px);bottom:6px}
[data-tpl=bento] .m7{left:70%;top:54px;right:6px;bottom:6px;background:var(--ac);opacity:.35}
[data-tpl=bento] .m8{left:12px;top:14px;width:30px;height:5px;background:#fff;border:0;opacity:.85}
/* swiss: huge type block, red square, strict rules */
[data-tpl=swiss] i{border-radius:0!important}
[data-tpl=swiss] .m1{left:8px;top:8px;width:54%;height:30px;background:var(--ink)}
[data-tpl=swiss] .m2{right:8px;top:8px;width:22px;height:22px;background:var(--ac)}
[data-tpl=swiss] .m3{left:8px;right:8px;top:46px;height:2px;background:var(--ink)}
[data-tpl=swiss] .m4{left:8px;top:54px;width:22%;height:3px;background:var(--ink);box-shadow:0 6px 0 var(--ink),0 12px 0 var(--ink)}
[data-tpl=swiss] .m5{left:36%;top:54px;width:22%;height:3px;background:var(--mt);box-shadow:0 6px 0 var(--mt),0 12px 0 var(--mt)}
[data-tpl=swiss] .m6{left:64%;top:54px;width:22%;height:3px;background:var(--mt);box-shadow:0 6px 0 var(--mt)}
[data-tpl=swiss] .m7{left:8px;right:8px;bottom:6px;height:1px;background:var(--ink)}
[data-tpl=swiss] .m8{display:none!important}
/* playful: bouncy blobs, tilted cards */
[data-tpl=playful] .m1{right:-12px;top:-12px;width:48px;height:48px;border-radius:50%;background:var(--ac);opacity:.35}
[data-tpl=playful] .m2{left:10px;top:12px;width:52%;height:9px;border-radius:9px;background:var(--ink)}
[data-tpl=playful] .m3{left:10px;top:27px;width:30px;height:10px;border-radius:10px;background:var(--ac);box-shadow:0 3px 0 rgba(0,0,0,.18)}
[data-tpl=playful] .m4{left:10px;bottom:9px;width:28%;height:28px;border-radius:12px;background:var(--sf);border:2px solid var(--ink);transform:rotate(-5deg)}
[data-tpl=playful] .m5{left:38%;bottom:12px;width:26%;height:28px;border-radius:12px;background:var(--ac);transform:rotate(4deg)}
[data-tpl=playful] .m6{right:10px;bottom:9px;width:24%;height:28px;border-radius:12px;background:var(--sf);border:2px solid var(--ink);transform:rotate(-3deg)}
[data-tpl=playful] .m7{right:30%;top:14px;width:10px;height:10px;border-radius:50%;background:var(--ac)}
[data-tpl=playful] .m8{right:22%;top:30px;width:6px;height:6px;border-radius:50%;background:var(--ink);opacity:.4}
/* elegant: arch window, thin gold rules, centered */
[data-tpl=elegant] .m1{left:50%;top:8px;width:40px;height:52px;margin-left:-20px;border-radius:20px 20px 0 0;background:var(--sf);border:1px solid var(--ac)}
[data-tpl=elegant] .m2{left:50%;top:14px;width:28px;height:40px;margin-left:-14px;border-radius:14px 14px 0 0;background:var(--ac);opacity:.25}
[data-tpl=elegant] .m3{left:14%;top:34px;width:20%;height:1px;background:var(--ac)}
[data-tpl=elegant] .m4{right:14%;top:34px;width:20%;height:1px;background:var(--ac)}
[data-tpl=elegant] .m5{left:28%;top:66px;width:44%;height:5px;background:var(--ink)}
[data-tpl=elegant] .m6{left:37%;top:75px;width:26%;height:3px;background:var(--mt);opacity:.6}
[data-tpl=elegant] .m7{left:8px;top:8px;width:6px;height:6px;border:1px solid var(--ac);transform:rotate(45deg)}
[data-tpl=elegant] .m8{right:8px;top:8px;width:6px;height:6px;border:1px solid var(--ac);transform:rotate(45deg)}
/* future: glow orb, grid floor, neon card */
[data-tpl=future] .m1{inset:0;border-radius:0;background-image:linear-gradient(var(--bd) 1px,transparent 1px),linear-gradient(90deg,var(--bd) 1px,transparent 1px);background-size:12px 12px;opacity:.6}
[data-tpl=future] .m2{left:50%;top:-30px;width:110px;height:70px;margin-left:-55px;border-radius:50%;background:var(--ac);filter:blur(18px);opacity:.55}
[data-tpl=future] .m3{left:25%;top:18px;width:50%;height:8px;background:var(--ink);border-radius:4px}
[data-tpl=future] .m4{left:35%;top:32px;width:30%;height:4px;background:var(--mt);opacity:.7}
[data-tpl=future] .m5{left:22%;bottom:10px;width:56%;height:28px;border-radius:6px;background:var(--sf);border:1px solid var(--ac);box-shadow:0 0 12px var(--ac)}
[data-tpl=future] .m6{left:calc(22% + 8px);bottom:22px;width:24%;height:3px;background:var(--ac)}
[data-tpl=future] .m7{right:calc(22% + 8px);bottom:18px;width:10px;height:10px;border-radius:50%;background:var(--ac);box-shadow:0 0 8px var(--ac)}
[data-tpl=future] .m8{display:none!important}
/* organic: blob shapes, wave */
[data-tpl=organic] .m1{left:-14px;top:10px;width:74px;height:64px;border-radius:58% 42% 50% 50%/45% 55% 45% 55%;background:var(--ac);opacity:.3}
[data-tpl=organic] .m2{right:12px;top:10px;width:46px;height:46px;border-radius:42% 58% 63% 37%/50% 40% 60% 50%;background:var(--sf);border:1px solid var(--bd)}
[data-tpl=organic] .m3{left:14px;top:22px;width:44%;height:7px;border-radius:7px;background:var(--ink)}
[data-tpl=organic] .m4{left:14px;top:34px;width:32%;height:4px;border-radius:4px;background:var(--mt);opacity:.7}
[data-tpl=organic] .m5{left:14px;top:46px;width:30px;height:9px;border-radius:9px;background:var(--ac)}
[data-tpl=organic] .m6{left:-10%;right:-10%;bottom:-22px;height:40px;border-radius:50%;background:var(--ac);opacity:.22}
[data-tpl=organic] .m7{right:24px;top:22px;width:22px;height:22px;border-radius:50%;background:var(--ac);opacity:.6}
[data-tpl=organic] .m8{display:none!important}
/* saas: headline + product window mock */
[data-tpl=saas] .m1{left:8px;top:10px;width:36%;height:7px;background:var(--ink);border-radius:3px}
[data-tpl=saas] .m2{left:8px;top:22px;width:28%;height:4px;background:var(--mt);opacity:.6}
[data-tpl=saas] .m3{left:8px;top:32px;width:22px;height:8px;border-radius:4px;background:var(--ac)}
[data-tpl=saas] .m4{left:34px;top:32px;width:22px;height:8px;border-radius:4px;border:1px solid var(--bd);background:var(--sf)}
[data-tpl=saas] .m5{left:46%;right:-4px;top:10px;bottom:-6px;border-radius:6px 0 0 0;background:var(--sf);border:1px solid var(--bd);box-shadow:0 8px 20px rgba(0,0,0,.08)}
[data-tpl=saas] .m6{left:46%;right:-4px;top:10px;height:9px;border-radius:6px 0 0 0;background:var(--bd)}
[data-tpl=saas] .m7{left:calc(46% + 8px);top:26px;width:18%;height:40px;border-radius:3px;background:var(--ac);opacity:.18}
[data-tpl=saas] .m8{left:calc(64% + 14px);right:6px;top:26px;height:22px;border-radius:3px;background:linear-gradient(to top,var(--ac) 0 40%,transparent 40%);opacity:.8}
/* gallery: image mosaic */
[data-tpl=gallery] .m1{left:6px;top:6px;width:calc(46% - 6px);height:calc(100% - 22px);background:var(--ac);opacity:.85}
[data-tpl=gallery] .m2{left:calc(46% + 4px);top:6px;width:calc(27% - 4px);height:36px;background:var(--mt);opacity:.55}
[data-tpl=gallery] .m3{left:calc(73% + 4px);top:6px;right:6px;height:50px;background:var(--ink);opacity:.8}
[data-tpl=gallery] .m4{left:calc(46% + 4px);top:46px;width:calc(27% - 4px);height:24px;background:var(--ac);opacity:.45}
[data-tpl=gallery] .m5{left:calc(73% + 4px);top:60px;right:6px;height:10px;background:var(--mt);opacity:.4}
[data-tpl=gallery] .m6{left:6px;bottom:5px;width:30%;height:4px;background:var(--ink)}
[data-tpl=gallery] .m7{right:6px;bottom:5px;width:14%;height:4px;background:var(--mt);opacity:.6}
[data-tpl=gallery] .m8{display:none!important}

.template-tip{margin:8px 0 12px;font-size:12px;color:var(--muted,#777b74);line-height:1.6}

/* Workspace overlay */
.workspace{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;background:#eef0ec;color:var(--ink,#1d1f1c);font-size:13px;animation:wsIn .18s ease-out}
@keyframes wsIn{from{opacity:0;transform:scale(.99)}to{opacity:1;transform:none}}
.workspace button{font:inherit;color:inherit}
.ws-header{display:flex;align-items:center;gap:16px;height:56px;padding:0 16px;background:#fff;border-bottom:1px solid #e7e7e2;flex:none}
.ws-title{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1}
.ws-title div{display:flex;flex-direction:column;min-width:0}
.ws-title strong{font-size:14px}
.ws-title small{color:var(--muted,#777b74);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-logo{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--orange,#ed694a);color:#fff;font-size:16px}
.ws-tools{display:flex;align-items:center;gap:8px}
.ws-icon{display:grid;place-items:center;width:32px;height:32px;border:1px solid #e9ece7;border-radius:7px;background:#fff;cursor:pointer}
.ws-icon:disabled{opacity:.4;cursor:default}
.ws-icon:not(:disabled):hover{background:#f4f5f2}
.ws-sep{width:1px;height:22px;background:#e7e7e2}
.ws-switch{display:flex;padding:2px;border-radius:8px;background:#f1f2ef}
.ws-switch button{display:flex;align-items:center;gap:5px;height:28px;padding:0 10px;border:0;border-radius:6px;background:transparent;cursor:pointer;color:#5d625b}
.ws-switch button.active{background:#fff;color:var(--ink,#1d1f1c);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.ws-done{height:34px;padding:0 18px;border:0;border-radius:8px;background:var(--ink,#1d1f1c);color:#fff!important;font-weight:600;cursor:pointer}
.ws-done:hover{opacity:.88}
.ws-body{flex:1 1;display:grid;grid-template-columns:268px minmax(0,1fr) 292px;min-height:0}
.ws-library,.ws-inspector{display:flex;flex-direction:column;min-height:0;background:#fff}
.ws-library{border-right:1px solid #e7e7e2}
.ws-inspector{border-left:1px solid #e7e7e2}
.ws-lib-tabs{display:flex;gap:2px;padding:10px 10px 0;border-bottom:1px solid #eeefeb;flex:none}
.ws-lib-tabs button{flex:1 1;height:34px;border:0;border-bottom:2px solid transparent;background:none;color:#6c7069;cursor:pointer;font-weight:500}
.ws-lib-tabs button.active{color:var(--ink,#1d1f1c);border-bottom-color:var(--orange,#ed694a)}
.ws-search{display:flex;align-items:center;gap:6px;margin:10px 12px 2px;padding:0 10px;height:32px;border:1px solid #e9ece7;border-radius:7px;color:#8a8e86;flex:none}
.ws-search input{flex:1 1;border:0;outline:0;background:none;font:inherit;color:var(--ink,#1d1f1c);min-width:0}
.ws-lib-scroll,.ws-inspector-scroll{flex:1 1;overflow-y:auto;padding:4px 12px 16px;min-height:0}
.ws-group{margin:14px 0 8px;font-size:11.5px;font-weight:600;color:#8a8e86;letter-spacing:.04em}
.ws-tiles{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:6px;gap:6px}
.ws-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;height:66px;padding:4px;border:1px solid #eeefeb;border-radius:8px;background:#fafaf8;cursor:-webkit-grab;cursor:grab;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:12px;color:#4b4f48}
.ws-tile:hover{border-color:var(--orange,#ed694a);background:#fff;color:var(--ink,#1d1f1c);box-shadow:0 4px 12px rgba(237,105,74,.12)}
.ws-tile:active{cursor:-webkit-grabbing;cursor:grabbing}
.ws-tile-glyph{display:grid;place-items:center;width:26px;height:26px;border-radius:6px;background:#fff;border:1px solid #ebece8;font-size:14px;line-height:1;flex:none}
.ws-combos{display:grid;grid-gap:8px;gap:8px;margin-top:10px}
.ws-combo{display:flex;flex-direction:column;gap:3px;padding:8px;border:1px solid #eeefeb;border-radius:9px;background:#fafaf8;text-align:left;cursor:-webkit-grab;cursor:grab;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}
.ws-combo:hover{border-color:var(--orange,#ed694a);background:#fff}
.ws-combo strong{font-size:12.5px}
.ws-combo small{color:var(--muted,#777b74);font-size:11px}
.ws-combo-art{position:relative;display:block;height:70px;margin-bottom:4px;border-radius:6px;background:#fff;border:1px solid #eeefeb;overflow:hidden}
.ws-combo-art i{position:absolute;display:block;border-radius:3px;background:#e4e6e1}
.ws-combo-art i.k-box,.ws-combo-art i.k-card{background:#f3f4f1;border:1px solid #e4e6e1}
.ws-combo-art i.k-button{background:var(--orange,#ed694a);opacity:.85}
.ws-combo-art i.k-heading{background:#2a2d28;opacity:.7}
.ws-combo-art i.k-input,.ws-combo-art i.k-textarea,.ws-combo-art i.k-select{background:#fff;border:1px solid #d8dad4}
.ws-sections{display:grid;grid-gap:6px;gap:6px;margin-top:10px}
.ws-section-tile{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid #eeefeb;border-radius:8px;background:#fafaf8;text-align:left;cursor:-webkit-grab;cursor:grab;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}
.ws-section-tile>span:nth-child(2){flex:1 1;display:flex;flex-direction:column;min-width:0}
.ws-section-tile small{color:var(--muted,#777b74);font-size:11px}
.ws-section-tile:hover{border-color:var(--orange,#ed694a);background:#fff}
.ws-section-tile.featured{border-color:rgba(237,105,74,.4);background:#fff7f4}
.ws-lib-foot{margin:0;padding:9px 12px;border-top:1px solid #eeefeb;font-size:11px;color:#8a8e86;flex:none}
.ws-note{margin:12px 0;font-size:12px;color:var(--muted,#777b74);line-height:1.6}
.ws-stage{position:relative;display:flex;flex-direction:column;align-items:center;min-width:0;min-height:0;padding:18px;overflow:auto}
.ws-frame{flex:1 1;width:100%;min-height:0;background:#fff;border-radius:10px;box-shadow:0 10px 40px rgba(20,24,20,.10),0 0 0 1px rgba(20,24,20,.06);overflow:hidden;transition:width .25s ease}
.ws-frame iframe{display:block;width:100%;height:100%;border:0;background:#fff}
.ws-frame.ws-tablet{width:768px;max-width:100%}
.ws-frame.ws-mobile{width:390px;max-width:100%;border-radius:22px}
.ws-stage-note{margin-top:10px;font-size:12px;color:#777b74}
.ws-panel{padding-top:12px}
.ws-el-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.ws-el-head div{display:flex;flex-direction:column;min-width:0}
.ws-el-head small{color:var(--muted,#777b74);font-size:11.5px;line-height:1.5}
.ws-glyph{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;background:#fff4f0;color:var(--orange,#ed694a);font-size:16px;flex:none}
.ws-glyph.sm{width:24px;height:24px;font-size:12px;border-radius:6px}
.ws-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(56px,1fr));grid-gap:5px;gap:5px;margin-bottom:6px}
.ws-actions button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;border:1px solid #e9ece7;border-radius:7px;background:#fff;cursor:pointer;font-size:11.5px}
.ws-actions button:hover{background:#f6f7f4}
.ws-actions button.danger{color:#c2412d}
.ws-actions button.danger:hover{background:#fff1ee;border-color:#f3c5bb}
.ws-label{margin:16px 0 7px;font-size:11.5px;font-weight:600;color:#8a8e86;letter-spacing:.04em}
.ws-textarea,.ws-field input:not([type=range]),.ws-num input,.ws-num select{width:100%;box-sizing:border-box;border:1px solid #e3e5df;border-radius:7px;background:#fff;font:inherit;color:var(--ink,#1d1f1c);outline:0}
.ws-textarea{padding:8px 10px;resize:vertical;line-height:1.55}
.ws-textarea:focus,.ws-field input:focus,.ws-num input:focus,.ws-num select:focus{border-color:var(--orange,#ed694a);box-shadow:0 0 0 3px rgba(237,105,74,.12)}
.ws-hint{display:block;margin-top:4px;color:#8a8e86;font-size:11px}
.ws-field{display:flex;flex-direction:column;gap:5px;margin-top:10px}
.ws-field>span{font-size:12px;color:#5d625b}
.ws-field input:not([type=range]){height:32px;padding:0 10px}
.ws-field input[type=range]{accent-color:var(--orange,#ed694a)}
.ws-grid2{display:grid;grid-template-columns:1fr 1fr;grid-gap:6px;gap:6px}
.ws-num{position:relative;display:flex;align-items:center;gap:6px}
.ws-num>span{width:28px;font-size:12px;color:#5d625b;flex:none}
.ws-num input,.ws-num select{height:30px;padding:0 22px 0 8px}
.ws-num select{padding-right:4px}
.ws-num small{position:absolute;right:8px;font-size:10.5px;color:#9a9e96;pointer-events:none}
.ws-color{display:flex;align-items:center;gap:8px;height:34px}
.ws-color>span{width:58px;font-size:12px;color:#5d625b}
.ws-color input{width:28px;height:24px;padding:0;border:1px solid #e3e5df;border-radius:5px;background:none;cursor:pointer}
.ws-color code{flex:1 1;font-size:11.5px;color:#7a7e76}
.ws-color button{display:grid;place-items:center;width:22px;height:22px;border:0;border-radius:5px;background:#f2f3f0;cursor:pointer}
.ws-seg{display:flex;margin-top:8px;padding:2px;border-radius:7px;background:#f1f2ef}
.ws-seg button{flex:1 1;height:26px;border:0;border-radius:5px;background:none;font-size:11.5px;color:#5d625b;cursor:pointer}
.ws-seg button.active{background:#fff;color:var(--ink,#1d1f1c);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.ws-upload{display:flex;gap:6px;margin-top:10px}
.ws-upload button,.ws-reset{display:flex;align-items:center;justify-content:center;gap:6px;flex:1 1;height:32px;border:1px dashed #d6d9d2;border-radius:7px;background:#fafaf8;cursor:pointer;font-size:12px}
.ws-upload button:hover,.ws-reset:hover{border-color:var(--orange,#ed694a);color:var(--orange,#ed694a)}
.ws-reset{width:100%;margin-top:14px}
.ws-empty{display:flex;flex-direction:column;align-items:center;padding:36px 8px;text-align:center;color:#8a8e86}
.ws-empty strong{margin:12px 0 6px;color:var(--ink,#1d1f1c)}
.ws-empty p{margin:0 0 14px;line-height:1.65;font-size:12px}
.ws-empty ul{align-self:stretch;margin:0;padding:12px;list-style:none;border-radius:8px;background:#f7f8f5;text-align:left;font-size:12px;line-height:2}
kbd{display:inline-block;min-width:16px;padding:0 5px;border:1px solid #dcdfd8;border-bottom-width:2px;border-radius:4px;background:#fff;font:11px/1.6 ui-monospace,monospace;color:#4b4f48;text-align:center}
.ws-layer-section{margin-bottom:6px}
.ws-layer-head{display:flex;justify-content:space-between;align-items:center;width:100%;height:32px;padding:0 10px;border:0;border-radius:7px;background:#f6f7f4;cursor:pointer;font-weight:600;font-size:12.5px}
.ws-layer-head small{color:#8a8e86;font-weight:400}
.ws-layer-head.active{background:#fff1ec;color:var(--orange,#ed694a)}
.ws-layer-list{display:flex;flex-direction:column;gap:2px;padding:4px 0 4px 10px}
.ws-layer-list button{display:flex;align-items:center;gap:8px;padding:5px 8px;border:0;border-radius:6px;background:none;text-align:left;cursor:pointer;min-width:0}
.ws-layer-list button>span:last-child{display:flex;flex-direction:column;min-width:0;font-size:12px}
.ws-layer-list small{color:#8a8e86;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.ws-layer-list button:hover{background:#f6f7f4}
.ws-layer-list button.active{background:#eef3ff;color:#2f6bff}
.ws-drag-ghost{position:fixed;z-index:400;display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:8px;background:var(--ink,#1d1f1c);color:#fff;font-size:12px;pointer-events:none;transform:translate(12px,12px);box-shadow:0 8px 24px rgba(0,0,0,.2);opacity:.92}
.ws-drag-ghost.over{background:#2f6bff}
.ws-drag-ghost span{font-size:14px}
body.ws-dragging,body.ws-dragging *{cursor:-webkit-grabbing!important;cursor:grabbing!important;-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important}
@media (max-width:1100px){.ws-body{grid-template-columns:220px minmax(0,1fr) 250px}.ws-tiles{grid-template-columns:repeat(2,1fr)}}
@media (max-width:820px){.ws-body{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 220px}.ws-library{display:none}.ws-inspector{border-left:0;border-top:1px solid #e7e7e2}.ws-title small{display:none}}
body:has(.workspace) .toast{z-index:450}

/* Workspace v2: zoom, grid, control panel, chips, layers with toggles, multi-select */
.ws-icon.on{background:#fff1ec;border-color:rgba(237,105,74,.4);color:var(--orange,#ed694a)}
.ws-zoom button{padding:0 7px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-size:12px}
.ws-zoom button:disabled{opacity:.35;cursor:default}
.ws-frame{position:relative}
.ws-grid-overlay{position:absolute;inset:0 24px;display:grid;grid-template-columns:repeat(12,1fr);grid-gap:16px;gap:16px;pointer-events:none;z-index:2}
.ws-grid-overlay i{background:rgba(47,107,255,.06);border-left:1px dashed rgba(47,107,255,.22);border-right:1px dashed rgba(47,107,255,.22)}
.ws-frame:has(.ws-grid-overlay)::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background-image:linear-gradient(rgba(47,107,255,.08) 1px,transparent 1px);background-size:100% calc(8px * var(--z,1))}
.ws-actions.compact button{flex-direction:row;justify-content:center;gap:4px;padding:6px 2px;font-size:11px}
.ws-actions button:disabled{opacity:.4;cursor:default}
.ws-chip-lock{display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:1px 6px;border-radius:9px;background:#f2f3f0;color:#6c7069;font-size:10.5px;font-style:normal;font-weight:500;vertical-align:1px}
.ws-chips{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:5px;gap:5px}
.ws-chip{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 2px;border:1px solid #e9ece7;border-radius:7px;background:#fff;cursor:pointer;font-size:11px;color:#5d625b}
.ws-chip i{display:block;width:22px;height:14px;border-radius:4px;border:1px solid #dfe1dc;background:#fff}
.ws-chip.active{border-color:var(--orange,#ed694a);color:var(--ink,#1d1f1c);box-shadow:0 0 0 2px rgba(237,105,74,.14)}
.ws-chip.fill-default i{background:repeating-linear-gradient(45deg,#fff 0 3px,#eceee9 3px 6px)}
.ws-chip.fill-accent i{background:var(--orange,#ed694a);border-color:transparent}
.ws-chip.fill-soft i{background:#fde7e0;border-color:#f6cfc3}
.ws-chip.fill-surface i{background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.1)}
.ws-chip.fill-ink i{background:#1d1f1c;border-color:transparent}
.ws-chip.fill-gradient i{background:linear-gradient(135deg,#ed694a,#8b5cf6);border-color:transparent}
.ws-chip.fill-glass i{background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(220,226,240,.6));border-color:#cfd6e6}
.ws-chip.fill-none i{background:linear-gradient(to top right,transparent calc(50% - 1px),#e06a55 50%,transparent calc(50% + 1px)),#fff}
.ws-seg button svg{vertical-align:-2px}
.ws-align-row{display:flex;align-items:center;gap:4px;margin-top:8px}
.ws-align-row button{display:grid;place-items:center;width:30px;height:28px;border:1px solid #e9ece7;border-radius:6px;background:#fff;cursor:pointer}
.ws-align-row button:hover{background:#f6f7f4}
.ws-align-row span{margin-left:6px;font-size:11.5px;color:#8a8e86}
.ws-align-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:5px;gap:5px;margin-bottom:10px}
.ws-align-grid button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;border:1px solid #e9ece7;border-radius:7px;background:#fff;cursor:pointer}
.ws-align-grid button:hover{border-color:var(--orange,#ed694a);color:var(--orange,#ed694a)}
.ws-align-grid small{font-size:10.5px;color:inherit}
/* Layers v2: rows with a pick button and lock / visibility toggles */
.ws-layer-head{cursor:default;gap:2px;padding:0 8px 0 2px}
.ws-layer-head button{border:0;background:none;cursor:pointer;font:inherit;color:inherit}
.ws-layer-caret{display:grid;place-items:center;width:22px;height:22px;border-radius:5px;color:#8a8e86!important}
.ws-layer-caret:hover{background:#eceee9}
.ws-layer-name{flex:1 1;text-align:left;height:100%;padding:0 4px}
.ws-layer-row{display:flex;align-items:center;gap:1px;border-radius:6px}
.ws-layer-row:hover{background:#f6f7f4}
.ws-layer-row.active{background:#eef3ff;color:#2f6bff}
.ws-layer-row.is-hidden .ws-layer-pick{opacity:.45}
.ws-layer-row.ctl .ws-glyph{background:#eef3ff;color:#2f6bff}
.ws-layer-list .ws-layer-pick{flex:1 1;background:none!important}
.ws-layer-list .ws-layer-tool{display:grid;place-items:center;width:22px;height:22px;padding:0;border-radius:5px;color:#a0a49c;opacity:0;flex:none}
.ws-layer-row:hover .ws-layer-tool,.ws-layer-row.active .ws-layer-tool,.ws-layer-tool.on{opacity:1}
.ws-layer-tool.on{color:var(--orange,#ed694a)}
.ws-layer-list .ws-layer-tool:hover{background:#e9ebe6;color:var(--ink,#1d1f1c)}
/* Combo thumbnails for the richer preset kinds */
.ws-combo-art i.f-accent,.ws-combo-art i.f-gradient{background:var(--orange,#ed694a);opacity:.85}
.ws-combo-art i.f-gradient{background:linear-gradient(135deg,#ed694a,#8b5cf6)}
.ws-combo-art i.f-ink{background:#2a2d28;opacity:.85}
.ws-combo-art i.f-soft{background:#fde7e0}
.ws-combo-art i.f-glass{background:rgba(230,234,244,.8);border:1px solid #d6dbe8}
.ws-combo-art i.k-image,.ws-combo-art i.k-video,.ws-combo-art i.k-carousel,.ws-combo-art i.k-map{background:linear-gradient(135deg,#dfe6ee,#c9d4e0)}
.ws-combo-art i.k-avatar,.ws-combo-art i.k-circle,.ws-combo-art i.k-avatars{border-radius:50%;background:#d6dbd2}
.ws-combo-art i.k-badge,.ws-combo-art i.k-tag,.ws-combo-art i.k-tags{background:#fde7e0;border-radius:6px}
.ws-combo-art i.k-progress,.ws-combo-art i.k-slider{background:linear-gradient(90deg,var(--orange,#ed694a) 60%,#e6e8e3 60%);border-radius:4px}
.ws-combo-art i.k-bar,.ws-combo-art i.k-line,.ws-combo-art i.k-pie,.ws-combo-art i.k-chart{background:linear-gradient(to top,#8fb2ff 0 45%,transparent 45%),repeating-linear-gradient(90deg,#dbe5ff 0 6px,transparent 6px 10px)}
.ws-combo-art i.k-pie{border-radius:50%;background:conic-gradient(var(--orange,#ed694a) 0 35%,#8fb2ff 35% 70%,#e4e6e1 70%)}
.ws-combo-art i.k-stat,.ws-combo-art i.k-price{background:#f3f4f1;border:1px solid #e4e6e1}
.ws-combo-art i.k-table,.ws-combo-art i.k-list,.ws-combo-art i.k-accordion,.ws-combo-art i.k-timeline,.ws-combo-art i.k-steps,.ws-combo-art i.k-menu,.ws-combo-art i.k-tree{background:repeating-linear-gradient(#fff 0 6px,#e9ebe6 6px 7px);border:1px solid #e4e6e1}
.ws-combo-art i.k-navbar,.ws-combo-art i.k-tabs,.ws-combo-art i.k-breadcrumb{background:#f1f2ef;border-bottom:2px solid #d8dad4}
.ws-combo-art i.k-text,.ws-combo-art i.k-quote,.ws-combo-art i.k-paragraph{background:repeating-linear-gradient(#cfd2cb 0 2px,transparent 2px 6px);opacity:.8}
.ws-combo-art i.k-icon,.ws-combo-art i.k-rating{background:#f6c75a;border-radius:4px}
.ws-combo-art i.k-checkbox,.ws-combo-art i.k-radio,.ws-combo-art i.k-switch{background:#fff;border:1px solid #c9ccc5;border-radius:4px}
.ws-combo-art i.k-divider{height:1px!important;background:#d8dad4}

/* AgentForge Workspace Project Library & Version Management */
.ws-lib-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin: 20px 0 16px;
  flex-wrap: wrap;
}
.ws-lib-stats {
  font-size: 13px;
  color: var(--nav-muted, #80786c);
  display: flex;
  align-items: center;
  gap: 8px;
}
.ws-lib-stats strong {
  color: var(--nav-ink, #302d28);
  font-weight: 600;
}
.ws-lib-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.ws-search-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.ws-search-input-wrap svg {
  position: absolute;
  left: 10px;
  color: var(--nav-muted, #80786c);
  pointer-events: none;
}
.ws-search-input {
  padding: 7px 12px 7px 32px;
  border: 1px solid var(--nav-line, #e8e1d7);
  border-radius: 7px;
  background: #fffdf9;
  font: inherit;
  font-size: 12px;
  color: var(--nav-ink, #302d28);
  min-width: 180px;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.ws-search-input:focus {
  border-color: var(--nav-accent, #9e6247);
  box-shadow: 0 0 0 2px rgba(158, 98, 71, 0.15);
}
.ws-sort-select {
  padding: 7px 10px;
  border: 1px solid var(--nav-line, #e8e1d7);
  border-radius: 7px;
  background: #fffdf9;
  font: inherit;
  font-size: 12px;
  color: var(--nav-ink, #302d28);
  cursor: pointer;
  outline: none;
}
.ws-guide-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid var(--nav-line, #e8e1d7);
  border-radius: 7px;
  background: #fffdf9;
  font: inherit;
  font-size: 12px;
  color: var(--nav-accent, #9e6247);
  cursor: pointer;
  transition: all .15s;
}
.ws-guide-toggle-btn:hover {
  background: var(--nav-soft, #f7efe5);
}
.ws-guide-card {
  margin: 16px 0 24px;
  padding: 18px 22px;
  border: 1px solid var(--nav-line, #e8e1d7);
  border-left: 4px solid var(--nav-accent, #9e6247);
  border-radius: 10px;
  background: #fffdf9;
  animation: fadeIn .2s ease;
}
.ws-guide-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.ws-guide-header h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--nav-ink, #302d28);
  display: flex;
  align-items: center;
  gap: 7px;
}
.ws-guide-header button {
  background: none;
  border: 0;
  color: var(--nav-muted, #80786c);
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.ws-guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 16px;
  gap: 16px;
}
.ws-guide-col {
  padding: 10px 14px;
  background: #faf7f2;
  border-radius: 8px;
  border: 1px solid #efe8dd;
}
.ws-guide-col strong {
  display: block;
  font-size: 12.5px;
  color: var(--nav-ink, #302d28);
  margin-bottom: 5px;
}
.ws-guide-col p {
  margin: 0;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--nav-muted, #80786c);
}
@media (max-width: 850px) {
  .ws-guide-grid {
    grid-template-columns: 1fr;
  }
}

/* Enhanced Workspace Card */
.workspace-card-pro {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 20px;
  background: #fffdf9;
  border: 1px solid #e5ded3;
  border-radius: 12px;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.workspace-card-pro:hover {
  border-color: #d8cdbe;
  box-shadow: 0 6px 20px rgba(48, 45, 40, 0.05);
  transform: translateY(-2px);
}
.ws-card-top-badges {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.ws-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  padding: 2px 7px;
  border-radius: 5px;
  border: 1px solid #e5ded3;
  background: #faf7f2;
  color: #726b60;
}
.ws-badge.accent {
  background: #fdf2ed;
  border-color: #f3dcd0;
  color: #9e6247;
}
.ws-card-title-row {
  margin-bottom: 6px;
}
.ws-card-title-row h2 {
  font-size: 16.5px;
  font-weight: 600;
  color: #302d28;
  margin: 0;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.ws-rename-form {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0;
}
.ws-rename-input {
  flex: 1 1;
  padding: 5px 9px;
  border: 1px solid var(--nav-accent, #9e6247);
  border-radius: 5px;
  background: #fff;
  font: inherit;
  font-size: 13px;
  outline: none;
}
.ws-rename-form button {
  padding: 5px 8px;
  border: 1px solid #d6c5b2;
  border-radius: 5px;
  background: #fffdf9;
  font-size: 11.5px;
  cursor: pointer;
}
.ws-rename-form button.save {
  background: var(--nav-accent, #9e6247);
  border-color: var(--nav-accent, #9e6247);
  color: #fff;
}
.ws-card-date {
  font-size: 11px;
  color: #80786c;
  margin: 0 0 16px;
}
.ws-card-bottom {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 1px solid #f2ece3;
  padding-top: 14px;
}
.ws-card-primary-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.ws-btn-primary {
  flex: 1 1;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: #302d28;
  color: #fffdf9;
  border: 1px solid #302d28;
  border-radius: 6px;
  font: inherit;
  font-size: 12px;
  font-weight: 550;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s;
}
.ws-btn-primary:hover {
  background: #9e6247;
  border-color: #9e6247;
}
.ws-btn-secondary {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 8px 10px;
  background: #fffdf9;
  color: #8f5f42;
  border: 1px solid #d6c5b2;
  border-radius: 6px;
  font: inherit;
  font-size: 12px;
  text-decoration: none;
  cursor: pointer;
}
.ws-btn-secondary:hover {
  background: #f7efe5;
}
.ws-card-tool-strip {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  align-items: center;
}
.ws-tool-icon-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 7px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: #80786c;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  transition: all .12s;
}
.ws-tool-icon-btn:hover {
  background: #f3ede4;
  color: #302d28;
  border-color: #e5ded3;
}
.ws-tool-icon-btn.danger:hover {
  background: #fdf0ee;
  color: #cf4a30;
  border-color: #f7d2cb;
}
.ws-delete-confirm-box {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  background: #fdf0ee;
  border: 1px solid #f7d2cb;
  border-radius: 6px;
  font-size: 11px;
  color: #b23a22;
}
.ws-delete-confirm-box button {
  padding: 3px 6px;
  border-radius: 4px;
  font-size: 10.5px;
  cursor: pointer;
  border: 1px solid transparent;
}
.ws-delete-confirm-box button.danger-confirm {
  background: #b23a22;
  color: #fff;
  border-color: #b23a22;
}
.ws-delete-confirm-box button.danger-cancel {
  background: #fff;
  color: #726b60;
  border-color: #e5ded3;
}
.ws-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 100;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #302d28;
  color: #fffdf9;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.18);
  font-size: 12.5px;
  animation: slideUp .2s ease;
}
@keyframes slideUp {
  from { transform: translateY(12px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}


/* Planning Badges and Filters in Workspace */
.ws-badge.plan {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
  font-weight: 500;
}
.ws-badge.standalone {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #64748b;
}
.ws-archetype-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  border-bottom: 1px solid #ebdcd0;
  padding-bottom: 10px;
}
.ws-archetype-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid transparent;
  background: transparent;
  color: #6d665a;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.ws-archetype-tab:hover {
  background: #f6efe7;
  color: #3d372e;
}
.ws-archetype-tab.active {
  background: #fff;
  border-color: #d9cec2;
  color: #2b251d;
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.ws-component-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fdfaf6;
  border: 1px dashed #d9cec2;
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 20px;
}
.ws-component-banner h4 {
  margin: 0 0 4px;
  font-size: 14px;
  color: #3b332b;
}
.ws-component-banner p {
  margin: 0;
  font-size: 12px;
  color: #7b7165;
}

/* ==========================================================================
   Project Workspace 2.0: Dual-Module Cards & New Project Wizard
   ========================================================================== */

.ws-eyebrow {
  display: block;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: #9e6247;
  font-weight: 600;
  margin-bottom: 4px;
}

.ws-new-project-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #9e6247, #7e4a33);
  color: #ffffff !important;
  border: 1px solid #7e4a33;
  border-radius: 9px;
  padding: 10px 20px;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(126, 74, 51, 0.28);
  transition: all 0.15s ease;
}
.ws-new-project-btn:hover {
  transform: translateY(-1.5px);
  box-shadow: 0 6px 18px rgba(126, 74, 51, 0.36);
  background: linear-gradient(135deg, #ae6f52, #8d533b);
}

.ws-guide-toggle-btn {
  background: transparent;
  border: 1px solid #dfd3c8;
  border-radius: 6px;
  color: #7a6358;
  font-size: 12px;
  padding: 4px 10px;
  cursor: pointer;
  transition: background 0.12s;
}
.ws-guide-toggle-btn:hover {
  background: #f7ede5;
  color: #4a3429;
}

/* Card Header & Badges */
.ws-card-header-bar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.ws-card-title-group {
  flex: 1 1;
  min-width: 0;
}
.ws-card-badges-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.ws-expand-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #f7f3ee;
  border: 1px solid #e5dad0;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 11.5px;
  font-weight: 550;
  color: #69564b;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s ease;
}
.ws-expand-toggle-btn:hover {
  background: #eee4d9;
  border-color: #d1c0b2;
  color: #3b2c24;
}

/* Dual-Module Container */
.ws-card-modules-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 12px;
  gap: 12px;
  margin: 14px 0;
}
@media (max-width: 680px) {
  .ws-card-modules-container {
    grid-template-columns: 1fr;
  }
}

.ws-module-box {
  background: #faf7f4;
  border: 1px solid #ece2d7;
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: border-color 0.15s ease;
}
.ws-module-box:hover {
  border-color: #dfcdbf;
}
.ws-module-plan {
  background: #fdfaf6;
  border-color: #ebdcd0;
}
.ws-module-build {
  background: #f8faf8;
  border-color: #dce7dc;
}

.ws-module-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.ws-module-title {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ws-module-title strong {
  font-size: 12px;
  color: #392c24;
}

.ws-plan-tag {
  font-size: 10.5px;
  padding: 2px 7px;
  border-radius: 4px;
  font-weight: 550;
}
.ws-plan-tag.linked {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}
.ws-plan-tag.standalone {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #cbd5e1;
}

.ws-build-tag {
  font-size: 10.5px;
  padding: 2px 7px;
  border-radius: 4px;
  font-weight: 550;
  background: #f0fdf4;
  color: #15803d;
  border: 1px solid #bbf7d0;
}

.ws-module-desc {
  font-size: 11.5px;
  color: #6d5f54;
  line-height: 1.5;
  margin: 0 0 10px;
  flex: 1 1;
}

.ws-expanded-detail-box {
  background: rgba(255,255,255,0.7);
  border: 1px dashed rgba(0,0,0,0.08);
  border-radius: 6px;
  padding: 8px 10px;
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ws-detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  color: #6d5f54;
}
.ws-detail-row code {
  font-family: monospace;
  font-size: 10.5px;
  background: #eee;
  padding: 1px 4px;
  border-radius: 3px;
}

.ws-module-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: auto;
}

.ws-sub-btn {
  font-size: 11px;
  font-weight: 550;
  padding: 5px 9px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.12s ease;
  white-space: nowrap;
}
.ws-sub-btn.primary-outline {
  background: #ffffff;
  border: 1px solid #9e6247;
  color: #9e6247;
}
.ws-sub-btn.primary-outline:hover {
  background: #9e6247;
  color: #ffffff;
}
.ws-sub-btn.secondary-outline {
  background: #ffffff;
  border: 1px solid #d5c7b8;
  color: #554337;
}
.ws-sub-btn.secondary-outline:hover {
  background: #f4ece4;
  border-color: #b59f8c;
}
.ws-sub-btn.ai-sync {
  background: #fff8f0;
  border: 1px solid #ebd4c0;
  color: #92400e;
}
.ws-sub-btn.ai-sync:hover:not(:disabled) {
  background: #fed7aa;
  border-color: #f97316;
}
.ws-sub-btn.ai-sync .spin {
  animation: spin 1s linear infinite;
}
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.ws-btn-primary.full-width {
  width: 100%;
  justify-content: center;
  padding: 7px 12px;
  font-size: 12px;
}

/* Card Tool Strip Footer */
.ws-card-footer-strip {
  padding-top: 10px;
  border-top: 1px solid #eee5dc;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.ws-card-tool-buttons {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.ws-tool-icon-btn.danger {
  color: #b91c1c;
}
.ws-tool-icon-btn.danger:hover {
  background: #fee2e2;
  border-color: #fca5a5;
}

/* Modal Backdrop & Card */
.ws-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(20, 15, 10, 0.55);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: fadeIn 0.15s ease;
}
.ws-modal-card {
  background: #ffffff;
  border: 1px solid #ebdcd2;
  border-radius: 18px;
  width: min(880px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  padding: 32px 36px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
  position: relative;
}
.ws-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 28px;
  padding-bottom: 18px;
  border-bottom: 1px solid #f2e7de;
}
.ws-modal-eyebrow {
  display: block;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: #9e6247;
  font-weight: 600;
  margin-bottom: 4px;
}
.ws-modal-header h2 {
  font-size: 22px;
  color: #2b221c;
  margin: 0 0 6px;
}
.ws-modal-header p {
  font-size: 13px;
  color: #736256;
  margin: 0;
}
.ws-modal-close {
  background: transparent;
  border: none;
  font-size: 20px;
  color: #8c776b;
  cursor: pointer;
  padding: 4px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.12s;
}
.ws-modal-close:hover {
  background: #f6eee7;
  color: #2b221c;
}

.ws-modal-choices-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 18px;
  gap: 18px;
}
@media (max-width: 820px) {
  .ws-modal-choices-grid {
    grid-template-columns: 1fr;
  }
}

.ws-choice-card {
  background: #fbf8f5;
  border: 1px solid #ebdcd2;
  border-radius: 14px;
  padding: 24px 20px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.2s ease;
}
.ws-choice-card:hover {
  transform: translateY(-3px);
  border-color: #9e6247;
  box-shadow: 0 10px 24px rgba(158, 98, 71, 0.12);
}
.ws-choice-card.recommended {
  background: #fcf9f5;
  border: 2px solid #9e6247;
  box-shadow: 0 8px 24px rgba(158, 98, 71, 0.1);
}
.ws-choice-badge {
  position: absolute;
  top: -11px;
  left: 20px;
  background: #9e6247;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 10px;
  border-radius: 12px;
  letter-spacing: 0.04em;
}

.ws-choice-icon-wrap {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.ws-choice-icon-wrap.plan {
  background: #fbf0e8;
  color: #9e6247;
}
.ws-choice-icon-wrap.build {
  background: #ecfdf5;
  color: #059669;
}
.ws-choice-icon-wrap.creator {
  background: #f5f3ff;
  color: #7c3aed;
}

.ws-choice-card h3 {
  font-size: 16px;
  color: #2b221c;
  margin: 0 0 8px;
  font-weight: 600;
}
.ws-choice-card p {
  font-size: 12px;
  color: #6b5c51;
  line-height: 1.6;
  margin: 0 0 16px;
  flex: 1 1;
}

.ws-choice-features {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px dashed #e8ded4;
  padding-top: 12px;
}
.ws-choice-features li {
  font-size: 11.5px;
  color: #5d4f45;
}

.ws-choice-btn {
  width: 100%;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
}
.ws-choice-btn.primary {
  background: linear-gradient(135deg, #9e6247, #7e4a33);
  color: #ffffff;
  border: 1px solid #7e4a33;
  box-shadow: 0 4px 12px rgba(126, 74, 51, 0.22);
}
.ws-choice-btn.primary:hover {
  background: linear-gradient(135deg, #b06e50, #8d533b);
  transform: translateY(-1px);
}
.ws-choice-btn.secondary {
  background: #ffffff;
  color: #3b2c23;
  border: 1px solid #d5c7b9;
}
.ws-choice-btn.secondary:hover {
  background: #f7ede5;
  border-color: #9e6247;
  color: #9e6247;
}

/* ==========================================================================
   Enforce Two-Column Grid & Spacious Dual-Module Cards (两个一排)
   ========================================================================== */

.workspace-main {
  max-width: 1280px !important;
  padding: 35px 30px 80px !important;
}

.workspace-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-gap: 24px !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

@media (max-width: 860px) {
  .workspace-grid {
    grid-template-columns: 1fr !important;
  }
}

.workspace-card-pro {
  background: #ffffff !important;
  border: 1px solid #ebdcd2 !important;
  border-radius: 14px !important;
  padding: 22px 24px !important;
  box-shadow: 0 4px 16px rgba(48, 45, 40, 0.04) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease !important;
}

.workspace-card-pro:hover {
  border-color: #d1b8a5 !important;
  box-shadow: 0 10px 28px rgba(48, 45, 40, 0.08) !important;
  transform: translateY(-2px) !important;
}

/* Card Header */
.ws-card-header-bar {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}

.ws-card-title-group h2 {
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #2b221c !important;
  margin: 4px 0 !important;
}

.ws-card-date {
  font-size: 11.5px !important;
  color: #8c776b !important;
}

/* Two Modules Inside Card: Left Plan + Right Build */
.ws-card-modules-container {
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr) !important;
  grid-gap: 16px !important;
  gap: 16px !important;
  margin: 16px 0 14px !important;
  align-items: stretch !important;
}

@media (max-width: 600px) {
  .ws-card-modules-container {
    grid-template-columns: 1fr !important;
  }
}

.ws-module-box {
  background: #faf7f4 !important;
  border: 1px solid #ece2d7 !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-height: 156px !important;
  transition: border-color 0.15s ease !important;
}

.ws-module-box:hover {
  border-color: #dec8b6 !important;
}

.ws-module-plan {
  background: #fdfaf6 !important;
  border-color: #ebdcd0 !important;
}

.ws-module-build {
  background: #f8faf8 !important;
  border-color: #dce7dc !important;
}

.ws-module-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

.ws-module-title {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.ws-module-title strong {
  font-size: 13px !important;
  color: #392c24 !important;
  font-weight: 600 !important;
}

.ws-plan-tag,
.ws-build-tag {
  white-space: nowrap !important;
  word-break: keep-all !important;
  display: inline-block !important;
  font-size: 11px !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  flex-shrink: 0 !important;
  min-width: max-content !important;
}

.ws-module-desc {
  font-size: 12px !important;
  color: #6d5f54 !important;
  line-height: 1.6 !important;
  margin: 0 0 12px !important;
  flex: 1 1 !important;
}

.ws-module-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: auto !important;
}

.ws-sub-btn {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  padding: 6px 11px !important;
  border-radius: 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.12s ease !important;
}

.ws-sub-btn.primary-outline {
  background: #ffffff !important;
  border: 1px solid #9e6247 !important;
  color: #9e6247 !important;
}
.ws-sub-btn.primary-outline:hover {
  background: #9e6247 !important;
  color: #ffffff !important;
}

.ws-sub-btn.secondary-outline {
  background: #ffffff !important;
  border: 1px solid #d5c7b8 !important;
  color: #554337 !important;
}
.ws-sub-btn.secondary-outline:hover {
  background: #f4ece4 !important;
  border-color: #b59f8c !important;
}

.ws-sub-btn.ai-sync {
  background: #fff8f0 !important;
  border: 1px solid #f2cfb3 !important;
  color: #92400e !important;
  box-shadow: 0 1px 3px rgba(245, 158, 11, 0.08) !important;
}
.ws-sub-btn.ai-sync:hover:not(:disabled) {
  background: #fed7aa !important;
  border-color: #f97316 !important;
  color: #7c2d12 !important;
}

.ws-btn-primary.full-width {
  width: 100% !important;
  justify-content: center !important;
  padding: 8px 14px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

/* Footer Strip */
.ws-card-footer-strip {
  padding-top: 12px !important;
  margin-top: 4px !important;
  border-top: 1px solid #f0e6de !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.ws-card-tool-buttons {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.ws-tool-icon-btn {
  background: transparent !important;
  border: 1px solid #e2d5c8 !important;
  border-radius: 6px !important;
  padding: 4px 9px !important;
  font-size: 11.5px !important;
  color: #69564b !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: all 0.12s ease !important;
}

.ws-tool-icon-btn:hover {
  background: #f7ede5 !important;
  border-color: #c9b5a5 !important;
  color: #3b2c23 !important;
}