/* INOOWA Draw 06B Handoff · 1366×1024 landscape review prototype
 * Approved art is a real independent PNG at assets/v6/onboarding/handoff_background.png.
 * CSS overlay preserves legibility without dividing the image into panels.
 */
#handoff-v2.h6-screen{background:radial-gradient(ellipse at 78% 44%,#3e4782 0%,#20295e 48%,#081638 100%);color:#f9fbff;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
#handoff-v2 .h6-background{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
#handoff-v2 .h6-background[hidden]{display:none!important}
#handoff-v2 .h6-shade{position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(3,14,47,.76) 0%,rgba(7,17,50,.70) 28%,rgba(8,17,46,.44) 45%,rgba(10,19,50,.09) 70%,transparent 100%)}
#handoff-v2 .h6-art-missing[hidden]{display:none!important}
#handoff-v2 .h6-art-missing{position:absolute;z-index:3;right:42px;bottom:72px;max-width:410px;background:rgba(9,27,63,.9);border:1px solid #83bce7;border-radius:15px;padding:18px 22px;color:#f1f7ff;font-size:15px;line-height:1.4}
#handoff-v2 .h6-header{position:absolute;z-index:5;left:74px;right:72px;top:38px;display:flex;align-items:center;justify-content:space-between;height:68px}
#handoff-v2 .h6-brand{display:flex;gap:12px;align-items:center}
#handoff-v2 .h6-brand img{display:block;object-fit:contain;width:186px;height:auto}
#handoff-v2 .h6-brand span{font-size:26px;font-weight:770;color:#efb0e5;letter-spacing:-.04em}
#handoff-v2 .h6-ready{display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:830;letter-spacing:.09em;color:#e6faff;text-shadow:0 2px 10px #04102b;white-space:nowrap}
#handoff-v2 .h6-ready>span:first-child{width:35px;height:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(63,163,156,.72);border:1px solid #a7f4d4;font-size:22px;line-height:1}
#handoff-v2 .h6-content{position:absolute;z-index:3;left:76px;top:179px;width:575px;max-width:calc(100% - 150px)}
#handoff-v2 .h6-kicker{display:block;font-size:15px;font-weight:820;letter-spacing:.13em;color:#9ce5ef;margin-bottom:21px;text-shadow:0 2px 9px #07172c}
#handoff-v2 .h6-content h1{font-size:74px;line-height:1.06;font-weight:835;letter-spacing:-.058em;color:#fff;text-shadow:0 5px 26px #03102d6d}
#handoff-v2 .h6-lead{font-size:24px;line-height:1.38;color:#e2ebff;max-width:540px;margin-top:24px;text-shadow:0 2px 10px #0513338c}
#handoff-v2 .h6-child-card{display:flex;align-items:center;gap:18px;padding:14px 18px;max-width:548px;min-height:106px;margin-top:37px;border-radius:24px;border:1.4px solid #8198bf;background:rgba(22,43,88,.76);box-shadow:0 10px 30px #0c15465c;backdrop-filter:blur(6px)}
#handoff-v2 .h6-child-card>img{width:76px;height:76px;object-fit:cover;flex:none;border-radius:50%;border:2px solid #afe7ec;background:#6684ae}
#handoff-v2 .h6-child-info{display:flex;flex:1;min-width:0;flex-direction:column;gap:8px}
#handoff-v2 .h6-child-info strong{font-size:23px;line-height:1.15;color:white}
#handoff-v2 .h6-child-info span{font-size:16px;color:#cbdaef}
#handoff-v2 .h6-edit{border:1px solid #90aeda;background:#294c7c;color:#e7f9ff;border-radius:16px;min-height:48px;padding:9px 18px;font-size:17px;font-weight:730}
#handoff-v2 .h6-edit:hover{background:#416698}
#handoff-v2 .h6-cta{display:flex;align-items:center;justify-content:center;gap:22px;width:548px;max-width:100%;height:77px;margin-top:27px;border:0;border-radius:25px;background:linear-gradient(103deg,#03c8e9 0%,#5165ee 44%,#d94ad2 79%,#ffc26b 100%);box-shadow:0 15px 39px #0a11447a;color:white;font-size:24px;font-weight:820;text-shadow:0 1px 4px #24316a4e}
#handoff-v2 .h6-cta:hover{filter:brightness(1.1)}
#handoff-v2 .h6-cta span{font-size:31px;font-weight:500}
#handoff-v2 .h6-footnote{position:absolute;z-index:4;bottom:31px;left:77px;font-size:13px;letter-spacing:.015em;color:#b8cae7;text-shadow:0 2px 10px #07172f}
/* Keep all product controls in HTML, separate from the user-supplied illustrative art. */
@media(prefers-reduced-motion:reduce){#handoff-v2 .h6-cta{transition:none}}


/* 06B — optional young-artist profile editor as a state of Handoff, not an extra route.
   Never modifies the original approved illustration or the official Owii. */
#handoff-v2 [hidden]{display:none!important}
#handoff-v2 .h6-edit{
 display:inline-flex;justify-content:center;align-items:center;gap:9px;
 min-width:172px;min-height:57px;padding:12px 16px;
 border:1.5px solid #b5ebfa;border-radius:18px;
 background:linear-gradient(145deg,#46689e,#254b82);color:#fff;
 box-shadow:0 5px 16px #05123560;font-size:17px;font-weight:850
}
#handoff-v2 .h6-edit span{font-size:26px;font-weight:650;line-height:1}
#handoff-v2 .h6-edit:hover{background:linear-gradient(145deg,#547cb4,#316097)}
#handoff-v2 .h6-child-symbol{
 display:grid;place-items:center;flex:none;width:76px;height:76px;
 border-radius:50%;border:2px solid #cae8fb;color:#fff;font-size:42px;
 text-shadow:0 2px 4px #11264e70;background:linear-gradient(135deg,#6853c4,#c38cf6)
}
#handoff-v2 .h6-symbol-palette{background:linear-gradient(135deg,#d771b4,#e8ae65)}
#handoff-v2 .h6-symbol-explorer{background:linear-gradient(135deg,#39a9b9,#3156a3)}
#handoff-v2 .h6-editor-shade{
 position:absolute;inset:0;z-index:20;background:rgba(5,12,39,.70);
 backdrop-filter:blur(6px);cursor:pointer
}
#handoff-v2 .h6-profile-editor{
 position:absolute;z-index:21;left:50%;top:50%;
 transform:translate(-50%,-50%);
 width:700px;max-width:calc(100% - 100px);min-height:690px;
 padding:40px 44px 37px;border-radius:34px;
 border:2px solid rgba(197,222,255,.8);
 background:linear-gradient(153deg,#f8f5ff 0%,#f0f8ff 57%,#e8edff 100%);
 box-shadow:0 24px 75px #020c31b8;
 color:#301e5c
}
#handoff-v2 .h6-editor-header{position:relative}
#handoff-v2 .h6-editor-eyebrow{
 display:block;font-size:12px;letter-spacing:.14em;font-weight:900;color:#7240a9;margin-bottom:10px
}
#handoff-v2 .h6-editor-header h2{
 margin:0;font-size:48px;line-height:1.05;font-weight:940;
 letter-spacing:-.05em;color:#341869
}
#handoff-v2 .h6-editor-header p{margin:10px 0 28px;font-size:18px;line-height:1.36;color:#594c7e}
#handoff-v2 .h6-editor-close{
 position:absolute;top:-13px;right:-9px;width:47px;height:47px;
 display:grid;place-items:center;cursor:pointer;border:1.5px solid #c6b8e0;
 border-radius:50%;background:white;color:#6a398e;font-size:35px;line-height:1
}
#handoff-v2 .h6-editor-form{display:flex;flex-direction:column}
#handoff-v2 .h6-editor-label{font-size:18px;font-weight:875;margin-bottom:11px}
#handoff-v2 #h6-profile-name{
 height:66px;width:100%;border:2px solid #b9b6df;border-radius:17px;
 font:700 22px Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 padding:0 20px;background:#fff;color:#302257;outline:none
}
#handoff-v2 #h6-profile-name:focus{border-color:#9458df;box-shadow:0 0 0 4px #b990ec55}
#handoff-v2 .h6-editor-helper{font-size:13px;color:#79699b;margin-top:8px}
#handoff-v2 .h6-avatar-choices{
 display:flex;align-items:center;gap:19px;margin:28px 0 0;
 border:0;padding:0;min-width:0;flex-wrap:wrap
}
#handoff-v2 .h6-avatar-choices legend{
 display:block;width:100%;margin:0 0 12px;
 font-size:18px;font-weight:870;color:#3e266f
}
#handoff-v2 .h6-avatar-option{
 width:90px;height:90px;flex:none;border:3px solid #c5bddc;
 border-radius:50%;display:grid;place-items:center;
 font-size:53px;font-weight:850;cursor:pointer;
 color:white;background:linear-gradient(135deg,#715ac6,#c58aed)
}
#handoff-v2 .h6-avatar-option img{
 display:block;width:100%;height:100%;object-fit:cover;
 border-radius:50%;background:#c8b2ef
}
#handoff-v2 .h6-avatar-option.is-selected{
 border:4px solid #7b3bdb;box-shadow:0 0 0 5px #d8baf9,0 5px 18px #3c126363
}
#handoff-v2 .h6-avatar-palette{background:linear-gradient(135deg,#d971aa,#e5ab67)}
#handoff-v2 .h6-avatar-explorer{background:linear-gradient(135deg,#35a9b8,#3956b0)}
#handoff-v2 .h6-editor-footnote{color:#715e90;font-size:13px;margin-top:23px;line-height:1.4}
#handoff-v2 .h6-editor-actions{display:flex;gap:15px;margin-top:23px}
#handoff-v2 .h6-editor-actions button{
 height:68px;min-width:0;flex:1;border-radius:20px;font-size:20px;
 font-weight:900;cursor:pointer
}
#handoff-v2 .h6-editor-cancel{border:2px solid #b6a9ce;background:#fff;color:#5b4281}
#handoff-v2 .h6-editor-save{
 color:#fff;border:0;background:linear-gradient(110deg,#6866eb,#a449dc);
 box-shadow:0 8px 20px #6342bb5c
}
#handoff-v2 .h6-editor-save span{margin-left:7px}
#handoff-v2 .h6-editor-actions button:focus-visible,
#handoff-v2 .h6-avatar-option:focus-visible{outline:3px solid #4c9fea;outline-offset:4px}
