@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:'DM Sans',system-ui,sans-serif;background:#f3f6fa;color:#1b2a40;font-size:14px}header{background:#fff;border-bottom:1px solid #e5eaf0;padding:22px max(30px,calc((100vw - 1180px)/2));display:flex;align-items:center;gap:16px;color:#334155;box-shadow:0 1px 2px #1a3c5d09}header b{color:#1577ba;font-size:24px;letter-spacing:-1px}header span{font-weight:800;letter-spacing:3px;font-size:12px}header small{color:#95a6b8;font-size:10px;margin-left:auto;letter-spacing:1.7px}main{max-width:1180px;margin:0 auto;padding:24px 22px 100px}.topnav{display:flex;gap:26px;align-items:center;border-bottom:1px solid #dce4ed;padding:4px 2px 18px;margin-bottom:24px;overflow-x:auto}.topnav a{white-space:nowrap;color:#52667b;text-decoration:none;font-weight:700;font-size:13px}.topnav a:hover{color:#0d81af}.hero{background:linear-gradient(115deg,#102c4c,#185477 76%,#1b7e91);border-radius:20px;padding:36px 40px;color:#fff;display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative;margin-bottom:25px;min-height:195px}.hero h1{font-size:32px;font-weight:800;margin:10px 0;letter-spacing:-.9px}.hero p{max-width:620px;margin:0;color:#d4e7ee;font-size:15px}.hero .eyebrow{color:#86e1e5;letter-spacing:2.6px;font-size:11px;font-weight:800}.hero-symbol{font-size:116px;line-height:1;font-weight:800;color:#ffffff14;position:absolute;right:62px;top:18px}.hero-symbol span{font-size:36px;color:#5ad9d145;vertical-align:top}.workspace-title,.section-head{display:flex;justify-content:space-between;align-items:center;gap:14px}.workspace-title h2{font-size:20px;margin:0 0 16px}.chip{background:#e5f6f5;color:#147b83;border-radius:30px;font-size:11px;padding:7px 12px;font-weight:800;white-space:nowrap}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:6px 0 24px}.metric{background:#fff;border:1px solid #e5ebf2;border-radius:15px;padding:19px 21px;box-shadow:0 5px 18px #20334a06}.metric span{font-size:12px;color:#75879b;font-weight:700}.metric strong{display:block;font-size:35px;line-height:1.4;color:#1d3a56;font-weight:800}.metric small{font-size:11px;color:#9aacbc}.card{background:white;color:#24364c;border:1px solid #e4eaf1;border-radius:16px;box-shadow:0 5px 22px #19395908;padding:25px;margin:18px 0}.card h2{font-size:19px;letter-spacing:-.4px;margin:0 0 10px}.card h3{color:#203b59}.muted{color:#70859b;line-height:1.55}.card:first-of-type{border-left:4px solid #1a9bab}label{color:#52647b;font-size:12px;font-weight:800;margin:12px 0}input,textarea{background:#f9fbfd;border:1px solid #dce5ed;color:#19344a;border-radius:10px;outline:none;padding:12px}input:focus,textarea:focus{border-color:#38a5bd;box-shadow:0 0 0 3px #3cc4d41c}button{background:#177ca7;color:white;border-radius:9px;font-size:12px;padding:11px 16px}button:hover{filter:brightness(1.08)}button.secondary{background:#eef4f8;color:#315b78}.item{background:#fcfdff;border:1px solid #e7edf3;border-radius:13px;padding:20px;margin:13px 0}.item small{display:inline-block;background:#edf5f9;border-radius:16px;color:#386a80;padding:5px 10px;font-weight:800}.item h3{font-size:17px}.buttons{gap:8px;align-items:center}.buttons button{font-size:11px;padding:9px 11px}details{border-top:1px solid #e3eaf0;margin-top:15px}summary{color:#1783a8;font-size:12px;font-weight:800}.legacy-title{display:none!important}.notice{padding:15px;border-radius:10px;background:#fff1ed;color:#9e4d32;border:1px solid #f5d9c8}.notice.success{background:#e7f7ee;color:#207c50}.login{box-shadow:0 20px 60px #173f5c18}.card[style*="max-width:450px"]{box-shadow:0 22px 55px #17395514;margin:80px auto!important;padding:34px}img{border-radius:12px}@media(max-width:750px){.metrics{grid-template-columns:repeat(2,1fr)}.hero{padding:28px 24px}.hero h1{font-size:26px}.hero-symbol{right:-12px;opacity:.5}header{padding:16px 20px}header small{display:none}.topnav{gap:14px}.card{padding:18px}} 
select{width:100%;margin-top:7px;padding:12px;border-radius:9px;background:#f9fbfd;border:1px solid #dce5ed;color:#19344a;font:inherit}.detail-chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}.detail-chips span{background:#eaf4f8;border-radius:30px;padding:5px 10px;color:#426781;font-size:11px;font-weight:700}textarea{min-height:110px}
.asset-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:12px;margin:12px 0}.asset-tile{border:1px solid #dce7f0;border-radius:10px;padding:9px;background:#f8fbfd}.asset-tile img{width:100%;height:100px;object-fit:contain}.asset-tile span{display:flex;align-items:center;gap:8px}.asset-tile input{width:auto}.asset-tile small{display:block;color:#789}
.library-button{display:inline-flex;background:#147da3;color:white;text-decoration:none;padding:12px 16px;border-radius:9px;font-weight:750;white-space:nowrap}
.library-button:hover{background:#0d5e82}
.new-visual-source{margin:18px 0;padding:20px;border:1px solid #dce7ef;background:#f9fbfd;border-radius:14px}.new-visual-source h3{margin:0 0 6px}.new-visual-source .asset-tile{cursor:pointer}.new-visual-source [hidden]{display:none!important}
.asset-modal[hidden]{display:none!important}.asset-modal{position:fixed;inset:0;z-index:9999;background:#081a2bb3;display:grid;place-items:center;padding:20px;backdrop-filter:blur(4px)}.asset-modal-panel{background:white;border-radius:18px;width:min(940px,100%);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 20px 80px #081a2b50;overflow:hidden}.asset-modal-panel header,.asset-modal-panel footer{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:18px 24px;border-bottom:1px solid #e3eaf0}.asset-modal-panel footer{border-top:1px solid #e3eaf0;border-bottom:0}.asset-modal-panel h2{margin:0}.asset-modal-panel p{margin:5px 0;color:#65798a}.asset-close{background:transparent!important;color:#435!important;font-size:30px!important}.asset-toolbar{display:flex;gap:12px;padding:16px 24px}.asset-toolbar input{flex:1}.asset-toolbar select{max-width:250px}.asset-modal-grid{overflow:auto;padding:12px 24px 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:12px;min-height:140px;align-content:start}.asset-choice{position:relative!important;display:flex!important;flex-direction:column;align-items:stretch!important;text-align:left!important;gap:4px;background:#fff!important;color:#14354c!important;border:2px solid #dce5ec!important;padding:9px!important;border-radius:12px!important;min-width:0}.asset-choice.active{border-color:#168fb6!important;background:#f0faff!important}.asset-choice img{width:100%;height:110px;object-fit:contain;background:#f4f8fb;border-radius:7px}.asset-choice strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.asset-choice small{color:#6d8495}.asset-check{position:absolute;right:14px;top:14px;border-radius:50%;width:22px;height:22px;background:#178bb0;color:white;text-align:center}.selected-library-assets{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.selected-chip{display:inline-flex;align-items:center;gap:8px;background:#eaf4f9;padding:6px 10px;border-radius:9px}.selected-chip img{width:36px;height:36px;object-fit:cover;border-radius:5px}.asset-dialog-open{overflow:hidden}@media(max-width:650px){.asset-modal{padding:5px}.asset-modal-panel{max-height:98vh}.asset-toolbar{flex-direction:column}.asset-toolbar select{max-width:none}.asset-modal-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px}.asset-modal-panel header,.asset-modal-panel footer{padding:12px}}

/* BlueSYS Studio — 2026 workspace redesign */
body{background:#f4f7fb;color:#192e46;font-size:14px}
body>header{position:relative;z-index:5;padding:15px 32px;background:#fff;border-bottom:1px solid #e8eef5;box-shadow:none}
body>header b{font-size:23px;color:#087da8}
body>header span{letter-spacing:2px;color:#26465c}
body>header small{font-size:10px;color:#8496a7}
main{max-width:none;margin:0;padding:0}
.studio-layout{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:calc(100vh - 70px)}
.studio-sidebar{border-right:1px solid #e4ebf2;background:#fff;padding:27px 16px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.side-brand{display:flex;align-items:center;gap:11px;padding:7px 10px 25px;border-bottom:1px solid #e9eef4}
.side-icon{width:39px;height:39px;border-radius:12px;background:#0a789e;color:#fff;display:grid;place-items:center;font-weight:900;font-size:19px;box-shadow:0 6px 18px #127ea235}
.side-brand strong{display:block;font-size:14px;letter-spacing:-.4px}.side-brand small{display:block;color:#8fa1b3;margin-top:4px;font-size:11px}
.side-label{font-size:10px;letter-spacing:1.5px;color:#9aabba;font-weight:800;padding:28px 12px 12px}
.topnav{display:flex;flex-direction:column;gap:3px;border:0;padding:0;margin:0;overflow:visible;align-items:stretch}
.topnav a{display:flex;align-items:center;color:#536c80;font-weight:700;padding:12px 13px;border-radius:9px;font-size:12px;transition:background .15s,color .15s}
.topnav a:hover,.topnav a:focus-visible{background:#eaf5f9;color:#087a9f;text-decoration:none}
.topnav a:first-child{background:#eaf6fb;color:#087aa3}
.side-bottom{margin-top:auto;border-top:1px solid #e9eef4;padding:20px 12px;font-size:11px;color:#778e9d;font-weight:700}
.side-indicator{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22b58d;margin-right:7px}
.studio-content{max-width:1310px;width:100%;margin:0 auto;padding:30px clamp(18px,3vw,48px) 95px;min-width:0}
.hero{background:linear-gradient(110deg,#0d304b,#0d5479 66%,#1485a4);padding:34px 40px;min-height:226px;border-radius:18px;margin-bottom:29px;box-shadow:0 10px 26px #12466c16}
.hero .eyebrow{font-size:10px;color:#9ce9e9}
.hero h1{font-size:32px;letter-spacing:-1px;margin:11px 0}
.hero p{font-size:13px;max-width:510px;line-height:1.7}
.hero-action{display:inline-flex;margin-top:21px;gap:20px;align-items:center;background:#fff;color:#0b5d7f;border-radius:9px;padding:12px 16px;font-size:12px;font-weight:800;text-decoration:none}
.hero-action span{font-size:17px}
.hero-symbol{font-size:152px;right:37px;top:27px}
.workspace-title{margin-top:8px}.workspace-title h2{font-size:19px;letter-spacing:-.5px}
.metrics{gap:14px;margin-bottom:20px}
.metric{padding:20px 20px 18px;border:1px solid #e5edf3;box-shadow:0 3px 12px #123e6207}
.metric strong{font-size:33px;line-height:1.35}
.metric span{font-size:11px}
.card{border:1px solid #e6edf4;border-radius:15px;box-shadow:0 4px 18px #20415d07;padding:25px 27px;margin:17px 0}
.card h2{font-size:18px}
.studio-status{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;padding:23px 27px}
.studio-status h2{margin:6px 0}
.studio-status .muted{font-size:12px;max-width:620px;margin:0}
.status-kicker{color:#1c86a5;font-size:10px;font-weight:800;letter-spacing:1.4px}
.status-actions{display:flex;gap:8px;flex-shrink:0}
.status-actions a{padding:10px 12px;text-decoration:none;border:1px solid #dce9f1;background:#f6fafc;border-radius:8px;color:#1d6c8b;font-size:11px;font-weight:800}
.library-highlight{background:linear-gradient(115deg,#fff,#f0f9fc);border-color:#cfe9f1}
.library-highlight .section-head p{font-size:12px;max-width:560px}
.item{background:#fff;border:1px solid #e5ecf3;margin:12px 0;padding:19px 21px}
.item:hover{border-color:#cadce7}
button,.library-button{transition:filter .15s,transform .15s}
button:active,.library-button:active{transform:translateY(1px)}
@media(max-width:1080px){.studio-layout{grid-template-columns:206px minmax(0,1fr)}.status-actions{flex-direction:column}}
@media(max-width:800px){body>header{padding:14px 18px}.studio-layout{display:block}.studio-sidebar{height:auto;position:relative;padding:10px 14px;border-right:0;border-bottom:1px solid #e5edf3}.side-brand,.side-label,.side-bottom{display:none}.topnav{flex-direction:row;gap:6px;overflow-x:auto}.topnav a{padding:10px 12px;white-space:nowrap}.studio-content{padding:22px 16px 65px}.hero{padding:28px 24px}.hero h1{font-size:26px}.studio-status{align-items:stretch;flex-direction:column}.status-actions{flex-direction:row}}
@media(max-width:530px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric{padding:15px}.metric strong{font-size:28px}.card{padding:18px}.hero-symbol{opacity:.24}.studio-status .status-actions{flex-wrap:wrap}.hero-action{margin-top:16px}}

/* Content Planner */
.content-planner{margin:25px 0;background:#fff;border:1px solid #e3ebf3;border-radius:18px;box-shadow:0 8px 32px #1b426008;overflow:hidden;color:#1b344d}
.planner-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:28px 32px 25px;border-bottom:1px solid #eaf0f5;background:linear-gradient(110deg,#fff 60%,#f1f9fc)}
.planner-eyebrow{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#1381a2}
.planner-heading h2{font-size:23px;letter-spacing:-.7px;margin:7px 0}.planner-heading p{margin:0;font-size:12px;color:#758a9d}
.planner-step-tag{font-size:11px;color:#176f90;background:#e8f5fa;padding:9px 13px;border-radius:8px;font-weight:800;white-space:nowrap}
.planner-columns{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(275px,1fr)}
.planner-primary{padding:0 32px 12px;border-right:1px solid #e9eff4;min-width:0}.planner-secondary{padding:0 27px;min-width:0;background:#fcfdff}
.planner-section{padding:26px 0 14px}.planner-primary .planner-section + .planner-section{border-top:1px solid #e8eef3}
.planner-section-title{display:flex;gap:12px;align-items:flex-start;margin-bottom:22px}
.planner-number{display:grid;place-items:center;border-radius:10px;background:#edf6fb;color:#167d9e;width:34px;height:34px;font-size:11px;font-weight:900;flex-shrink:0}
.planner-section-title h3{font-size:15px;color:#183b54;margin:0 0 4px;line-height:1.3}
.planner-section-title p{font-size:11px;color:#8293a3;margin:0;line-height:1.5}
.planner-label{display:block;color:#455d73;font-size:12px;font-weight:750;margin:18px 0}
.planner-label input,.planner-label textarea,.planner-label select{display:block;width:100%;margin:8px 0 0;background:white;border:1px solid #d9e5ee;border-radius:10px;color:#1c3d56;padding:12px 13px;font-weight:500;font-size:13px;box-shadow:0 1px 1px #1b3d4f05}
.planner-label textarea{resize:vertical;min-height:96px}
.planner-label input:focus,.planner-label textarea:focus,.planner-label select:focus{outline:0;border-color:#1498bd;box-shadow:0 0 0 3px #1498bd19}
.required-dot{color:#e1867c}.optional-label{font-weight:500;color:#9aabb9;font-size:11px;margin-left:5px}
.planner-library-button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:13px 15px!important;background:#eaf6fa!important;color:#0a6e94!important;border:1px dashed #81bcce!important;border-radius:10px;font-size:12px!important}
.planner-library-button:hover{background:#dff1f7!important}
.planner-hint{font-size:12px;line-height:1.6;padding:10px 12px;background:#eff8fb;border-radius:8px}
.planner-tip{background:#eef7fb;border:1px solid #d7eaf2;border-radius:12px;padding:17px;margin:15px 0 25px}.planner-tip strong{font-size:12px;color:#1c6e8c}.planner-tip p{font-size:11px;line-height:1.6;margin:6px 0 0;color:#64849a}
.planner-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:21px 32px;background:#f8fbfd;border-top:1px solid #e8eff4}
.planner-footer>span{font-size:11px;color:#76909c}.planner-safe-dot{display:inline-block;width:7px;height:7px;background:#21ae83;border-radius:50%;margin-right:6px}
.planner-submit{padding:13px 20px!important;background:#0d789d!important;color:white!important;border-radius:10px!important;font-size:12px!important;box-shadow:0 5px 14px #187b9a24}.planner-submit span{margin-left:12px}
#planner-schedule[hidden],#new-asset-options[hidden],#new-upload-help[hidden]{display:none!important}
@media(max-width:1100px){.planner-columns{grid-template-columns:minmax(0,1fr)}.planner-primary{border-right:0;padding:0 24px}.planner-secondary{padding:0 24px;border-top:1px solid #e9eff4}.planner-secondary .planner-section{padding-top:23px}.planner-heading{padding:24px}.planner-footer{padding:20px 24px}}
@media(max-width:540px){.planner-heading{padding:19px}.planner-heading h2{font-size:20px}.planner-step-tag{display:none}.planner-primary,.planner-secondary{padding:0 18px}.planner-footer{flex-direction:column;align-items:stretch;padding:17px 18px}.planner-submit{width:100%}}