/* AISellSpace V31 UI polish — presentation-only, preserves existing app logic. */
:root{--primary:#6254e8;--soft:#f3f1ff}
.member-action-tile{border:1px solid #e7e4fa!important;border-radius:15px!important;box-shadow:0 4px 16px #2f236408;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;gap:9px!important}
.member-action-tile:hover{transform:translateY(-2px);box-shadow:0 9px 22px #5144a019;border-color:#c6bdf7!important}
.member-action-tile>span:first-child{display:grid;place-items:center;width:39px;height:39px;min-width:39px;border-radius:12px;background:linear-gradient(135deg,#f0ecff,#ded6ff);color:#5a47d6;font-size:21px!important;line-height:1}
.member-action-tile:nth-child(2)>span:first-child{background:linear-gradient(135deg,#e8f7ff,#d5eaff);color:#2576c5}
.member-action-tile:nth-child(3)>span:first-child{background:linear-gradient(135deg,#fdf0ff,#f0dfff);color:#a14ab5}
.member-action-tile:nth-child(4)>span:first-child{background:linear-gradient(135deg,#e8fff2,#d7f9e5);color:#15946b}
.metric,.card{box-shadow:0 3px 16px #1f204006}
.btn{transition:filter .16s ease,transform .16s ease}.btn:hover{filter:brightness(1.06)}.btn:active{transform:translateY(1px)}
/* Image quiz: 2x2 compact answers, image + question + submit fit in a typical desktop viewport. */
body:has(#quiz-answer-form) .content{padding-top:12px!important;padding-bottom:18px!important}
body:has(#quiz-answer-form) .eyebrow{font-size:10px}
body:has(#quiz-answer-form) h1.title{font-size:21px;margin:3px 0 6px}
body:has(#quiz-answer-form) .store-toolbar{margin:5px 0 9px!important}
body:has(#quiz-answer-form) .quiz-page-grid{gap:12px!important}
body:has(#quiz-answer-form) .quiz-main{padding:13px 17px!important;max-width:100%!important;margin-bottom:8px!important}
body:has(#quiz-answer-form) .quiz-main .cardhead{margin-bottom:5px!important}
body:has(#quiz-answer-form) .quiz-main .cardhead h3{font-size:13px!important}
body:has(#quiz-answer-form) .quiz-main>.muted{margin:4px 0 7px!important;font-size:11px}
#quiz-answer-form{display:grid;grid-template-columns:minmax(170px,240px) minmax(0,1fr);grid-template-rows:auto auto 1fr auto;column-gap:18px;row-gap:8px;align-items:start}
#quiz-answer-form .quiz-picture{grid-column:1;grid-row:1 / 5;margin:0!important;padding:8px!important;align-self:start;border-radius:13px}
#quiz-answer-form .quiz-picture img{width:100%!important;max-width:215px!important;height:215px!important;object-fit:contain}
#quiz-answer-form .quiz-picture figcaption{font-size:9px;margin-top:4px}
#quiz-answer-form h2{grid-column:2;grid-row:1;font-size:17px!important;line-height:1.3;margin:2px 0 5px!important}
#quiz-answer-form .quiz-choice{grid-column:2;display:flex;align-items:center;min-height:42px;margin:0!important;padding:9px 11px!important;border-radius:10px;font-size:13px!important;line-height:1.3;cursor:pointer;transition:background .15s,border-color .15s}
#quiz-answer-form .quiz-choice:hover{background:#f6f3ff;border-color:#a69cf1}
#quiz-answer-form .quiz-choice:has(input:checked){background:#f0ecff;border-color:#6654e8;box-shadow:inset 0 0 0 1px #6654e8}
#quiz-answer-form .quiz-choice input{accent-color:#6254e8;margin:0 7px 0 0}
#quiz-answer-form .btn{grid-column:2;grid-row:auto;min-height:40px;margin:4px 0 0!important}
/* No-image questions also use compact full-width form. */
#quiz-answer-form:not(:has(.quiz-picture)){grid-template-columns:1fr;max-width:650px;margin:auto}
#quiz-answer-form:not(:has(.quiz-picture)) h2,#quiz-answer-form:not(:has(.quiz-picture)) .quiz-choice,#quiz-answer-form:not(:has(.quiz-picture)) .btn{grid-column:1}
@media(min-width:720px){#quiz-answer-form{grid-template-columns:minmax(170px,240px) repeat(2,minmax(0,1fr));grid-template-rows:auto auto auto auto}
#quiz-answer-form h2{grid-column:2 / 4}
#quiz-answer-form .quiz-choice:nth-of-type(1),#quiz-answer-form .quiz-choice:nth-of-type(3){grid-column:2}
#quiz-answer-form .quiz-choice:nth-of-type(2),#quiz-answer-form .quiz-choice:nth-of-type(4){grid-column:3}
#quiz-answer-form .quiz-choice:nth-of-type(1),#quiz-answer-form .quiz-choice:nth-of-type(2){grid-row:2}
#quiz-answer-form .quiz-choice:nth-of-type(3),#quiz-answer-form .quiz-choice:nth-of-type(4){grid-row:3}
#quiz-answer-form .btn{grid-column:2 / 4;grid-row:4}
}
@media(max-width:719px){body:has(#quiz-answer-form) .content{padding:10px 12px!important}body:has(#quiz-answer-form) .quiz-main{padding:10px!important}
#quiz-answer-form{display:flex;flex-direction:column;gap:7px}
#quiz-answer-form .quiz-picture{align-self:center;width:100%;padding:5px!important;display:flex;align-items:center;justify-content:center;gap:8px}
#quiz-answer-form .quiz-picture img{width:auto!important;max-width:100%!important;height:min(22vh,145px)!important}
#quiz-answer-form .quiz-picture figcaption{max-width:95px;font-size:9px}
#quiz-answer-form h2{font-size:15px!important;margin:2px 0!important}
#quiz-answer-form .quiz-choice{width:100%;min-height:40px;padding:8px 10px!important;font-size:12px!important}
#quiz-answer-form .btn{width:100%;min-height:42px}
}
@media(max-height:720px) and (min-width:720px){#quiz-answer-form .quiz-picture img{height:150px!important}body:has(#quiz-answer-form) .quiz-main{padding:10px!important}}
/* Text-only questions must not inherit image-layout implicit desktop columns. */
@media(min-width:720px){#quiz-answer-form:not(:has(.quiz-picture)) h2,#quiz-answer-form:not(:has(.quiz-picture)) .quiz-choice:nth-of-type(n),#quiz-answer-form:not(:has(.quiz-picture)) .btn{grid-column:1;grid-row:auto}}

/* V35 member UI navigation and visual refinement */
.side .navtitle{font-size:10px;letter-spacing:1.15px;margin:17px 12px 7px;color:#9297a8}
.side .nav,.side .store-nav-title{min-height:40px;border-radius:10px;font-weight:650;transition:background .15s,color .15s}
.side .store-submenu{margin:2px 0 8px 12px;padding-left:8px;border-left:1px solid #e9e9f3}
.side .store-submenu .nav{min-height:35px;font-size:12px;padding-top:8px;padding-bottom:8px}
.side .sidefoot{padding:13px;border-radius:13px}
.side .sidefoot p{font-size:11px;line-height:1.5}
.member-action-tile,.quick-card,.metric{transition:transform .18s ease,box-shadow .18s ease}
.member-action-tile:hover,.quick-card:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(35,30,85,.08)}
@media(max-width:780px){.side .nav,.side .store-nav-title{min-height:43px}.side .store-submenu .nav{min-height:39px}}
