/* Shared collectible finish: four rarity levels reuse one illustration. */
.sgwc-card{--sgwc-ink:#234e43;--sgwc-rim:#d0d5c4;--sgwc-edge:#a6af99;--sgwc-tint:#e5ebdc;--sgwc-badge:#e7ebdd;--sgwc-badge-ink:#5b6a51;position:relative;isolation:isolate;display:block;box-sizing:border-box;width:100%;max-width:360px;padding:7px;border:1px solid #ffffe7;border-radius:24px;background:linear-gradient(135deg,#f9f8ec,var(--sgwc-rim) 50%,#e6e8d8);color:var(--sgwc-ink);box-shadow:inset 0 2px #fff9,0 5px 0 var(--sgwc-edge),0 12px 22px #153d4e29;font-family:'Baloo 2','Fredoka','Zen Kaku Gothic New',system-ui,sans-serif;text-align:left;overflow:visible}
.sgwc-card *{box-sizing:border-box}.sgwc-card[data-rarity=rare]{--sgwc-rim:#93cfc0;--sgwc-edge:#4e948d;--sgwc-tint:#d7eee1;--sgwc-badge:#dcf2e5;--sgwc-badge-ink:#286757;background:linear-gradient(135deg,#cdecdc,#83c8bf 35%,#cff0e5 65%,#9ed5cb)}
.sgwc-card[data-rarity=super-rare]{--sgwc-rim:#cab6e7;--sgwc-edge:#8573ad;--sgwc-tint:#f0e5f4;--sgwc-badge:#ebddf7;--sgwc-badge-ink:#684588;background:linear-gradient(125deg,#f6dced 0%,#aecfef 20%,#c2f0dd 36%,#cab7e8 58%,#9cd7d8 76%,#ebd7f0)}
.sgwc-card[data-rarity=master]{--sgwc-rim:#e0a82e;--sgwc-edge:#b57c20;--sgwc-tint:#fff0c8;--sgwc-badge:#fff2c6;--sgwc-badge-ink:#795316;background:linear-gradient(130deg,#fff3c1 0%,#e0a82e 20%,#fff7d4 38%,#e7b848 57%,#ffe5a2 75%,#d89d29 100%);box-shadow:inset 0 2px #fff9,0 5px 0 var(--sgwc-edge),0 0 20px #e0a82e2b,0 12px 22px #153d4e29}
.sgwc-inside{overflow:hidden;border:1px solid #fffbea;border-radius:17px;background:#fff9e9}.sgwc-top{display:flex;justify-content:space-between;gap:6px;padding:8px 11px;color:#456559;background:linear-gradient(110deg,#fff8e9,var(--sgwc-tint));font:800 9px/1.3 system-ui,sans-serif;letter-spacing:.1em}.sgwc-art{position:relative;width:100%;aspect-ratio:1.22;overflow:hidden;background:var(--sgwc-tint)}.sgwc-art>img{display:block;width:100%;height:100%;object-fit:cover}.sgwc-card[data-rarity=common] .sgwc-art>img{filter:saturate(.83)}.sgwc-rarity{position:absolute;left:9px;top:9px;max-width:calc(100% - 18px);border:1px solid #fff8ffb9;border-radius:9px;background:var(--sgwc-badge);color:var(--sgwc-badge-ink);font:800 10px/1.3 system-ui,sans-serif;padding:5px 7px;box-shadow:0 2px #33445420;white-space:normal}
.sgwc-copy{padding:12px 14px 13px;background:linear-gradient(130deg,#fffdf3,#f6efd9)}.sgwc-name{font:800 clamp(21px,6vw,33px)/1.12 'Baloo 2','Fredoka',system-ui,sans-serif!important;color:var(--sgwc-ink)!important;margin:0!important;letter-spacing:.005em!important;overflow-wrap:anywhere;text-transform:uppercase}.sgwc-jp{font:600 15px/1.5 'Zen Kaku Gothic New',system-ui,sans-serif;color:#526e60;margin:5px 0 0;overflow-wrap:anywhere}.sgwc-part{font:400 11px/1.5 system-ui,sans-serif;color:#6c7d70;margin:4px 0 0}.sgwc-label{font:800 8px/1.5 system-ui,sans-serif;letter-spacing:.09em;color:#7b8a79;display:block;margin-bottom:3px}.sgwc-meaning{margin-top:13px}.sgwc-meaning p{font:700 14px/1.45 'Atkinson Hyperlegible','Zen Kaku Gothic New',system-ui,sans-serif;margin:0;color:#234e43}.sgwc-meaning-ja{margin-top:8px}.sgwc-meaning-ja p{font-size:12px;font-weight:500;color:#4d6859}.sgwc-example{border-top:1px solid #dce0c8;margin-top:12px;padding-top:9px}.sgwc-example p{font:400 11px/1.5 'Atkinson Hyperlegible',system-ui,sans-serif;margin:0;color:#61756b}.sgwc-example .sgwc-example-ja{font:400 10px/1.5 'Zen Kaku Gothic New',system-ui,sans-serif;margin-top:5px;color:#788679}.sgwc-bottom{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:8px 11px;border-top:1px solid #dce0c8;background:var(--sgwc-tint);color:#547361;font:700 8px/1.4 system-ui,sans-serif;letter-spacing:.04em}.sgwc-stars{white-space:nowrap;color:var(--sgwc-badge-ink)}
.sgwc-master-seal{position:absolute;right:-7px;top:26px;width:34px;height:34px;display:grid;place-items:center;border:2px solid #fff2bd;border-radius:50%;background:linear-gradient(#ffdd7b,#e0a82e);color:#755116;font:800 18px/1 'Fredoka',system-ui;box-shadow:0 3px 0 #a97b26,0 2px 7px #8f731f33;transform:rotate(10deg)}
.sgwc-resident{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 12px 9px;background:radial-gradient(ellipse,#fffae8,transparent 70%)}.sgwc-resident img{display:block;max-width:90%;height:80%;object-fit:contain}.sgwc-resident-word{font-size:11px;color:#50735e;text-align:center;overflow-wrap:anywhere;max-width:100%}
.sgwc-compact{padding:5px;border-radius:17px;max-width:none;box-shadow:inset 0 1px #fffb,0 4px 0 var(--sgwc-edge),0 5px 12px #153d4e20}.sgwc-compact .sgwc-inside{border-radius:12px}.sgwc-compact .sgwc-top,.sgwc-compact .sgwc-bottom{display:none}.sgwc-compact .sgwc-art{aspect-ratio:1.3}.sgwc-compact .sgwc-rarity{font-size:8px;left:5px;top:5px;max-width:calc(100% - 10px);padding:3px 4px;border-radius:6px}.sgwc-compact .sgwc-copy{padding:7px 9px;min-height:52px}.sgwc-compact .sgwc-copy{container-type:inline-size;padding-inline:5px}/* an album tile keeps each word on one line (founder, 1 Oct: ANEMONE broke as ANEMO / NE): the word in its own case, as on Codex's album tiles, and the longest word sets the size */.sgwc-compact .sgwc-name{text-transform:none!important;letter-spacing:0!important;font-size:min(17px,calc(100cqi / (var(--sgwc-fit,6) * .56)))!important;line-height:1.18!important;overflow-wrap:normal!important;word-break:keep-all!important;hyphens:none!important}.sgwc-compact .sgwc-jp{font-size:11px;margin-top:4px}.sgwc-compact .sgwc-master-seal{width:24px;height:24px;font-size:12px;right:-5px;top:15px}.sgwc-compact .sgwc-resident-word{display:none}
.sgwc-dialog{box-sizing:border-box;max-width:min(420px,calc(100vw - 24px));width:420px;max-height:calc(100dvh - 24px);margin:auto;border:1px solid #d0dec7;border-radius:26px;padding:15px 19px 20px;background:linear-gradient(#f3f7e9,#e2ecda);box-shadow:0 20px 80px #092c4880;color:#244f43;overflow-y:auto;overscroll-behavior:contain;font-family:'Atkinson Hyperlegible','Zen Kaku Gothic New',system-ui,sans-serif}.sgwc-dialog::backdrop{background:#0a2e4bac;backdrop-filter:blur(7px)}.sgwc-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px;font-size:11px;font-weight:700}.sgwc-dialog button{font:inherit;color:#244f43;cursor:pointer;min-height:44px;border:1px solid #c4d2ba;border-radius:13px;background:linear-gradient(#fffdf0,#e8efd9);box-shadow:0 3px 0 #bbcbae;padding:9px 12px}.sgwc-dialog button:active{transform:translateY(2px);box-shadow:0 1px #bbcbae}.sgwc-dialog button:focus-visible,.sgwc-dialog a:focus-visible{outline:3px solid #227b6e;outline-offset:4px}.sgwc-dialog .sgwc-close{width:44px;flex:none;padding:4px;font-size:26px;line-height:1}.sgwc-dialog-body{max-width:340px;margin:auto}.sgwc-dialog-controls{display:flex;justify-content:center;margin-top:19px}.sgwc-status{font-size:12px;line-height:1.5;text-align:center;margin:12px 0 0}.sgwc-status:empty{display:none}
.sgwc-roll{padding:15px 0 30px;min-height:410px;display:flex;flex-direction:column;justify-content:center}.sgwc-roll-label{text-align:center;font-size:12px;font-weight:700;line-height:1.7;padding:0 10px}.sgwc-roll-window{position:relative;width:100%;overflow:hidden;min-height:278px;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}.sgwc-roll-track{display:flex;gap:12px;width:max-content;transform:translateX(30px);transition:transform 2200ms cubic-bezier(.12,.6,.12,1);padding:20px 0}.sgwc-card-back{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:space-around;box-sizing:border-box;width:150px;height:220px;border:6px solid #bbd7e1;border-radius:18px;background:radial-gradient(ellipse at 35% 20%,#4f9798,#294e6a);color:#f1efd9;box-shadow:0 5px 0 #658591}.sgwc-card-back span{font-size:8px;letter-spacing:.15em;font-weight:800}.sgwc-card-back b{font-size:60px;color:#c5e4dc;font-weight:500}.sgwc-roll-marker{position:absolute;left:50%;top:3px;transform:translateX(-50%);border:8px solid transparent;border-top-color:#7c609c}.sgwc-unlocked{animation:sgwc-reveal 450ms cubic-bezier(.2,.8,.2,1)}.sgwc-unlocked:after{content:'';position:absolute;inset:0;border-radius:24px;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#fff9 45%,transparent 65%);background-size:400% 100%;animation:sgwc-foil 900ms ease-out both}
@keyframes sgwc-reveal{from{transform:rotateY(80deg) scale(.94);opacity:.5}to{transform:none;opacity:1}}@keyframes sgwc-foil{from{background-position:100% 0}to{background-position:-30% 0}}@media(prefers-reduced-motion:reduce){.sgwc-roll-track{transition:none}.sgwc-unlocked,.sgwc-unlocked:after{animation:none!important}}
/* THE PEARL AND CREAM CARD (founder-approved Wordex mock, 2026-09-29): a rounded pearl rim, full-bleed portrait, cream
   reading panel, quiet green footer. A card's look (wordex-looks.js) only tints the rim, patterns the header/footer and
   adds cool foil; badges carry the rarity: Common grey, Rare blue, Super rare purple, Master gold. Gold is Master only. */
.sgwc-card{--sgwc-frame:#95bba9;--sgwc-frame-shadow:#789c88;--sgwc-bg:#dfebd7;--sgwc-pattern:none;--sgwc-pattern-size:auto;--sgwc-foil:0;padding:8px;border:1px solid #c5d7d0;border-radius:27px;background:linear-gradient(145deg,#ffffffb3,transparent 46%),conic-gradient(from 12deg,var(--sgwc-frame),#d9d0eb 21%,#e8d2ca 39%,#afded4 57%,#d6d6ec 75%,var(--sgwc-frame));box-shadow:inset 0 1px 2px #fff,0 5px 0 var(--sgwc-frame-shadow),0 8px 0 #c4d5ca80,0 20px 34px #2f56432c}
.sgwc-card:before{content:"";position:absolute;inset:3px;border:1px solid #ffffffe6;border-radius:23px;box-shadow:inset 0 0 0 1px #ffffff50;pointer-events:none;z-index:4}
.sgwc-card[data-edge=lined]:after,.sgwc-card[data-edge=dotted]:after,.sgwc-card[data-edge=stitched]:after{content:"";position:absolute;inset:4px;border:1px dashed #ffffffc0;border-radius:22px;pointer-events:none;z-index:4}
.sgwc-card[data-edge=lined]:after{border-style:solid;border-color:#ffffff90}
.sgwc-inside{border-radius:19px;border:1px solid #fff7e8;background:#fbf7e7}
.sgwc-top{color:#4d7363;background-image:var(--sgwc-pattern),linear-gradient(100deg,#f7f0e8,var(--sgwc-bg));background-size:var(--sgwc-pattern-size),auto;background-blend-mode:soft-light,normal}
.sgwc-art{background-color:var(--sgwc-bg)}.sgwc-art>img{transform:scaleX(var(--sgwc-mirror,1));filter:var(--sgwc-img-filter,none)}
.sgwc-copy{background:linear-gradient(115deg,#fcf8e9,#f8f3df);color:#305d4e}
.sgwc-bottom{background-color:#eaf0dc;background-image:var(--sgwc-pattern);background-size:var(--sgwc-pattern-size);background-blend-mode:soft-light;color:#779b88;border-top:1px solid #d6e1c9}
.sgwc-rarity{background:linear-gradient(145deg,#e3f0fc,#c7def4);border:1px solid #f2f8ff;color:#315c88;font-weight:800;box-shadow:0 2px 0 #52779c35,0 3px 8px #41678b18}
.sgwc-foil{position:absolute;inset:4px;border-radius:22px;pointer-events:none;mix-blend-mode:soft-light;opacity:var(--sgwc-foil,0);background:linear-gradient(116deg,transparent 7%,#d1fcffb0 18%,#e5d9ffb0 27%,#ffe5eeb0 36%,#cafff0b0 44%,transparent 57%,#ffffffd0 72%,transparent 86%);background-size:220% 100%;z-index:3}
.sgwc-card[data-rarity=common]{background:linear-gradient(140deg,#f1f5ee,var(--sgwc-frame));border-color:#b6cbbb;box-shadow:inset 0 1px 2px #fff,0 4px 0 var(--sgwc-frame-shadow),0 15px 25px #31513f20}
.sgwc-card[data-rarity=common] .sgwc-rarity{background:linear-gradient(145deg,#f0f2f2,#dce1e2);color:#4d5b60;border-color:#fafcfc;box-shadow:0 2px 0 #6b787d2b,0 3px 8px #48565a12}
.sgwc-card[data-rarity=common] .sgwc-foil{opacity:0}.sgwc-card[data-rarity=common] .sgwc-top{background-image:linear-gradient(100deg,#f7f2e9,var(--sgwc-bg));background-size:auto}.sgwc-card[data-rarity=common] .sgwc-bottom{background-image:none}
.sgwc-card[data-rarity=super-rare]{background:linear-gradient(150deg,#fffffff0,transparent 42%),conic-gradient(from 8deg,#b4e5dd,var(--sgwc-frame) 15%,#cfbdea 30%,#f3d2e4 45%,#aadbd6 63%,#ddd5fb 78%,var(--sgwc-frame));box-shadow:inset 0 1px 3px #fff,0 5px 0 var(--sgwc-frame-shadow),0 8px 0 #d9c9e4aa,0 20px 34px #31583f29,0 0 14px #d8c9f25c}
.sgwc-card[data-rarity=super-rare] .sgwc-rarity{background:linear-gradient(135deg,#e7d8fb,#dac8eb);color:#6c438b;border-color:#fff1ff;box-shadow:0 2px 0 #8c72a243,0 0 9px #eee2ffaa}
.sgwc-card[data-rarity=super-rare] .sgwc-foil{opacity:max(var(--sgwc-foil),.24)}
.sgwc-card[data-rarity=master]{background:linear-gradient(145deg,#fff9d3bb,transparent 45%),conic-gradient(from 10deg,#b69c50,#e4cf82 20%,#a99046 42%,#f4dfa0 63%,#b49b52 82%,#d6ba67);border-color:#a9914d;box-shadow:inset 0 1px 2px #fff9d8,0 5px 0 #958047,0 8px 0 #d8c88e80,0 20px 34px #57492626}
.sgwc-card[data-rarity=master]:before{border-color:#fff7d0}.sgwc-card[data-rarity=master] .sgwc-rarity{background:linear-gradient(135deg,#f7eac3,#e5ce87);color:#826529;border-color:#fff6d8}.sgwc-card[data-rarity=master] .sgwc-bottom{background-color:#f0e7c7;color:#987f3d;border-color:#dcca93}
.sgwc-compact:before,.sgwc-compact:after{inset:2px;border-radius:15px}.sgwc-compact .sgwc-foil{inset:3px;border-radius:14px}
@media(prefers-reduced-motion:reduce){.sgwc-foil{animation:none!important}}
/* The approved card's reading panel (Codex mock card-390.png): one meta line, the meaning in bold, a quiet rule, the example. */
.sgwc-number{font-variant-numeric:tabular-nums;letter-spacing:.06em;color:#5c7b68}
.sgwc-meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:0;margin:6px 0 0;font:500 13px/1.5 'Zen Kaku Gothic New',system-ui,sans-serif;color:#7b8a79}
.sgwc-meta .sgwc-part{font-size:12px;color:#8e9884}.sgwc-meta .sgwc-jp{margin:0;font-size:13px;color:#6f7f6d}.sgwc-dot{color:#a6ad96;padding:0 4px}
.sgwc-meaning-en{margin:12px 0 0;font:800 17px/1.4 'Baloo 2','Fredoka',system-ui,sans-serif;color:#2d4f3f}
.sgwc-meaning-ja{margin:6px 0 0;font:500 13px/1.6 'Zen Kaku Gothic New',system-ui,sans-serif;color:#5a6e5f}
.sgwc-card .sgwc-example{margin-top:14px;padding-top:12px;border-top:1px solid #dfe1c8;color:#809179}
.sgwc-collection{letter-spacing:.12em;font-weight:800}
.sgwc-compact .sgwc-meta{font-size:11px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sgwc-compact .sgwc-part,.sgwc-compact .sgwc-dot{display:none}   /* a tile: the word and its Japanese, one line each, as on Codex's tiles */
/* THE OPEN CARD (founder, 1 Oct: match Codex's card-390): the card itself fills the screen, no framed panel around it;
   the close button sits on the card's corner and 発音 stays below. */
.sgwc-dialog{width:min(440px,calc(100vw - 16px));max-width:none;padding:6px;border:0;background:transparent;box-shadow:none;overflow:visible}
.sgwc-dialog-header{position:absolute;top:14px;right:14px;z-index:6;margin:0}
.sgwc-dialog-header>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sgwc-dialog .sgwc-close{min-height:40px;min-width:40px;padding:0;border-radius:999px;background:#fffdf3e6}
.sgwc-dialog-body>.sgwc-card{max-width:none;width:100%}
.sgwc-dialog-controls{display:flex;justify-content:center;margin-top:12px}
.sgwc-dialog .sgwc-status{color:#fffdf3;text-align:center}
.sgwc-dialog .sgwc-card{width:100%}
.sgwc-dialog .sgwc-dialog-body{max-width:none}
/* the open card's reading panel at Codex's proportions (card-390): roomier panel, larger definition and example, letter-spaced footer */
.sgwc-dialog-header{top:-8px;right:-4px}
.sgwc-dialog .sgwc-card:not(.sgwc-compact) .sgwc-stars{color:inherit}
/* THE FULL CARD SCALES WITH ITSELF (Codex's card-390 and its 100-look gallery): type and spacing follow the card's
   width, not the screen's, so a gallery card, the reveal and the open card keep the same proportions. */
.sgwc-card:not(.sgwc-compact){container-type:inline-size}
.sgwc-card:not(.sgwc-compact) .sgwc-name{font-size:clamp(16px,12cqi,46px)!important}
.sgwc-card:not(.sgwc-compact) .sgwc-copy{padding:clamp(9px,5.6cqi,22px) clamp(10px,6cqi,22px)}
.sgwc-card:not(.sgwc-compact) .sgwc-meta{font-size:clamp(9px,3.6cqi,14px);margin-top:clamp(3px,2cqi,8px)}
.sgwc-card:not(.sgwc-compact) .sgwc-meaning-en{font-size:clamp(10px,5cqi,19px);line-height:1.35;margin-top:clamp(5px,3.8cqi,14px)}
.sgwc-card:not(.sgwc-compact) .sgwc-example{margin-top:clamp(7px,5.4cqi,20px);padding-top:clamp(5px,4.4cqi,16px)}
.sgwc-card:not(.sgwc-compact) .sgwc-example p{font-size:clamp(8px,3.8cqi,15px)}
.sgwc-card:not(.sgwc-compact) .sgwc-example .sgwc-example-ja{font-size:clamp(7px,3.3cqi,13px)}
.sgwc-card:not(.sgwc-compact) .sgwc-top{padding:clamp(5px,3.3cqi,12px) clamp(7px,4.4cqi,16px);font-size:clamp(6px,3cqi,11px);letter-spacing:.16em}
.sgwc-card:not(.sgwc-compact) .sgwc-bottom{padding:clamp(5px,3.6cqi,13px) clamp(7px,4.4cqi,16px);font-size:clamp(6px,3cqi,11px);letter-spacing:.16em}
.sgwc-card:not(.sgwc-compact) .sgwc-stars{font-size:clamp(8px,4.1cqi,15px);letter-spacing:.4em}

/* THE DECK ROLL (founder, 2 Oct 2026): the one rolling-deck pose, for the lesson ending's deck and the card of the day (word-cards.js rollAt / rollIn) */
.sgwc-roll{--p:0;--i:2;opacity:min(1,calc(var(--p) * 3));transform:translate(calc((1 - var(--p)) * 150px + var(--i) * 3px - 6px),calc((1 - var(--p)) * 70px - var(--i) * 2px)) rotate(calc((1 - var(--p)) * 20deg + (var(--i) - 2) * 2.5deg))}
/* The reel container shares the .sgwc-roll class (its layout above) but is never posed by the deck roll: without this the
   pose rule leaves it at opacity 0, off-centre (the invisible daily reel, found in K1 screenshots on 8 Oct 2026). */
.sgwc-roll.sgwc-roll-reel{opacity:1;transform:none}
/* the dialog's close button sits over the card's top right: the card's top row keeps clear of it, so the number shows whole */
.sgwc-dialog .sgwc-card .sgwc-top{padding-right:46px}
.sgwc-dialog-actions{gap:10px}.sgwc-dialog-actions[hidden]{display:none}.sgwc-dialog .sgwc-action{flex:1;max-width:180px}.sgwc-dialog .sgwc-action-primary{color:#fffdf3;border-color:#1b6a7b;background:linear-gradient(#2a7f8f,#1b6a7b);box-shadow:0 3px 0 #124d59}