/* INOOWA Draw V7 · Premium creator dashboard.
   Every button, card, heading and progress indicator is actual HTML/CSS.
   Illustrations are separate source-image assets; never a flattened UI. */
#dashboard.ino-home{
  --hd-ink:#fff8fc;--hd-soft:#ebd5ee;--hd-muted:#d8bddf;--hd-panel:#50234e;
  background:radial-gradient(ellipse at 86% 4%,#612c64 0%,transparent 46%),
             radial-gradient(ellipse at 18% 65%,#4a1749 0%,transparent 52%),
             linear-gradient(128deg,#261023 0%,#361432 51%,#260f2a 100%);
  display:none;font-family:Inter,'SF Pro Display',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--hd-ink);letter-spacing:-.012em;
}
#dashboard.ino-home.active{display:flex}
.ino-home *{box-sizing:border-box}
.ino-home button{font-family:inherit;cursor:pointer}
.ino-home button:focus-visible,.ino-home input:focus-visible{outline:3px solid #ffe1ff;outline-offset:3px}
.ino-home .hd-ico{display:inline-block;vertical-align:middle;flex:none}
.hd-sidebar{width:126px;flex:none;display:flex;flex-direction:column;align-items:center;gap:17px;padding:24px 10px 22px 12px;background:linear-gradient(180deg,rgba(22,8,25,.82),rgba(35,10,33,.83));border-right:1px solid #b96ab62a;box-shadow:13px 0 31px #14071925;z-index:2}
.hd-logo{height:122px;width:106px;border-radius:29px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(155deg,#301032,#2e1231);border:1px solid #753c6d32;gap:2px}
.hd-logo>img:first-child{height:51px;width:80px;object-fit:contain}
.hd-logo .hd-brand-wordmark{width:75px;height:15px;object-fit:contain;margin-top:2px}
.hd-logo span{font-size:12px;color:#fff;letter-spacing:.1em;font-weight:750}
.hd-navigation{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;padding-top:2px}
.hd-navitem{height:92px;width:98px;border:1px solid transparent;border-radius:24px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;background:none;color:#efdcf3;transition:background .2s ease,transform .2s ease}
.hd-navitem:hover,.hd-parentlink:hover{background:#a449aa45;transform:translateY(-1px)}
.hd-navitem.hd-active{background:linear-gradient(142deg,#9932b0,#722782);border-color:#d66cde73;box-shadow:0 12px 22px #20052e4d}
.hd-navitem span,.hd-parentlink span{font-size:13px;font-weight:650;white-space:nowrap}
.hd-parentlink{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:9px;justify-content:center;width:90px;height:80px;border-radius:24px;background:#42134462;border:1px solid #88528a82;color:#e5d1f0}
.hd-content{height:100%;flex:1;min-width:0;display:flex;flex-direction:column;padding:19px 24px 17px 23px;gap:12px;z-index:1}
.hd-header{flex:0 0 77px;min-height:77px;display:grid;grid-template-columns:minmax(300px,1.14fr) minmax(270px,1fr) 213px 68px;gap:16px;align-items:center;padding:0 1px 2px}
.hd-greeting{display:flex;align-items:center;gap:12px;min-width:0}
.hd-greeting .hd-wave{font-size:38px;line-height:1;filter:drop-shadow(0 4px 5px #0005)}
#dashboard .hd-greeting h1{font-size:30px;line-height:1.1;font-weight:820;letter-spacing:-.029em;color:#fff6fd;white-space:nowrap}
.hd-greeting p{color:#cdb1d3;margin-top:5px;font-size:16px;line-height:1.28}
.hd-search{height:50px;border:1px solid #784d81b0;border-radius:26px;background:#4b2052b5;display:flex;align-items:center;gap:12px;padding:0 18px;color:#c29cc8;position:relative;min-width:0;box-shadow:inset 0 1px 0 #ffffff0f}
.hd-search:focus-within{border-color:#d2a8e2;box-shadow:0 0 0 3px #9d5cbc28}
.hd-search input{background:transparent;color:#faf3ff;border:0;outline:0;font-size:15px;min-width:0;width:100%;height:100%}
.hd-search input::placeholder{color:#ccadcd;opacity:1}
.hd-search input::-webkit-search-cancel-button{cursor:pointer}
.hd-search-results{position:absolute;top:calc(100% + 9px);left:0;right:0;z-index:25;border-radius:18px;border:1px solid #9663a0;background:#35143d;box-shadow:0 16px 45px #110815a8;overflow:hidden;padding:7px}
.hd-search-results button{border:0;display:flex;justify-content:space-between;align-items:center;color:#fff;background:transparent;width:100%;padding:12px 14px;border-radius:11px;text-align:left;font-size:16px}
.hd-search-results button:hover{background:#6f2d79}
.hd-search-results p{padding:13px 15px;color:#d9bfdc;font-size:15px}
.hd-score{height:56px;border-radius:24px;border:1px solid #7f3f93;background:linear-gradient(120deg,#602377,#442154);display:flex;align-items:center;justify-content:center;gap:9px;color:#fff;white-space:nowrap}
.hd-score-star{font-size:30px;color:#ffd056;text-shadow:0 2px 11px #f2ad5b80}
.hd-score b{font-size:25px;letter-spacing:-.02em}
.hd-score span:last-child{font-size:13px;color:#f5dcf6}
.hd-avatar{width:60px;height:60px;border-radius:50%;padding:2px;border:2px solid #eeb8eb;background:#d7b0d4;overflow:hidden}
.hd-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.hd-scroll{flex:1;min-height:0;display:flex;flex-direction:column;gap:11px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#a3539a transparent;padding-right:1px}
.hd-feature-row{height:286px;display:grid;grid-template-columns:1.78fr 1fr;gap:14px;flex:none;min-height:0}
.hd-continue,.hd-achievement-panel{border-radius:27px;position:relative;overflow:hidden;border:1px solid #8b468a80}
.hd-continue{background:radial-gradient(ellipse at 93% 37%,#9f4b91,#633080 57%,#55206b 95%)}
.hd-hero-art{position:absolute;height:110%;width:70%;object-fit:cover;right:-3%;top:-5%;object-position:56% center;filter:saturate(1.02)}
.hd-hero-scrim{position:absolute;inset:0;background:linear-gradient(90deg,#4d1866 0%,#572077fa 34%,#512377b0 54%,#6f2f6000 77%)}
.hd-continue-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;height:100%;width:63%;padding:21px 17px 21px 27px}
.hd-spark-tag{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:18px;background:#eac0f5;color:#442057;font-size:13px;font-weight:850;white-space:nowrap}
.hd-spark-tag .hd-ico{color:#d88f30;fill:#faca69;stroke:#ce8432}
#dashboard .hd-continue h2{font-size:29px;line-height:1.04;font-weight:850;margin:5px 0 0;letter-spacing:-.035em;text-shadow:0 3px 10px #3b135e5b}
.hd-continue-copy p{font-size:16px;color:#f4ddfa;line-height:1.32;max-width:330px}
.hd-progress-info{display:flex;justify-content:space-between;align-items:center;gap:6px;width:211px;font-size:13px;font-weight:700;margin-top:2px;color:#fff0fe}
.hd-progress-info span:last-child{opacity:.72}
.hd-mini-progress{width:215px;height:11px;border-radius:12px;background:#33124e;border:1px solid #a16fb4;overflow:hidden}
.hd-mini-progress span{display:block;width:50%;height:100%;border-radius:12px;background:linear-gradient(90deg,#fc6fe5,#db52d9);transition:width .25s ease}
.hd-continue-cta{width:215px;height:45px;margin-top:4px;border:0;border-radius:24px;color:#451b5f;display:flex;align-items:center;justify-content:center;gap:16px;background:#e9bdf5;font-size:16px;font-weight:820;box-shadow:0 3px 13px #390e4c25}
.hd-continue-cta:hover,.hd-feature-copy button:hover{filter:brightness(1.085)}
.hd-achievement-panel{padding:19px 18px 15px 23px;background:linear-gradient(145deg,#603466,#772e61 68%,#64274c);box-shadow:inset 0 1px 0 #e59cd31d}
.hd-achievement-panel>header{display:flex;justify-content:space-between;align-items:center}
#dashboard .hd-achievement-panel h2{font-size:23px;font-weight:820}
.hd-progress-more{border:0;background:transparent;color:#eee0f2;width:34px;height:32px;display:grid;place-items:center}
.hd-achievement-main{display:grid;grid-template-columns:1.02fr 1fr;gap:13px;align-items:center;height:calc(100% - 34px)}
.hd-ring{width:193px;height:193px;max-width:100%;margin:auto;position:relative;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 210deg,#f978ab 0 14%,#aa78f6 27%,#69d9fa 60%,#2c174e 60% 100%);box-shadow:0 5px 19px #280c3980,inset 0 0 0 2px #8d70b763}
.hd-ring:before{content:"";position:absolute;inset:14px;border-radius:50%;background:linear-gradient(160deg,#472055,#542251);box-shadow:inset 0 8px 23px #240d42}
.hd-ring-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.hd-ring-inner>span{font-size:33px;color:#ffd25d;line-height:1}
.hd-ring-inner strong{font-size:39px;font-weight:850;letter-spacing:-.055em}
.hd-ring-inner small{font-size:14px;color:#e9c9e5}
.hd-stat-list{display:flex;flex-direction:column;gap:7px}
.hd-stat{display:grid;grid-template-columns:43px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:8px;background:#421b4e75;border-radius:16px;padding:7px 8px;min-height:47px}
.hd-stat span{font-size:29px;grid-row:span 2;text-align:center}
.hd-stat b{font-size:20px;line-height:1.05}
.hd-stat small{font-size:12px;color:#e6cfe7;line-height:1.1}
.hd-worlds-block{flex:none;display:flex;flex-direction:column;gap:8px}
.hd-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;min-width:0;padding:0 3px}
.hd-section-head>div{display:flex;align-items:baseline;gap:15px;min-width:0}
#dashboard .hd-section-head h2{font-size:23px;font-weight:810;white-space:nowrap;line-height:1.35}
.hd-section-head p{color:#cdb6d0;font-size:13px;line-height:1.4;white-space:nowrap}
.hd-seeall{background:transparent;border:0;padding:4px 0;display:inline-flex;align-items:center;gap:7px;color:#f5e2f5;font-size:13px;font-weight:720;white-space:nowrap}
.hd-seeall:hover{color:#fabbfc}
.hd-world-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;height:165px}
.hd-world-card{padding:0;position:relative;overflow:hidden;border-radius:21px;border:1.5px solid #bd72b5a6;background:#55244a;min-width:0;display:block;text-align:left;color:white;transition:transform .16s ease,border-color .16s ease}
.hd-world-card:hover{transform:translateY(-3px);border-color:#f6c4fa}
.hd-world-card>img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 24%;filter:saturate(1.15)}
.hd-world-card:after{content:"";position:absolute;inset:38% 0 0;pointer-events:none;background:linear-gradient(0deg,#211028dc,transparent)}
.hd-world-tag{position:absolute;top:11px;right:10px;z-index:2;border-radius:18px;display:flex;align-items:center;gap:4px;font-size:12px;font-weight:770;padding:6px 10px;background:#392045ad;color:#eee1f4;border:1px solid #ffffff64;backdrop-filter:blur(4px)}
.hd-world-tag.available{top:10px;right:auto;left:11px;background:#e4f7e9f0;color:#183d31}
.hd-world-text{position:absolute;bottom:9px;left:16px;z-index:3;display:flex;flex-direction:column;gap:4px}
.hd-world-text strong{font-size:19px;letter-spacing:-.02em;line-height:1}
.hd-world-text small{font-size:14px;color:#fff7ff;font-weight:550}
.hd-feature-tiles{display:grid;grid-template-columns:1.08fr 1fr;gap:13px;height:143px;flex:none}
.hd-feature-tile{border-radius:22px;position:relative;overflow:hidden;border:1px solid #a65aa875;background:linear-gradient(115deg,#542071,#7e3289);isolation:isolate}
.hd-feature-tile.world{background:linear-gradient(100deg,#6f3079,#9242a7)}
.hd-feature-tile>img{position:absolute;right:-9px;top:0;width:66%;height:100%;object-fit:cover;object-position:center;filter:saturate(1.05);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 23%);mask-image:linear-gradient(90deg,transparent 0%,#000 23%)}
.hd-feature-tile.world>img{width:65%;object-position:65%}
.hd-feature-copy{display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto auto;column-gap:8px;align-items:start;position:relative;z-index:2;padding:17px 18px;width:77%;height:100%}
.hd-feature-emoji{font-size:34px;grid-row:span 2;line-height:1.15}
#dashboard .hd-feature-copy h2{font-size:21px;line-height:1.15;font-weight:850}
.hd-feature-copy p{font-size:13px;line-height:1.27;max-width:310px;color:#eedbee}
.hd-feature-copy button{grid-column:1 / 3;align-self:end;width:205px;height:37px;display:flex;align-items:center;justify-content:center;gap:13px;border:0;border-radius:20px;background:#e8b8f3;color:#481754;font-size:14px;font-weight:850}
.hd-bottom-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:15px;min-height:0;flex:1}
.hd-library-panel,.hd-badges-panel{min-width:0;display:flex;flex-direction:column;gap:10px}
.hd-bottom-grid .hd-section-head h2{font-size:20px!important}
.hd-bottom-grid .hd-section-head p{font-size:12px}
.hd-drawing-grid,.hd-badges-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;flex:1;min-height:0}
.hd-drawing-card{border:1px solid #a96c9c9c;border-radius:18px;background:#8b6178;padding:0;overflow:hidden;min-width:0;min-height:0;box-shadow:0 4px 12px #180b1d5e}
.hd-drawing-card img{width:100%;height:100%;object-fit:cover;object-position:center 43%;display:block;transition:transform .2s ease}
.hd-drawing-card:hover img{transform:scale(1.06)}
.hd-badge{min-width:0;min-height:0;border-radius:20px;border:1px solid #8f5b91a0;background:#542d58b8;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:5px 3px 4px;gap:3px;color:#fbebf8;overflow:hidden}
.hd-badge img{height:76px;width:78px;object-fit:cover;object-position:center 54%;border-radius:16px;filter:drop-shadow(0 3px 5px #13071c60)}
.hd-badge strong{font-size:11.5px;white-space:nowrap}
.hd-badge small{font-size:10px;color:#d9c3db;white-space:nowrap}
.hd-badge:hover{background:#753778}
@media (prefers-reduced-motion:reduce){.ino-home *, .ino-home *::before, .ino-home *::after{transition:none!important}}
/* Finish: artwork carries no baked text or duplicated status chips. */
.hd-world-card>img{object-position:center 24%;}
.hd-badge img{object-fit:contain;width:86px;height:76px;border-radius:0}
.hd-drawing-card img{object-position:center 52%}

/* Refinement: obscure baked source captions and blend badge textures with card surfaces. */
.hd-world-card::after{background:linear-gradient(0deg,#26122ceB 0%,#2d1430cf 19%,rgba(30,11,38,.33) 40%,transparent 64%)}
.hd-badge img{-webkit-mask-image:radial-gradient(ellipse 67% 75% at 50% 51%,#000 49%,transparent 100%);mask-image:radial-gradient(ellipse 67% 75% at 50% 51%,#000 49%,transparent 100%)}
