:root{font-family:'DM Sans',sans-serif}*{box-sizing:border-box}.display{font-family:'Instrument Serif',serif;font-size:42px;line-height:1.05}.eyebrow{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#71756c;font-weight:700}.logo-mark{width:30px;height:30px;display:grid;place-items:center;background:#d9f99d;color:#20261d;border-radius:9px;font-family:'Instrument Serif';font-size:20px;font-style:italic}.nav-item{display:flex;align-items:center;gap:11px;padding:10px 12px;color:#ffffff99;border-radius:10px}.nav-item:hover,.nav-item.active{background:#ffffff0d;color:white}.nav-item.active{box-shadow:inset 2px 0 #d9f99d}.round-btn{width:38px;height:38px;border:1px solid #00000017;background:white;border-radius:11px;display:grid;place-items:center}.btn-dark,.btn-light{height:40px;padding:0 16px;border-radius:10px;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.btn-dark{background:#20261d;color:white}.btn-dark:hover{background:#303a2c}.btn-light{background:white;border:1px solid #00000017;color:#30322d}.metric{height:148px;padding:20px;background:#fff;border:1px solid #00000012;border-radius:17px;position:relative;display:flex;justify-content:space-between}.metric.dark{background:#20261d}.metric-label{font-size:12px;color:#0007}.metric-no{font-family:'Instrument Serif';font-size:42px;margin-top:6px}.metric-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center}.metric-foot{position:absolute;left:20px;bottom:18px;font-size:11px;color:#0006}.section-title{font-size:17px;font-weight:700;letter-spacing:-.02em}.asset-card{background:white;border:1px solid #00000012;border-radius:16px;overflow:hidden;transition:.25s}.asset-card:hover{transform:translateY(-3px);box-shadow:0 14px 40px #2b2f2412}.asset-image{height:210px;position:relative;background:#e7e6e1;overflow:hidden}.asset-image img{width:100%;height:100%;object-fit:cover;transition:.4s}.asset-card:hover img{transform:scale(1.02)}.version{position:absolute;left:10px;top:10px;background:#20261dd9;color:#fff;padding:5px 7px;border-radius:6px;font-size:9px}.status{display:inline-flex;padding:6px 9px;border-radius:20px;font-size:10px;font-weight:700;white-space:nowrap}.asset-image>.status{position:absolute;right:10px;top:10px}.status-changes-requested{background:#f9d4c9;color:#a44230}.status-in-review{background:#e3ddf8;color:#5d4a8b}.status-approved{background:#ddf0c2;color:#4e6d31}.status-draft{background:#e4e4df;color:#686a62}.avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#d9f99d;color:#30352b;font-size:10px;font-weight:700;border:2px solid white}.avatar.small{width:28px;height:28px;font-size:9px}.panel{background:white;border:1px solid #00000012;border-radius:17px;overflow:hidden}.panel-head{padding:18px 20px;border-bottom:1px solid #0000000d;display:flex;justify-content:space-between;align-items:center}.panel-head p,.panel-head button{font-size:11px;color:#0006}.activity{display:flex;gap:12px;align-items:center;padding:15px 20px}.activity p{font-size:12px;flex:1}.activity small{display:block;color:#0005;margin-top:3px}.pill{font-size:9px;padding:5px 8px;background:#eee;border-radius:10px}.pill.coral{background:#f9d4c9;color:#a44230}.pill.green{background:#ddf0c2;color:#4e6d31}.ai-panel{padding:20px;background:linear-gradient(145deg,#f3f0ff,#fff)}.ai-spark{width:36px;height:36px;border-radius:11px;background:#20261d;color:#d9f99d;display:grid;place-items:center;margin-right:10px}.ai-spark.small{width:24px;height:24px;border-radius:7px;font-size:10px}.ai-panel .btn-dark{width:100%}.preview-stage{min-height:560px;border-radius:18px;background:#d8d8d2;display:grid;place-items:center;padding:32px;box-shadow:inset 0 0 50px #0001}.preview-stage img{max-width:100%;max-height:660px;object-fit:contain;box-shadow:0 20px 60px #252b2030}.ai-summary{padding:16px;border:1px solid #c8bde9;background:#f3f0ff;border-radius:14px}.comment{display:flex;gap:10px}.task{width:100%;display:flex;align-items:flex-start;gap:10px;background:white;border:1px solid #00000010;border-radius:11px;padding:12px;text-align:left;font-size:13px;line-height:18px}.task.done{color:#0005;text-decoration:line-through}.checkbox{flex:none;width:18px;height:18px;border:1.5px solid #999;border-radius:5px;display:grid;place-items:center;font-size:11px}.task.done .checkbox{background:#20261d;color:#fff;border-color:#20261d}.modal{position:fixed;inset:0;background:#20261db8;z-index:50;display:grid;place-items:center;backdrop-filter:blur(4px)}.modal-card{position:relative;width:480px;background:#faf9f6;border-radius:20px;padding:28px;box-shadow:0 30px 90px #0004}.modal-close{position:absolute;right:20px;top:16px;font-size:24px;color:#0006}.dropzone{height:150px;border:1.5px dashed #0004;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer}.dropzone small{color:#0005}.field-label{font-size:11px;font-weight:700;display:block;margin:20px 0 7px}.field{width:100%;border:1px solid #0002;border-radius:10px;background:white;padding:12px;font-size:13px;outline:none}.field:focus{box-shadow:0 0 0 2px #bbcf8b}
@media(max-width:1000px){aside.fixed{display:none}main.ml-64{margin-left:0}.grid-cols-4{grid-template-columns:repeat(2,1fr)}.grid-cols-\[minmax\(0\,1fr\)_390px\]{grid-template-columns:1fr}.asset-card{min-width:0}}

/* Make It Pop product design system — inspired by expressive creator tools */
:root{--ink:#19181d;--paper:#f8f7f5;--coral:#ff6b50;--peach:#ffc8bc;--lilac:#d8d0ff;--lime:#c9ff72}
body{background:linear-gradient(135deg,#f8e5e1 0%,#f2eff6 50%,#e8eaf4 100%);background-attachment:fixed}
.app-canvas{margin-top:12px;margin-right:12px;margin-bottom:12px;border-radius:26px;background:var(--paper);overflow:hidden;box-shadow:0 20px 60px #392a3210;min-height:calc(100vh - 24px)}
.sidebar-shell{border-radius:24px;box-shadow:0 18px 55px #16131b30}
.glass-header{background:#f8f7f5e8;border-bottom:1px solid #19181d0d;backdrop-filter:blur(18px)}
.display{font-size:46px}.logo-mark{background:linear-gradient(135deg,#ff806a,#ff5744);color:#fff;box-shadow:0 7px 20px #ff6b5040}
.global-search{position:absolute;left:50%;transform:translateX(-50%);width:min(360px,30vw);height:40px;background:#eeecec;border-radius:12px;display:flex;align-items:center;padding:0 13px;color:#19181d55}
.global-search input{background:transparent;outline:0;width:100%;font-size:12px;margin-left:8px}.global-search kbd{font-size:9px;background:#fff;padding:3px 6px;border-radius:5px;white-space:nowrap}
.btn-dark{background:linear-gradient(135deg,#252329,#17161a);box-shadow:0 6px 15px #19181d18}.btn-dark:hover{background:#ff6b50}.btn-light{box-shadow:0 3px 12px #19181d08}
.metric{border:0;box-shadow:0 8px 25px #342b3410;transition:transform .25s,box-shadow .25s}.metric:hover{transform:translateY(-3px);box-shadow:0 16px 34px #342b3418}.metric-coral{background:linear-gradient(145deg,#ffd8d0,#ffc2b5)}.metric-lilac{background:linear-gradient(145deg,#e8e3ff,#d5ccff)}.metric-lime{background:linear-gradient(145deg,#ddffad,#c6f978)}.metric.dark{background:linear-gradient(145deg,#29272f,#17161a)}
.asset-card{border:0;border-radius:20px;box-shadow:0 7px 24px #342b340e}.asset-image{height:225px}.asset-card:hover{transform:translateY(-5px);box-shadow:0 18px 42px #2b2f2418}.status{box-shadow:0 3px 10px #1c19170e}.panel{border:0;box-shadow:0 8px 28px #342b340e}.ai-panel{background:linear-gradient(145deg,#e6e0ff,#fff 65%)}.ai-spark{background:linear-gradient(135deg,#ff775f,#ff5340);color:#fff;box-shadow:0 6px 16px #ff6b5030}.preview-stage{background:radial-gradient(circle at 50% 20%,#f4e3df,#d9d6df);border:1px solid #ffffffaa}.modal{background:#17141bb8}.modal-card{border:1px solid #ffffff70}.dropzone:hover{border-color:#ff6b50;background:#fff5f2}
@media(max-width:1000px){.app-canvas{margin:0;border-radius:0}.global-search{display:none}main.ml-\[276px\]{margin-left:0}}

/* Expressive collaboration layer */
.feedback-rail{background:linear-gradient(180deg,#fffafd 0%,#f8f5ff 54%,#fff8f4 100%)}
.comment{align-items:flex-start}.comment-bubble{padding:12px 13px;border-radius:6px 16px 16px 16px;border:1px solid transparent;box-shadow:0 5px 18px #29202b0b;transition:.2s}.comment-bubble:hover{transform:translateX(-2px);box-shadow:0 9px 24px #29202b13}
.comment-client .comment-bubble{background:#fff0eb;border-color:#ffb8a8}.comment-designer .comment-bubble{background:#eefbff;border-color:#afe8f2}.comment-lead .comment-bubble{background:#f1edff;border-color:#cfc3ff}.comment-ai .comment-bubble{background:#f0ffdc;border-color:#c9f28b}
.role-pill{display:inline-flex;align-items:center;margin-left:7px;padding:3px 7px;border-radius:999px;font-size:8px;line-height:1;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.role-client{background:#ff866f;color:#fff}.role-designer{background:#bceef6;color:#28616c}.role-lead{background:#d4c9ff;color:#554492}.role-ai{background:#c9ff72;color:#36520d}
.role-avatar-client{background:#ff8f79;color:#fff}.role-avatar-designer{background:#bceef6;color:#28616c}.role-avatar-lead{background:#d4c9ff;color:#554492}.role-avatar-ai{background:#c9ff72;color:#36520d}
.feedback-actions{display:flex;gap:5px;margin-top:10px;padding-top:8px;border-top:1px solid #19181d0a}.feedback-actions button{font-size:10px;color:#19181d6b;padding:3px 6px;border-radius:6px}.feedback-actions button:hover{background:#fff;color:#19181d}.summary-chip{font-size:9px;font-weight:700;padding:5px 7px;border-radius:7px;background:#ffffffa8;color:#514671;border:1px solid #8275a51c}
.composer{margin:12px;padding:10px;border-radius:16px;background:#fff;border:1.5px solid #dcd3ff;box-shadow:0 10px 30px #42375b14}.composer:focus-within{border-color:#9e8ef3;box-shadow:0 10px 34px #7c69da20}.composer-tools{display:flex;align-items:center;gap:3px;border-bottom:1px solid #19181d0a;padding-bottom:7px}.composer-tools button{width:27px;height:27px;border-radius:7px;font-size:12px}.composer-tools button:hover{background:#f0ecff}
.asset-card:nth-child(1){background:linear-gradient(180deg,#fff 60%,#fff0ec)}.asset-card:nth-child(2){background:linear-gradient(180deg,#fff 60%,#f1edff)}.asset-card:nth-child(3){background:linear-gradient(180deg,#fff 60%,#efffd8)}.asset-card:nth-child(4){background:linear-gradient(180deg,#fff 60%,#fff4cf)}.asset-card:nth-child(1) .asset-image{background:#ffbbae}.asset-card:nth-child(2) .asset-image{background:#cfc4ff}.asset-card:nth-child(3) .asset-image{background:#c9ff72}.asset-card:nth-child(4) .asset-image{background:#ffd76d}
.ai-summary{background:linear-gradient(135deg,#efeaff,#fff0eb);border-color:#cdbfff;box-shadow:0 8px 24px #6759ac12}
.logout-btn{width:32px;height:32px;display:grid;place-items:center;border-radius:9px}.logout-btn:hover{background:#edf3ff}

/* Expressive asset cards */
.creative-card{position:relative;display:block;border-radius:22px;background:#fff;overflow:hidden;box-shadow:0 10px 30px #251a260f;border:1px solid #fff;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s}.creative-card:hover{transform:translateY(-7px);box-shadow:0 24px 52px #291b2c22}.creative-cover{height:258px;margin:7px;border-radius:17px;position:relative;overflow:hidden;background:#ffbaa9}.creative-card-tone-1 .creative-cover{background:#cfc5ff}.creative-card-tone-2 .creative-cover{background:#c9ff72}.creative-card-tone-3 .creative-cover{background:#ffd66f}.creative-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#15121a0d 30%,#15121a99 100%);pointer-events:none}.creative-cover img{position:absolute;inset:15px;width:calc(100% - 30px);height:calc(100% - 30px);object-fit:cover;border-radius:13px;box-shadow:0 16px 35px #2117222c;transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .3s}.creative-card:hover .creative-cover img{transform:scale(1.045) rotate(-.5deg);filter:saturate(1.12)}.creative-orb{position:absolute;border-radius:50%;background:#fff5;filter:blur(1px)}.orb-one{width:150px;height:150px;right:-35px;top:-55px}.orb-two{width:70px;height:70px;left:-20px;bottom:20px}.creative-topline{position:absolute;z-index:3;top:12px;left:12px;right:12px;display:flex;align-items:center;justify-content:space-between}.media-pill{padding:6px 9px;border-radius:999px;background:#fffc;backdrop-filter:blur(10px);font-size:9px;font-weight:800;box-shadow:0 4px 12px #21172213}.creative-topline .status{position:static;box-shadow:0 4px 12px #21172213}.creative-version{position:absolute;z-index:3;bottom:13px;left:13px;width:31px;height:31px;display:grid;place-items:center;border-radius:9px;background:#19181ddd;color:white;font-size:9px;font-weight:800;backdrop-filter:blur(10px)}.open-review{position:absolute;z-index:3;right:13px;bottom:13px;color:#fff;font-size:10px;font-weight:700;opacity:0;transform:translateY(5px);transition:.25s}.creative-card:hover .open-review{opacity:1;transform:translateY(0)}.open-review b{display:inline-grid;place-items:center;width:25px;height:25px;margin-left:6px;border-radius:50%;background:#fff;color:#19181d}.creative-body{padding:11px 17px 15px}.creative-meta{display:flex;align-items:center;gap:7px;color:#19181d65;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.creative-meta i{width:3px;height:3px;background:#ff6b50;border-radius:50%}.creative-body h3{font-size:17px;font-weight:750;letter-spacing:-.025em;margin-top:5px}.creative-signals{display:flex;align-items:center;gap:8px;margin-top:13px;padding:9px 0;border-top:1px solid #19181d0b;border-bottom:1px solid #19181d0b;font-size:9px;color:#19181d72}.creative-footer{display:flex;align-items:center;margin-top:12px}.creative-avatar{width:33px;height:33px;background:#19181d;color:#fff;border:3px solid #fff;box-shadow:0 0 0 1px #19181d12}.creative-footer>div{margin-left:8px;display:flex;flex-direction:column}.creative-footer b{font-size:10px}.creative-footer small{font-size:9px;color:#19181d65;margin-top:2px}.review-arrow{margin-left:auto;width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#f1eff0;transition:.2s}.creative-card:hover .review-arrow{background:#ff6b50;color:#fff;transform:translateX(2px)}
