/* Recipe Book Parity — feature/masterwork-crafting.
   ONE canonical style for eight game menus. Loaded AFTER style.css and other
   stylesheets; applies only to windows explicitly marked ssq-recipe-skin.
   Match Recipe Book's real dimensions, illustrated header, frosted cards,
   compact category tabs and desktop card grids—not only its background.
   Combat state, quest status, purchases and disabled/selected semantics stay intact. */

:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin {
    --ssq-recipe-ink:#F6E7DD;
    --ssq-recipe-rose:#E7968E;
    --ssq-recipe-gold:#F7CDA9;
    /* The screenshot's target is the UNLOCKED recipe card, not the
       default undiscovered card. Match its exact low-opacity warm tint. */
    --ssq-recipe-border:#D59A5C85;
    --ssq-recipe-tile:#D59A5C1F;
    width:min(980px,96vw);
    max-height:min(820px,92dvh);
    box-sizing:border-box;
    min-width:0;
    border:1px solid #9E629575;
    border-radius:20px;
    color:var(--ssq-recipe-ink);
    background:
        linear-gradient(180deg,rgba(23,25,46,.74),rgba(36,38,63,.68)),
        url("../assets/images/login-screen.png") center center / cover no-repeat;
    box-shadow:0 18px 54px rgba(23,25,46,.50),inset 0 1px rgba(246,231,221,.06);
}

/* Preserve long Quest stories, Shop browsing and leaderboard ranking areas,
   which already have deliberate internal scroll regions. */
#quest-book-modal > .ssq-recipe-skin {width:min(1040px,96vw);}
#game-shop-modal > .ssq-recipe-skin {width:min(1080px,96vw);}
#leaderboard-modal > .ssq-recipe-skin {width:min(1050px,96vw);}
#party-modal > .ssq-recipe-skin {width:min(920px,96vw);}
#guild-modal > .ssq-recipe-skin {width:min(980px,96vw);}
#settings-modal > .ssq-recipe-skin {width:min(900px,96vw);}

/* All eight now have the SAME Recipe Book illustration/title bar.
   Keep the close X and actual title semantics from the original menu. */
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin
> :is(.skills-header,.recipe-book-header,.apprentice-header,.settings-header,
      .game-shop-header,.party-header,.leaderboard-header) {
    position:relative;
    isolation:isolate;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    min-height:78px;
    padding:15px 16px 11px;
    box-sizing:border-box;
    border-bottom:1px solid rgba(158,98,149,.42);
    border-radius:19px 19px 0 0;
    background:
        linear-gradient(90deg,rgba(23,25,46,.84),rgba(36,38,63,.60) 40%,
            rgba(36,38,63,.58) 62%,rgba(23,25,46,.84)),
        url("../assets/images/ui/top-scene-banner.png") center 46% / cover no-repeat;
    box-shadow:0 5px 18px rgba(23,25,46,.34),
        inset 0 -1px rgba(247,205,169,.08);
    text-shadow:0 2px 5px rgba(23,25,46,.92),
        0 0 12px rgba(23,25,46,.72);
}
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin > :is(.skills-header,.recipe-book-header,.apprentice-header,
    .settings-header,.game-shop-header,.party-header,.leaderboard-header)
> * {position:relative;z-index:1;}
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin > :is(.skills-header,.recipe-book-header,.apprentice-header,
    .settings-header,.game-shop-header,.party-header,.leaderboard-header)
h2 {margin:0;font-size:1.15rem;line-height:1.25;}
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin > :is(.skills-header,.recipe-book-header,.apprentice-header,
    .settings-header,.game-shop-header,.party-header,.leaderboard-header)
.panel-label {color:#F7CDA9;letter-spacing:.07em;}

/* Match Recipe Book's *unlocked* middle tiles: the scenery remains visible
   through #D59A5C1F, with its real #D59A5C85 border (not opaque #343558D1).
   Explicit shorthand wins over the older solid-purple card backgrounds. */
:is(#skills-modal,#apprentice-modal,#settings-modal,#game-shop-modal,
    #party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin :is(
    .skills-card,.mastery-road-section,.mastery-summary,
    .apprentice-access-card,.apprentice-job-card,.apprentice-skills-card,
    .apprentice-skill-card,.apprentice-satchel-card,
    .settings-card:not(.settings-danger-card),
    .party-card,.guild-card,.guild-progression-panel,.guild-contribution-card,
    .guild-reward-card,.game-shop-bag-card,.game-shop-bag-section,
    .game-shop-cosmetic-card,.account-premium-card,.account-product-preview,
    .leaderboard-podium-card,.leaderboard-row
):not(.is-active):not(.is-blocked):not(.selected):not(.completed) {
    box-sizing:border-box;
    padding:10px;
    border:1px solid var(--ssq-recipe-border);
    border-radius:11px;
    background:var(--ssq-recipe-tile);
    box-shadow:inset 0 1px rgba(246,231,221,.035);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card {
    border:1px solid var(--ssq-recipe-border);
    border-radius:11px;
    background:var(--ssq-recipe-tile);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card-locked {
    border-style:dashed;background:#3435588F;
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card-active {
    border-color:#F7CDA9A1;
    background:linear-gradient(145deg,rgba(213,154,92,.13),rgba(52,53,88,.80));
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card-completed {
    border-color:#D59A5C85;
    background:linear-gradient(145deg,rgba(213,154,92,.18),rgba(52,53,88,.70));
}
#apprentice-modal > .ssq-recipe-skin .apprentice-job-card.is-active {
    border-color:#F7CDA96B;
    background:linear-gradient(135deg,#D59A5C38,#343558C7);
}
#apprentice-modal > .ssq-recipe-skin .apprentice-job-card.is-blocked {
    border-color:#B48B9575;
    background:linear-gradient(135deg,#CC779033,#343558C7);
}
#settings-modal > .ssq-recipe-skin .settings-danger-card {
    border-color:rgba(231,150,142,.56);
}
#game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card.owned {
    border-color:rgba(247,205,169,.58);
}
#guild-modal > .ssq-recipe-skin .guild-reward-card[data-state="claimed"] {
    border-color:rgba(247,205,169,.58);
}

/* The Recipe Book's THREE-across card view; widen Skills instead of
   retaining its former tiny 4-across tiles in a narrow modal. */
#skills-modal > .ssq-recipe-skin .skills-content {
    padding:12px 14px 16px;
    gap:15px;
}
#skills-modal > .ssq-recipe-skin .skills-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}
#skills-modal > .ssq-recipe-skin .skills-card {min-height:94px;}
#skills-modal > .ssq-recipe-skin .skills-card-name {
    font-size:.74rem;
    white-space:normal;
    overflow-wrap:anywhere;
}
#skills-modal > .ssq-recipe-skin .skills-card-level {font-size:.59rem;}
#skills-modal > .ssq-recipe-skin .skills-card-xp {font-size:.57rem;}
#skills-modal > .ssq-recipe-skin .skills-group-title {
    margin:0 0 8px;
    font-size:.72rem;
    color:#F7CDA9;
}

/* Same category navigation strip as Recipe Book, with scrollable labels. */
#skills-modal > .ssq-recipe-skin :is(.skills-view-tabs,.mastery-skill-tabs),
#game-shop-modal > .ssq-recipe-skin .game-shop-tabs,
#quest-book-modal > .ssq-recipe-skin .recipe-book-sections {
    display:flex;
    gap:5px;
    min-width:0;
    padding:9px 12px;
    margin:0;
    overflow-x:auto;
    flex-wrap:nowrap;
    background:rgba(23,25,46,.28);
    border-bottom:1px solid #9E629529;
    scrollbar-width:thin;
}
#skills-modal > .ssq-recipe-skin :is(.skills-view-tab,.mastery-skill-tab),
#game-shop-modal > .ssq-recipe-skin .game-shop-tabs button,
#quest-book-modal > .ssq-recipe-skin .recipe-book-section-button {
    flex:0 0 auto;
    min-height:30px;
    padding:6px 9px;
    border:1px solid #9E62953D;
    border-radius:8px;
    background:#9E629514;
    color:#F6E7DD;
    font-size:.64rem;
    font-weight:700;
}
#skills-modal > .ssq-recipe-skin :is(.skills-view-tab.active,.mastery-skill-tab.active),
#game-shop-modal > .ssq-recipe-skin .game-shop-tabs button.selected,
#quest-book-modal > .ssq-recipe-skin .recipe-book-section-button.active {
    border-color:#E7968E;
    background:#B48B9524;
}
#skills-modal > .ssq-recipe-skin :is(.skills-view-tab,.mastery-skill-tab):hover:not(:disabled),
#game-shop-modal > .ssq-recipe-skin .game-shop-tabs button:hover:not(:disabled) {
    border-color:#F7CDA97A;background:#B48B9533;
}
#skills-modal > .ssq-recipe-skin .mastery-view {padding:12px 14px 16px;}
#skills-modal > .ssq-recipe-skin .mastery-milestone-card,
#skills-modal > .ssq-recipe-skin .mastery-list > * {
    border:1px solid var(--ssq-recipe-border);
    border-radius:9px;
    background:var(--ssq-recipe-tile);
}
#skills-modal > .ssq-recipe-skin .mastery-skill-tabs {margin-top:10px;}
#skills-modal > .ssq-recipe-skin .mastery-pool-drawer {
    background:rgba(36,38,63,.96);
}
/* Quest already used Recipe Book markup; harmonise its actual story cards. */
#quest-book-modal > .ssq-recipe-skin .quest-book-grid {
    gap:8px;
    padding:0 12px 14px;
}
#quest-book-modal > .ssq-recipe-skin .quest-book-requirements {
    padding:8px;
    border-color:#9E62952E;
    background:#24263F52;
}

/* Wide, evenly spaced Recipe Book card grids instead of tall single
   columns in the Apprentice, Settings and Lobby windows. */
#apprentice-modal > .ssq-recipe-skin .apprentice-content,
#settings-modal > .ssq-recipe-skin .settings-content,
#party-modal > .ssq-recipe-skin .party-content,
#guild-modal > .ssq-recipe-skin .party-content {
    gap:10px;
    padding:12px 14px 16px;
}
#apprentice-modal > .ssq-recipe-skin .apprentice-overview-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}
#apprentice-modal > .ssq-recipe-skin .apprentice-skill-list {gap:8px;}
#apprentice-modal > .ssq-recipe-skin .apprentice-skill-button {
    padding:10px;
    border:1px solid #9E62953D;
    border-radius:9px;
    background:var(--ssq-recipe-tile);
}
#apprentice-modal > .ssq-recipe-skin .apprentice-skill-button.selected {
    border-color:#E7968E;
    background:#B48B9524;
}
#settings-modal > .ssq-recipe-skin .settings-content {
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
}
#settings-modal > .ssq-recipe-skin :is(.settings-danger-card,.settings-dev-card) {
    grid-column:1/-1;
}
#settings-modal > .ssq-recipe-skin .settings-card h3,
#party-modal > .ssq-recipe-skin .party-card h3,
#guild-modal > .ssq-recipe-skin .guild-card h3 {
    font-size:.78rem;
    margin:2px 0 7px;
}
#party-modal > .ssq-recipe-skin .party-content,
#guild-modal > .ssq-recipe-skin .party-content {
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
}
#party-modal > .ssq-recipe-skin :is(#party-no-party,#party-active,
    #party-combat-panel),
#guild-modal > .ssq-recipe-skin :is(#guild-no-guild,#guild-active) {
    grid-column:1/-1;
    min-width:0;
}
/* The account Shop's product surface remains interactive and responsive. */
#game-shop-modal > .ssq-recipe-skin .game-shop-content {padding:12px 14px 16px;}
#game-shop-modal > .ssq-recipe-skin .game-shop-bag-grid,
#game-shop-modal > .ssq-recipe-skin .account-product-catalogue {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}
#game-shop-modal > .ssq-recipe-skin :is(.game-shop-bag-card,.game-shop-cosmetic-card)
:where(h3,strong) {color:#F6E7DD;}
/* Leaderboard already was the most visibly changed; preserve its layout
   and status hierarchy while retaining the shared illustrated header. */
#leaderboard-modal > .ssq-recipe-skin .leaderboard-toolbar {
    border-bottom:1px solid #9E629529;
    padding:10px;
    border-radius:10px;
    background:rgba(23,25,46,.27);
}
#leaderboard-modal > .ssq-recipe-skin .leaderboard-header {border-radius:12px;}

/* Recipe Book's dark inset controls, scoped so danger buttons and
   every form's existing validation/loading states remain untouched. */
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin :is(input:not([type="checkbox"]):not([type="radio"]),
    select,textarea) {
    min-width:0;
    border:1px solid #9E629547;
    border-radius:8px;
    background:#343558E6;
    color:#F6E7DD;
}
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin :is(input,select,textarea,button):focus-visible {
    outline:2px solid #F7CDA9;
    outline-offset:2px;
}

/* Additional selectable *neutral* middle cards are ordinary recipe-like
   tiles, but use their original role-specific selected/disabled states. */
#skills-modal > .ssq-recipe-skin :is(.mastery-entry,.collection-item):not(.locked):not(.active),
#apprentice-modal > .ssq-recipe-skin .apprentice-skill-button:not(.selected):not(.coming-soon),
#guild-modal > .ssq-recipe-skin :is(.guild-invite-inbox,.guild-progress-reward),
#party-modal > .ssq-recipe-skin .party-member-card:not(.selected) {
    border-color:var(--ssq-recipe-border);
    background:var(--ssq-recipe-tile);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
}

/* Recipe Book responsiveness: two-across medium; single column on phones.
   Existing named components retain their own scroll/active-state logic. */
@media(max-width:900px){
    #skills-modal > .ssq-recipe-skin .skills-grid,
    #game-shop-modal > .ssq-recipe-skin :is(.game-shop-bag-grid,.account-product-catalogue) {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    #settings-modal > .ssq-recipe-skin .settings-content,
    #party-modal > .ssq-recipe-skin .party-content,
    #guild-modal > .ssq-recipe-skin .party-content {
        grid-template-columns:1fr;
    }
}
@media(max-width:700px) {
    :is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
        #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
    > .ssq-recipe-skin {
        width:100%;
        max-height:calc(100dvh - 16px);
        background:
            linear-gradient(180deg,rgba(23,25,46,.76),rgba(36,38,63,.70)),
            url("../assets/images/login-screen-mobile.png") center top / cover no-repeat;
    }
    :is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
        #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
    > .ssq-recipe-skin
    > :is(.skills-header,.recipe-book-header,.apprentice-header,.settings-header,
        .game-shop-header,.party-header,.leaderboard-header) {
        min-height:70px;
        padding:12px;
    }
    #skills-modal > .ssq-recipe-skin .skills-grid,
    #game-shop-modal > .ssq-recipe-skin :is(.game-shop-bag-grid,.account-product-catalogue),
    #settings-modal > .ssq-recipe-skin .settings-content {
        grid-template-columns:1fr;
    }
    #apprentice-modal > .ssq-recipe-skin .apprentice-overview-grid {
        grid-template-columns:1fr;
    }
    #quest-book-modal > .ssq-recipe-skin .quest-book-grid {
        grid-template-columns:1fr;
    }
}
@media(prefers-reduced-transparency:reduce){
    :is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
        #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
    > .ssq-recipe-skin {
        background:#24263F;
    }
}


/* =============================================================
   23 OCT — GARDENING SOFT GLASS AND CLEAN TEXT HIERARCHY (V6)
   Previous book-style parity kept a solid scenic illustration inside each
   modal, so even a 12%-opacity tile showed mostly dark purple underneath.
   Use one airy frosted pane and gently rounded grouped cards; never
   stack tinted filters and individual text-row backgrounds.
   Reuse live Gardening detail's --ssq-map-glass-* variables from style.css.
   The actual Recipe Book now shares this look with its eight sister menus.
   Structure, content, inputs, queue, state colours and scroll remain intact.
   ============================================================= */

/* So the world underneath actually shows through, instead of being hidden
   by the old almost-opaque purple modal veil (#343558C7). */
:is(#recipe-book-modal,#skills-modal,#quest-book-modal,#apprentice-modal,
    #settings-modal,#game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> :is(.recipe-book-backdrop,.skills-backdrop,.apprentice-backdrop,
      .settings-backdrop,.game-shop-backdrop,.party-backdrop,
      .leaderboard-backdrop) {
    background:rgba(20,16,32,.20);
    backdrop-filter:blur(1px);
    -webkit-backdrop-filter:blur(1px);
}

/* Same warm frosted material as selected herb/growing plots, against the
   actual game world rather than login-screen.png. */
:is(#recipe-book-modal > .recipe-book-window,
    #skills-modal > .ssq-recipe-skin,
    #quest-book-modal > .ssq-recipe-skin,
    #apprentice-modal > .ssq-recipe-skin,
    #settings-modal > .ssq-recipe-skin,
    #game-shop-modal > .ssq-recipe-skin,
    #party-modal > .ssq-recipe-skin,
    #guild-modal > .ssq-recipe-skin,
    #leaderboard-modal > .ssq-recipe-skin) {
    --ssq-recipe-tile:var(--ssq-map-glass-subfill);
    --ssq-recipe-border:rgba(247,205,169,.20);
    color:#F6E7DD;
    border:1px solid rgba(247,205,169,.29);
    background:var(--ssq-map-glass-fill);
    box-shadow:var(--ssq-map-glass-shadow);
    backdrop-filter:blur(11px) saturate(110%);
    -webkit-backdrop-filter:blur(11px) saturate(110%);
}

/* Keep the title/header layer as quiet as the Gardening selected-herb
   heading; do not paint the bright scenic image across every header. */
:is(#recipe-book-modal > .recipe-book-window .recipe-book-header,
    #skills-modal > .ssq-recipe-skin .skills-header,
    #quest-book-modal > .ssq-recipe-skin .recipe-book-header,
    #apprentice-modal > .ssq-recipe-skin .apprentice-header,
    #settings-modal > .ssq-recipe-skin .settings-header,
    #game-shop-modal > .ssq-recipe-skin .game-shop-header,
    #party-modal > .ssq-recipe-skin .party-header,
    #guild-modal > .ssq-recipe-skin .party-header,
    #leaderboard-modal > .ssq-recipe-skin .leaderboard-header) {
    background:linear-gradient(90deg,rgba(246,231,221,.050),rgba(247,205,169,.025));
    border-bottom-color:rgba(247,205,169,.17);
    box-shadow:none;
}

/* No more flat dark-purple squares: the glowing scene colours can now
   diffuse through the inner cards exactly as on the Gardening window. */
:is(#recipe-book-modal > .recipe-book-window .recipe-book-card,
    #skills-modal > .ssq-recipe-skin .skills-card,
    #skills-modal > .ssq-recipe-skin .mastery-road-section,
    #skills-modal > .ssq-recipe-skin .mastery-summary,
    #skills-modal > .ssq-recipe-skin .mastery-milestone-card,
    #apprentice-modal > .ssq-recipe-skin .apprentice-access-card,
    #apprentice-modal > .ssq-recipe-skin .apprentice-skills-card,
    #apprentice-modal > .ssq-recipe-skin .apprentice-skill-card,
    #settings-modal > .ssq-recipe-skin .settings-card,
    #game-shop-modal > .ssq-recipe-skin .game-shop-bag-card,
    #game-shop-modal > .ssq-recipe-skin .game-shop-bag-section,
    #game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card,
    #party-modal > .ssq-recipe-skin .party-card,
    #guild-modal > .ssq-recipe-skin .guild-card,
    #leaderboard-modal > .ssq-recipe-skin .leaderboard-podium-card,
    #leaderboard-modal > .ssq-recipe-skin .leaderboard-row)
:not(.locked):not(.selected):not(.is-active):not(.is-blocked)
:not(.completed):not(.owned):not(.recipe-book-card-unlocked) {
    background:var(--ssq-map-glass-subfill);
    border-color:rgba(247,205,169,.17);
    border-radius:12px;
    box-shadow:inset 0 1px rgba(255,246,231,.04);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
/* Make unlocked recipes themselves harmonise with the lighter glow while
   retaining their golden "unlocked" border distinction. */
#recipe-book-modal > .recipe-book-window .recipe-book-card-unlocked {
    border-color:rgba(247,205,169,.28);
    background:rgba(246,231,221,.075);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}

/* Quest statuses (locked/active/completed) and Apprentice activity cards
   deliberately retain their semantic state tints rather than all looking
   neutral. Ordinary quest entries still receive airy glass. */
#quest-book-modal > .ssq-recipe-skin
.quest-book-card:not(.quest-book-card-locked):not(.quest-book-card-active)
:not(.quest-book-card-completed) {
    background:var(--ssq-map-glass-subfill);
    border-color:rgba(247,205,169,.18);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card-locked {
    background:rgba(45,37,61,.27);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card-active {
    background:linear-gradient(145deg,rgba(247,205,169,.15),rgba(96,65,88,.17));
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card-completed {
    background:linear-gradient(145deg,rgba(213,154,92,.17),rgba(96,65,88,.12));
}
/* Preserve warning/danger visual weight while allowing warm transparency. */
#settings-modal > .ssq-recipe-skin .settings-danger-card {
    background:rgba(71,37,49,.40);
    border-color:rgba(231,150,142,.63);
}
#apprentice-modal > .ssq-recipe-skin .apprentice-job-card:not(.is-active):not(.is-blocked) {
    background:var(--ssq-map-glass-subfill);
    border-color:rgba(247,205,169,.18);
}

/* Recipe text behaves like Gardening's labels: clean text on ONE soft
   rounded card, not dozens of hard highlighted rectangles. In particular,
   do not nest backdrop filters on per-row metadata; Chromium can display
   those layers as rectangular paint strips over multi-layered glass. */
#recipe-book-modal > .recipe-book-window .recipe-book-card-top {
    gap:5px;
    padding:4px 2px 6px;
    border:0;
    border-bottom:1px solid rgba(246,231,221,.10);
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
#recipe-book-modal > .recipe-book-window
:is(.recipe-book-card-name,.recipe-book-card-name-row,
    .recipe-book-meta-row,.recipe-book-meta-label,.recipe-book-meta-value,
    .recipe-book-card-hint,.quest-book-meta-row,.quest-book-meta-label,
    .quest-book-meta-value) {
    background:transparent;
    background-image:none;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
#recipe-book-modal > .recipe-book-window .recipe-book-meta-row {
    margin-top:7px;
    gap:8px;
    align-items:start;
}
#recipe-book-modal > .recipe-book-window .recipe-book-meta-label {
    opacity:.68;
    line-height:1.45;
}
#recipe-book-modal > .recipe-book-window .recipe-book-meta-value {
    line-height:1.45;
    color:rgba(246,231,221,.94);
}
#recipe-book-modal > .recipe-book-window .recipe-book-card-status {
    width:max-content;
    border-radius:999px;
    padding:3px 7px;
    background:rgba(246,231,221,.075);
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
/* Shared soft row treatment in companion menus: form fields remain inset
   controls, but paragraphs, headings and inline labels do not acquire
   background panels from the theme. */
:is(#skills-modal,#quest-book-modal,#apprentice-modal,#settings-modal,
    #game-shop-modal,#party-modal,#guild-modal,#leaderboard-modal)
> .ssq-recipe-skin :is(.panel-label,.skills-card-heading,.skills-card-xp-row,
    .quest-book-meta-row,.quest-book-meta-label,.quest-book-meta-value,
    .party-card p,.settings-card p,.guild-card p,
    .apprentice-job-card p,.apprentice-job-heading) {
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}

/* A reduced-transparency accessibility choice should stay readable. */
@media(prefers-reduced-transparency:reduce) {
    :is(#recipe-book-modal > .recipe-book-window,
        #skills-modal > .ssq-recipe-skin,
        #quest-book-modal > .ssq-recipe-skin,
        #apprentice-modal > .ssq-recipe-skin,
        #settings-modal > .ssq-recipe-skin,
        #game-shop-modal > .ssq-recipe-skin,
        #party-modal > .ssq-recipe-skin,
        #guild-modal > .ssq-recipe-skin,
        #leaderboard-modal > .ssq-recipe-skin) {
        background:rgba(40,32,54,.98);
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
    }
}


/* ===============================================================
   23 OCT — BOOK ILLUSTRATED CARDS V7
   Actual inventory artwork on the LEFT, real recipe/quest text on the
   RIGHT, one grouped (not row-by-row) soft translucent detail panel.
   The original scenic top-scene-banner returns to the HEADER ONLY.
   No change to save systems, recipe discovery, costs or click handling.
   =============================================================== */

/* Restore Salem's existing decorative illustration ONLY in the top strip. */
:is(
    #recipe-book-modal > .recipe-book-window .recipe-book-header,
    #skills-modal > .ssq-recipe-skin .skills-header,
    #quest-book-modal > .ssq-recipe-skin .recipe-book-header,
    #apprentice-modal > .ssq-recipe-skin .apprentice-header,
    #settings-modal > .ssq-recipe-skin .settings-header,
    #game-shop-modal > .ssq-recipe-skin .game-shop-header,
    #party-modal > .ssq-recipe-skin .party-header,
    #guild-modal > .ssq-recipe-skin .party-header,
    #leaderboard-modal > .ssq-recipe-skin .leaderboard-header
) {
    background:
        linear-gradient(90deg,rgba(27,24,48,.72),rgba(52,43,70,.44) 48%,rgba(27,24,48,.69)),
        url("../assets/images/ui/top-scene-banner.png") center 46% / cover no-repeat;
    border-top:1px solid rgba(247,205,169,.28);
    border-bottom:1px solid rgba(247,205,169,.28);
    border-radius:18px 18px 0 0;
    box-shadow:inset 0 1px rgba(246,231,221,.14),0 5px 13px rgba(15,10,30,.12);
}
/* Keep the content itself as approved soft Gardening glass, never a scenic
   wallpaper behind the full modal. */

/* Recipe card layout mirrors the reference concept but uses real registered
   item art, never generated artwork or hidden recipes' icons. */
#recipe-book-modal > .recipe-book-window .recipe-book-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
    padding:11px 13px 16px;
}
#recipe-book-modal > .recipe-book-window .recipe-book-card.ssq-book-art-card,
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card {
    display:grid;
    grid-template-columns:clamp(80px,24%,136px) minmax(0,1fr);
    align-items:start;
    column-gap:13px;
    row-gap:0;
    padding:13px;
    min-width:0;
    border-radius:15px;
    background:rgba(246,231,221,.075);
    border:1px solid rgba(247,205,169,.27);
    box-shadow:inset 0 1px rgba(255,246,231,.10);
    /* The outer window already frosts the map. Nested card blur creates
       rectangular compositor surfaces around text in Chromium. */
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin)
:is(.ssq-book-artwork,.ssq-book-art-content) {
    min-width:0;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-artwork {
    position:relative;
    display:grid;
    place-items:center;
    width:100%;
    aspect-ratio:1 / 1;
    overflow:hidden;
    box-sizing:border-box;
    /* V10: restore the soft rounded artwork holder approved in V7.
       Transparency must be handled on the child image, not the holder. */
    padding:11px;
    border:1px solid rgba(247,205,169,.19);
    border-radius:12px;
    background:linear-gradient(150deg,rgba(246,231,221,.07),rgba(81,55,83,.05));
    box-shadow:inset 0 1px rgba(255,246,231,.06);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-artwork-image {
    width:100%;height:100%;
    max-height:130px;
    object-fit:contain;
    filter:drop-shadow(0 5px 8px rgba(15,10,30,.27));
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-artwork-image[hidden],
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-artwork-fallback[hidden] {
    display:none!important;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-artwork-fallback {
    font-size:clamp(2rem,3.2vw,3.3rem);
    line-height:1.1;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-art-content {
    display:grid;
    gap:9px;
    align-content:start;
}
#recipe-book-modal > .recipe-book-window .ssq-book-art-content .recipe-book-card-top {
    padding:0;
    margin:0;
    gap:6px;
    border:0;
    background:none;
}
#recipe-book-modal > .recipe-book-window .recipe-book-card-name {
    font-size:clamp(.75rem,1.2vw,.92rem);
    line-height:1.25;
    background:none;
}
#recipe-book-modal > .recipe-book-window .recipe-book-card-status {
    border:1px solid rgba(247,205,169,.25);
    border-radius:999px;
    font-size:.59rem;
    margin:0;
}
/* This is ONE single box for Station/Level/Ingredients/Makes. */
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin) .ssq-book-detail-group {
    display:grid;
    align-content:start;
    gap:0;
    min-width:0;
    padding:8px 11px;
    border:1px solid rgba(247,205,169,.25);
    border-radius:12px;
    background:rgba(246,231,221,.06);
    box-shadow:inset 0 1px rgba(255,246,231,.055);
}
#recipe-book-modal > .recipe-book-window
.ssq-book-detail-group .recipe-book-meta-row,
#quest-book-modal > .ssq-recipe-skin
.ssq-book-detail-group .quest-book-meta-row {
    display:grid;
    grid-template-columns:minmax(65px,30%) minmax(0,1fr);
    gap:9px;
    min-width:0;
    margin:0;
    padding:7px 0;
    align-items:start;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
#recipe-book-modal > .recipe-book-window
.ssq-book-detail-group .recipe-book-meta-row + .recipe-book-meta-row,
#quest-book-modal > .ssq-recipe-skin
.ssq-book-detail-group .quest-book-meta-row + .quest-book-meta-row {
    border-top:1px solid rgba(246,231,221,.09);
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin)
.ssq-book-detail-group :is(.recipe-book-meta-label,.recipe-book-meta-value,
    .quest-book-meta-label,.quest-book-meta-value) {
    display:block;
    min-width:0;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:none;
    box-shadow:none;
    color:#F6E7DD;
    line-height:1.45;
    overflow-wrap:anywhere;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin)
.ssq-book-detail-group :is(.recipe-book-meta-label,.quest-book-meta-label) {
    opacity:.72;
    font-size:.62rem;
    font-weight:700;
}
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin)
.ssq-book-detail-group :is(.recipe-book-meta-value,.quest-book-meta-value) {
    opacity:.97;
    font-size:.64rem;
    font-weight:600;
}

/* Quest cards follow the same left-art/right-story layout. A locked quest
   keeps its anonymous illustration and ???; never reveal an objective. */
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card {
    grid-template-columns:clamp(67px,20%,108px) minmax(0,1fr);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card .quest-book-card-heading {
    padding:0;
    gap:8px;
    border:0;
    background:transparent;
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card .quest-book-body {
    padding:10px 12px;
    margin:0;
    border:1px solid rgba(247,205,169,.23);
    border-radius:12px;
    background:rgba(246,231,221,.055);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card
.quest-book-overview {
    border:0;
    border-radius:0;
    padding:0;
    background:none;
    box-shadow:none;
}
#quest-book-modal > .ssq-recipe-skin .quest-book-title {
    font-size:clamp(.74rem,1.1vw,.91rem);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card
.quest-book-requirements {
    border-radius:11px;
    /* Requirements live inside the single Quest body glass group; a second
       translucent panel around its words is visually redundant. */
    background:transparent;
    border-color:rgba(247,205,169,.12);
}
#quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card
.quest-book-subheading {
    padding:0;
    background:none;
}

/* Plain copy must not acquire a separate painted rectangular surface.
   Explicitly flatten older decorative backgrounds, including their
   WebKit compositing layer, while retaining the ONE rounded group around
   the details and the meaningful completion/status badges. */
:is(#recipe-book-modal > .recipe-book-window,
    #quest-book-modal > .ssq-recipe-skin)
:is(.recipe-book-card-name,.recipe-book-meta-row,.recipe-book-meta-label,
    .recipe-book-meta-value,.quest-book-card-identity,.quest-book-meta-row,
    .quest-book-meta-label,.quest-book-meta-value,.quest-book-subheading,
    .quest-book-story,.quest-book-stage-list,.quest-book-stage,
    .quest-book-stage-title,.quest-book-stage-objectives,
    .quest-book-stage-objectives li,.quest-book-requirement-list,
    .quest-book-requirement) {
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}
#skills-modal > .ssq-recipe-skin .mastery-milestone-card > :is(strong,span) {
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}
/* Actual labels and story copy are not interactive controls. */
:is(#guild-modal,#party-modal,#apprentice-modal,#settings-modal)
> .ssq-recipe-skin
:is(.guild-card,.party-card,.apprentice-job-card,.settings-card)
:is(h2,h3,h4,p,label) {
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
}
/* Frost at the window, not again behind every line or card.
   Keep buttons, form inputs, status chips and progress bars untouched. */
:is(#skills-modal,#guild-modal,#party-modal,#apprentice-modal,#settings-modal)
> .ssq-recipe-skin
:is(.skills-card,.mastery-milestone-card,.guild-card,.party-card,
    .apprentice-job-card,.settings-card) {
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}

/* The same illustrated-card composition in Skills/Mastery. The existing
   skill emoji becomes the illustration; all its live XP calculations remain
   in the existing rendered skill card on the right. */
#skills-modal > .ssq-recipe-skin .skills-card {
    position:relative;
    min-height:112px;
    padding:15px 13px 13px 91px;
    border-radius:15px;
}
#skills-modal > .ssq-recipe-skin .skills-card::before {
    content:"";
    position:absolute;
    left:11px;
    top:12px;
    width:65px;
    height:calc(100% - 24px);
    border-radius:12px;
    border:1px solid rgba(247,205,169,.20);
    background:rgba(246,231,221,.07);
    pointer-events:none;
}
#skills-modal > .ssq-recipe-skin .skills-card-icon {
    position:absolute;
    left:27px;
    top:50%;
    transform:translateY(-50%);
    display:grid;
    place-items:center;
    width:35px;
    height:42px;
    font-size:1.75rem;
    z-index:1;
    pointer-events:none;
}
#skills-modal > .ssq-recipe-skin .skills-card-name {
    font-size:.78rem;
}
#skills-modal > .ssq-recipe-skin .skills-card-xp-row {
    padding:4px 0;
}

/* Other requested core tabs get the same real content on the right and a
   light illustrated category glyph on the left WHERE no artwork exists.
   This is decoration only and never replaces controls or player images. */
:is(
    #apprentice-modal .apprentice-job-card,
    #apprentice-modal .apprentice-access-card,
    #settings-modal .settings-card,
    #party-modal .party-card,
    #guild-modal .guild-card,
    #leaderboard-modal .leaderboard-podium-card
):not(:has(img)):not(:has(.inventory-icon)) {
    position:relative;
    padding-left:83px!important; /* beats earlier shorthand padding:10px */
    min-height:103px;
    border-radius:15px;
}
:is(
    #apprentice-modal .apprentice-job-card,
    #apprentice-modal .apprentice-access-card,
    #settings-modal .settings-card,
    #party-modal .party-card,
    #guild-modal .guild-card,
    #leaderboard-modal .leaderboard-podium-card
):not(:has(img)):not(:has(.inventory-icon))::before {
    content:"✨";
    position:absolute;
    left:10px;
    top:10px;
    display:grid;
    place-items:center;
    width:61px;
    height:61px;
    border:1px solid rgba(247,205,169,.19);
    border-radius:11px;
    background:rgba(246,231,221,.055);
    font-size:1.6rem;
    pointer-events:none;
}
#apprentice-modal .apprentice-job-card:not(:has(img))::before {content:"🧙";}
#apprentice-modal .apprentice-access-card:not(:has(img))::before {content:"⏳";}
#settings-modal .settings-card:not(:has(img))::before {content:"⚙️";}
#party-modal .party-card:not(:has(img))::before {content:"🤝";}
#guild-modal .guild-card:not(:has(img))::before {content:"🏰";}
#leaderboard-modal .leaderboard-podium-card:not(:has(img))::before {content:"🏆";}

/* Icons stay in a genuinely reserved column on narrow dialog cards;
   forms must never sit underneath their absolutely positioned illustration. */
@media(max-width:700px) {
    :is(#apprentice-modal .apprentice-job-card,
        #apprentice-modal .apprentice-access-card,
        #settings-modal .settings-card,
        #party-modal .party-card,
        #guild-modal .guild-card):not(:has(img)):not(:has(.inventory-icon)) {
        padding-left:72px!important;
    }
    #leaderboard-modal .leaderboard-podium-card:not(:has(img)) {
        padding-left:10px!important;
    }
}

/* Narrow screens: keep the art on the left without squeezing text, then
   stack elegantly on phones. All existing close, filters and scroll stay. */
@media(max-width:960px) {
    #recipe-book-modal > .recipe-book-window .recipe-book-grid {
        grid-template-columns:minmax(0,1fr);
    }
}
@media(max-width:700px) {
    #recipe-book-modal > .recipe-book-window .recipe-book-card.ssq-book-art-card,
    #quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card {
        grid-template-columns:72px minmax(0,1fr);
        padding:9px;
        gap:9px;
    }
    #quest-book-modal > .ssq-recipe-skin .quest-book-grid {
        grid-template-columns:minmax(0,1fr);
    }
    #skills-modal > .ssq-recipe-skin .skills-card {
        padding-left:79px;
    }
    #skills-modal > .ssq-recipe-skin .skills-card::before {
        left:8px;width:59px;
    }
    #skills-modal > .ssq-recipe-skin .skills-card-icon {
        left:20px;
    }
}
@media(max-width:420px) {
    #recipe-book-modal > .recipe-book-window .recipe-book-card.ssq-book-art-card,
    #quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card {
        grid-template-columns:63px minmax(0,1fr);
    }
    #recipe-book-modal > .recipe-book-window .ssq-book-detail-group {
        padding:7px;
    }
    #recipe-book-modal > .recipe-book-window
    .ssq-book-detail-group .recipe-book-meta-row {
        grid-template-columns:minmax(0,1fr);
        gap:1px;
    }
}


/* Preserve and enlarge the SHOP's already-authored frame/banner/title
   previews, on the left; products and purchase controls stay on the right. */
#game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card {
    display:grid;
    grid-template-columns:minmax(76px,32%) minmax(0,1fr);
    align-items:start;
    gap:12px;
    padding:12px;
    border-radius:15px;
}
#game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card
:is(.game-shop-title-preview,.game-shop-name-preview,
    .game-shop-frame-preview,.game-shop-banner-preview) {
    min-height:105px;
    min-width:0;
    width:100%;
    display:grid;
    place-content:center;
    overflow:hidden;
    border:1px solid rgba(247,205,169,.20);
    border-radius:12px;
    background:rgba(246,231,221,.06);
}
#game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card
:is(.game-shop-frame-preview,.game-shop-banner-preview) img {
    width:100%;
    max-height:115px;
    object-fit:contain;
}
#game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card-body {
    min-width:0;
}
/* Purchasable upgrades have no individual item artwork; use a neutral
   sparkling product illustration instead of inventing an asset. */
#game-shop-modal > .ssq-recipe-skin .account-product-card:not(:has(img)) {
    position:relative;
    padding:12px 12px 12px 83px;
    min-height:108px;
    border-radius:15px;
}
#game-shop-modal > .ssq-recipe-skin .account-product-card:not(:has(img))::before {
    content:"✨";
    display:grid;
    place-items:center;
    position:absolute;
    left:10px;top:10px;
    width:61px;height:61px;
    border-radius:12px;
    border:1px solid rgba(247,205,169,.20);
    background:rgba(246,231,221,.055);
    pointer-events:none;
    font-size:1.6rem;
}
/* Compact leader podiums on mobile must never lose their player names just
   to make room for a decorative icon. */
@media(max-width:700px) {
    #leaderboard-modal .leaderboard-podium-card:not(:has(img)) {
        padding-left:10px;
        min-height:0;
    }
    #leaderboard-modal .leaderboard-podium-card:not(:has(img))::before {
        display:none;
    }
    #game-shop-modal > .ssq-recipe-skin .game-shop-cosmetic-card {
        grid-template-columns:80px minmax(0,1fr);
        gap:9px;
    }
}


/* ===============================================================
   23 OCT — UNFRAMED QUEST ART + CLEAN SHOP UPGRADES (V9)
   Transparent item PNGs directly on glass, unboxed quest IDs/titles,
   permanent upgrade cards visually matching Community Boost cards.
   =============================================================== */

/* Status badges remain chips; plain quest ID/title areas cannot be plates. */
#quest-book-modal > .ssq-recipe-skin
.quest-book-card.ssq-book-art-card :is(
    .quest-book-card-heading,.quest-book-card-identity,
    .quest-book-id,.quest-book-title) {
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}
#quest-book-modal > .ssq-recipe-skin
.quest-book-card.ssq-book-art-card .quest-book-card-heading {padding:0;}

/* Bag expansions and Auto-Eat upgrades use Community Boost's simple
   text-first visual hierarchy, without changing live purchase UI state. */
#game-shop-modal > .ssq-recipe-skin .game-shop-bag-section .game-shop-bag-card {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-content:start;
    gap:9px;
    min-width:0;
    min-height:0;
    padding:11px;
    border:1px solid #9E629538;
    border-radius:10px;
    background:#3435584C;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
#game-shop-modal > .ssq-recipe-skin .game-shop-bag-section
.game-shop-bag-card.owned {
    border-color:rgba(247,205,169,.34);
    background:rgba(213,154,92,.12);
}
#game-shop-modal > .ssq-recipe-skin .game-shop-bag-section
.game-shop-bag-card::before {
    content:none!important;
    display:none!important;
}
/* Remove inherited underlays only from COPY, never from purchase buttons
   or status controls (which must retain their distinct affordances). */
#game-shop-modal > .ssq-recipe-skin .game-shop-bag-section
.game-shop-bag-card :is(
    .game-shop-bag-card-heading,.game-shop-bag-card-heading > div,
    .game-shop-bag-card-heading strong,.game-shop-bag-card-heading small,
    .game-shop-bag-price,.game-shop-bag-capacity-copy,p) {
    background:transparent!important;
    background-image:none!important;
    border:0;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}
/* Bag symbols still communicate four slots, without four extra buttons. */
#game-shop-modal > .ssq-recipe-skin #game-shop-bag-expansions
.game-shop-slot-preview span {
    background:transparent;
    border:0;
    box-shadow:none;
}
#game-shop-modal > .ssq-recipe-skin .game-shop-bag-section
.game-shop-bag-card .game-shop-bag-buy {
    width:100%;
    margin-top:auto;
}
/* Auto-Eat's real PNG belongs on the header, without text underlays. */
#game-shop-modal > .ssq-recipe-skin #shop-auto-eat-upgrades
.game-shop-bag-heading :is(strong,p) {
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
}
#game-shop-modal > .ssq-recipe-skin #shop-auto-eat-upgrades
.game-shop-bag-heading img {
    flex:0 0 64px;
    object-fit:contain;
    background:transparent;
    border:0;
    box-shadow:none;
}
@media(max-width:700px) {
    #game-shop-modal > .ssq-recipe-skin .game-shop-bag-section
    .game-shop-bag-card {padding:11px!important;}
}


/* ==============================================================
   23 OCT — ARTWORK HOLDER VS IMAGE SURFACE CORRECTION (V10)
   The V9 change removed the nice soft rounded OUTER holder by mistake.
   Keep that frame and remove only the extra background on the <img>.
   No quest discovery/reward, shop purchase or image-source changes.
   ============================================================== */

/* Transparent images render on the glass inside the rounded holder.
   Important: src still loads the original PNG; no replacement art. */
:is(
    #recipe-book-modal > .recipe-book-window .recipe-book-card.ssq-book-art-card,
    #quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card
) .ssq-book-artwork > .ssq-book-artwork-image {
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    background-color:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    object-fit:contain;
    max-width:100%;
    max-height:130px;
    filter:drop-shadow(0 5px 8px rgba(15,10,30,.24));
}

/* Keep unknown quest/restricted recipe fallback emojis in the same frame;
   they must never expose hidden item artwork. */
:is(
    #recipe-book-modal > .recipe-book-window .recipe-book-card.ssq-book-art-card,
    #quest-book-modal > .ssq-recipe-skin .quest-book-card.ssq-book-art-card
) .ssq-book-artwork > .ssq-book-artwork-fallback {
    border:0;
    background:transparent;
    box-shadow:none;
}