/* Public collections: the artwork is the surface; actions appear on demand. */
.editor-profile{display:grid;grid-template-columns:minmax(180px,.65fr) minmax(0,1.35fr);gap:24px;align-items:start}
.editor-profile input,.editor-profile textarea{height:54px;min-height:54px}
.editor-profile textarea{resize:vertical}
.editor-profile>label{margin:0}
.brain-panel{background:#f5f5f5;padding:18px 22px;margin:0 0 24px}
.brain-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--red)}
.brain-toolbar p{font-size:18px;font-weight:700}.brain-panel .help{font-size:12px;margin-top:8px}
.brain-map{display:block;width:100%;height:auto;max-width:680px;margin:auto;overflow:visible}
.brain-outline{fill:#e60012;stroke:#e60012;stroke-width:3;stroke-linejoin:round}
.brain-area{fill:#fff;stroke:#b5000e;stroke-width:3;stroke-linejoin:round}
.brain-caption{fill:var(--red);font-weight:700;font-family:var(--font);text-anchor:middle}
.brain-display-options{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin-top:20px}
.brain-display-options span{font-size:15px}
.brain-text-bg{fill:#f4f4f4}.brain-text{fill:#e60012;font-weight:700;font-family:var(--font);text-anchor:middle;pointer-events:none}
.brain-cell{cursor:pointer}.brain-cell:hover{opacity:.65}
.brain-preview{max-width:460px;margin:24px auto 0}
.brain-design{max-width:680px;margin:28px auto 0;padding-top:24px;border-top:1px solid var(--line)}
.brain-design-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.brain-design-heading h3{margin:0;font-size:18px}
.brain-design .help{font-size:12px;margin:12px 0 0}
.brain-pattern-options{grid-template-columns:repeat(4,minmax(0,1fr))}
.brain-section{max-width:720px;margin:0 auto 40px}.brain-section>.help{text-align:center;font-size:12px;margin:12px 0}
.collection-page{max-width:1488px;margin:auto;padding:0 24px 38px}
.collection-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0 30px;border-top:2px solid var(--red)}
.collection-owner{font-size:14px;color:var(--gray);margin:0 0 7px}
.collection-heading h1{font-size:clamp(25px,3vw,40px);line-height:1.5;overflow-wrap:anywhere;margin:0}
.collection-actions{display:flex;align-items:center;gap:20px;flex-shrink:0;font-size:14px}
.collection-message{max-width:780px;margin:0 0 28px;white-space:pre-wrap}
.bingo-stage{position:relative;min-width:0;isolation:isolate}
.bingo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.bingo-stage.grid-5 .bingo-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.bingo-stage.grid-9 .bingo-grid{grid-template-columns:repeat(9,minmax(0,1fr))}
.piece{position:relative;aspect-ratio:1;min-width:0;background:#f2f2f2}
.piece-art{position:absolute;inset:0;overflow:hidden}
.piece-art img{width:100%;height:100%;display:block;object-fit:cover}
.piece-art:after{content:"";position:absolute;inset:0;background:#000;opacity:0;transition:opacity .16s}
.piece-text{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;padding:10%;color:var(--red);background:#f3f3f3;overflow:hidden}
.piece-text small{font-size:clamp(10px,1.2vw,14px);margin-bottom:8px}
.piece-text strong{font-size:clamp(13px,2.2vw,28px);line-height:1.55;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;overflow-wrap:anywhere}
.grid-9 .piece-text strong{font-size:clamp(7px,1.2vw,18px)}.grid-9 .piece-text small{display:none}
.piece-open{position:absolute;inset:0;z-index:1;width:100%;height:100%;border:0;background:transparent;padding:0}
.piece-open:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.piece-checked{position:absolute;right:7px;top:7px;display:none;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--red);color:#fff;font-size:16px;font-weight:700;z-index:2}
.piece.is-checked:after{content:"";position:absolute;inset:0;border:3px solid var(--red);pointer-events:none;z-index:2}
.piece.is-checked .piece-checked{display:flex}
.grid-9 .piece-checked{right:3px;top:3px;width:17px;height:17px;font-size:11px}
.piece-pop{position:absolute;z-index:5;left:50%;top:0;transform:translateX(-50%);width:clamp(250px,100%,400px);max-width:calc(100vw - 40px);padding:38px 22px 22px;background:rgba(15,15,15,.88);color:#fff;opacity:0;visibility:hidden;transition:opacity .16s;text-align:center;box-shadow:0 4px 18px #0003}
.piece[data-edge=left] .piece-pop{left:0;transform:none}
.piece[data-edge=right] .piece-pop{left:auto;right:0;transform:none}
.piece-number{position:absolute;top:12px;left:14px;font-size:13px;font-weight:700}
.piece-pop{display:none}
.piece-pop h2{font-size:20px;line-height:1.55;margin:0 0 7px;overflow-wrap:anywhere}
.piece-pop p{font-size:12px;line-height:1.6;margin:0 0 12px;color:#eee;overflow-wrap:anywhere}
.piece-pop a{color:#fff}
.bingo-toggle{display:block;width:100%;min-height:44px;padding:9px 15px;border:1px solid #fff;background:#fff;color:#111;font-size:15px;font-weight:700;margin:16px 0 12px}
.bingo-toggle[aria-pressed=true]{background:var(--red);border-color:var(--red);color:#fff}
.piece-amazon,.piece-source{display:block;padding:8px 5px;font-size:14px;line-height:1.5}
.piece-amazon small{font-size:10px;color:#ddd}.piece-source{font-size:12px}
@media(min-width:761px) and (hover:hover) and (pointer:fine){
  .piece-pop{display:block}
  .piece:hover,.piece:focus-within{z-index:10}
  .piece:hover .piece-art:after,.piece:focus-within .piece-art:after{opacity:.35}
  .piece:hover .piece-pop,.piece:focus-within .piece-pop{opacity:1;visibility:visible}
  .bingo-touch-hint{display:none}
}
.bingo-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:20;overflow:visible}
.bingo-lines line{stroke-linecap:round;vector-effect:non-scaling-stroke}
.line-outline{stroke:#fff;stroke-width:8;opacity:.9}
.complete-line{stroke:var(--red);stroke-width:4}
.bingo-status{display:flex;align-items:baseline;flex-wrap:wrap;gap:9px 18px;padding:20px 0;font-size:14px}
.bingo-status>strong{font-size:30px;color:var(--red);margin-right:-12px}
.bingo-status span strong{font-size:21px;color:var(--red)}
#score-message{margin:0;font-size:13px;color:var(--gray)}
.bingo-touch-hint{font-size:12px;color:var(--gray);margin:12px 0}
.collection-details{margin:42px 0 0}
.collection-details>h2{font-size:25px;margin:0 0 25px}
.collection-items{list-style:none;padding:0;margin:0}
.collection-item{scroll-margin-top:24px;min-width:0}
.collection-art{min-width:0;overflow:hidden;background:#f1f1f1}
.collection-art img{display:block;width:100%;height:100%;object-fit:contain}
.collection-info{min-width:0}
.collection-info h3{font-size:22px;line-height:1.55;overflow-wrap:anywhere;margin:5px 0 12px}
.collection-kind{font-size:12px;color:var(--red);margin:0}
.collection-author{font-size:14px;color:var(--gray);line-height:1.8;margin:0 0 16px;overflow-wrap:anywhere}
.collection-reason{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:2;margin:20px 0}
.collection-source{display:block;width:fit-content;font-size:14px;margin-top:18px}
.collection-item .detail-check{margin-top:18px}
.layout-bingo .collection-details{background:#f5f5f5;padding:32px}
.layout-bingo .collection-item{display:grid;grid-template-columns:130px minmax(0,1fr);gap:28px;padding:28px 0;border-top:1px solid #d7d7d7}
.layout-bingo .collection-art{aspect-ratio:1}
.folded-details .collection-item{display:block;padding:0}
.folded-details .item-detail>summary{display:grid;grid-template-columns:64px minmax(0,1fr) 24px;padding:18px 0;gap:22px;cursor:pointer;list-style:none}
.folded-details .item-detail>summary::-webkit-details-marker{display:none}
.folded-details .item-detail h3{font-size:19px;margin:2px 0}
.folded-details .collection-author{font-size:13px;margin:0}
.folded-details .collection-body{padding:0 0 26px 86px}
.folded-details .collection-reason{margin-top:5px}
.layout-portfolio .collection-heading{padding-top:36px;padding-bottom:36px}
.layout-portfolio .collection-details{margin-top:0;background:#f5f5f5;padding:28px}
.layout-portfolio .collection-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.layout-portfolio .collection-item{background:#fff;align-self:start}
.layout-portfolio .collection-art{aspect-ratio:1}
.layout-portfolio .collection-art img{object-fit:cover}
.layout-portfolio .collection-info{padding:22px}
.layout-portfolio .collection-info h3{font-size:21px}
.layout-portfolio .collection-reason,.portfolio-comment{font-size:15px;line-height:1.9}
.portfolio-comment{margin:16px 0;overflow-wrap:anywhere}
.portfolio-comment summary{cursor:pointer;list-style:none}.portfolio-comment summary::-webkit-details-marker{display:none}
.portfolio-comment summary b{display:block;text-decoration:underline;font-weight:400;margin-top:7px}
.portfolio-comment[open] summary span{display:none}
.portfolio-comment[open] summary b{font-size:0}.portfolio-comment[open] summary b:after{content:"コメントを閉じる";font-size:14px}
.layout-single .collection-details{margin:12px 0 0}
.layout-single .collection-item{display:grid;grid-template-columns:minmax(250px,.85fr) minmax(0,1.15fr);align-items:start;gap:60px}
.layout-single .collection-art{aspect-ratio:1;background:#f5f5f5}
.layout-single .collection-info{padding:12px 0}
.layout-single .collection-info h3{font-size:32px}
.layout-single .collection-reason{line-height:2.1}
.collection-dock{position:fixed;left:0;right:0;bottom:0;z-index:15;display:flex;align-items:center;justify-content:flex-end;gap:24px;background:#fff;border-top:1px solid #ddd;padding:16px max(24px,calc((100vw - 1440px)/2));margin:0}
body:has(.collection-page){padding-bottom:110px}
.collection-dock-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px}
.collection-dock .button{font-size:14px;min-height:48px;padding:11px 20px;white-space:nowrap}
#dock-score{margin-right:auto;font-size:14px;font-weight:700;color:var(--red)}
.item-dialog{width:min(530px,calc(100% - 24px))}
.dialog-art{display:block;width:180px;height:180px;object-fit:contain;margin:0 auto 22px;background:#f5f5f5}
.item-dialog h2{font-size:24px;margin:12px 0}
.item-dialog .collection-reason{font-size:15px}
.item-dialog button[data-game-control]{width:100%;margin-top:20px}
#share-result{background:#000;border-color:#000;color:#fff}
#share-result:hover{background:#222;border-color:#222}
#result-dialog .result-preview{margin:24px 0 0}
.layout-options{grid-template-columns:repeat(3,minmax(0,1fr))}
.layout-options span{font-size:19px}
.bingo-size{display:flex;align-items:center;gap:24px;margin-top:22px;font-size:14px}
.size-options{flex:1;grid-template-columns:repeat(3,minmax(0,1fr));max-width:430px}
.size-options label{padding:11px}.size-options span{font-size:18px}
.editor-slots[data-layout=single]{grid-template-columns:minmax(0,1fr);max-width:560px;margin:auto}
.editor-slots[data-layout=single] .slot-picker{min-height:300px}
.editor-slots[data-layout=single] .slot-picker img{width:160px;height:200px;object-fit:contain}
.editor-slots[data-layout=single] .slot-title{font-size:20px}
.editor-slots[data-layout=portfolio] .slot-picker{min-height:220px}
.media-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.music-options{display:flex;gap:20px;margin:16px 0 8px}
.music-options button{border:0;border-bottom:2px solid transparent;background:none;padding:8px 4px;font-size:14px}
.music-options button[aria-pressed=true]{color:var(--red);border-color:var(--red);font-weight:700}
#anime-preview-note{font-size:13px;margin:16px 0}
@media(max-width:1000px){
  .layout-single .collection-item{gap:30px}
  .layout-portfolio .collection-items{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .collection-page{padding:0 14px 24px}
  .collection-heading{display:block;padding:20px 0 24px}
  .collection-heading h1{font-size:25px}.collection-owner{font-size:13px}
  .collection-actions{flex-direction:row;gap:20px;justify-content:flex-end;font-size:12px;margin-top:14px}
  .collection-actions .text-button{font-size:12px;white-space:nowrap}
  .bingo-grid{gap:2px}
  .piece-checked{width:20px;height:20px;font-size:13px;top:4px;right:4px}
  .grid-9 .piece-checked{width:12px;height:12px;font-size:9px;top:1px;right:1px}
  .piece.is-checked:after{border-width:2px}
  .line-outline{stroke-width:6}.complete-line{stroke-width:3}
  .bingo-status{gap:8px 12px;font-size:12px;padding:10px 0}
  .bingo-status>strong{font-size:25px;margin-right:-6px}
  .bingo-status span strong{font-size:17px}#score-message{flex-basis:100%}
  .layout-bingo .collection-details{padding:22px 14px;margin:28px -4px 0}
  .collection-details>h2{font-size:21px;margin-bottom:18px}
  .layout-bingo .collection-item{grid-template-columns:80px minmax(0,1fr);gap:16px;padding:24px 0}
  .collection-info h3{font-size:20px}
  .collection-reason{font-size:15px}
  .folded-details .collection-item{display:block;padding:0}
  .folded-details .item-detail>summary{grid-template-columns:48px minmax(0,1fr) 18px;gap:12px;padding:15px 0}
  .folded-details .item-detail h3{font-size:16px}
  .folded-details .collection-body{padding:0 0 22px}
  .layout-portfolio .collection-details{padding:14px}
  .layout-portfolio .collection-items{grid-template-columns:minmax(0,1fr);gap:22px}
  .layout-portfolio .collection-info{padding:20px}
  .layout-single .collection-item{display:block}
  .layout-single .collection-art{max-width:520px;margin:0 auto 24px}
  .layout-single .collection-info h3{font-size:26px}
  .collection-dock{flex-wrap:wrap;gap:6px;padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
  .collection-dock-actions{gap:8px;width:100%}
  .collection-dock .button{font-size:12px;padding:10px 8px;min-height:46px;flex:1}
  .collection-dock .button.outline{flex:1.6}
  #dock-score{font-size:12px}
  .item-dialog{padding:20px}.item-dialog .dialog-art{width:140px;height:140px}
  .layout-options label{padding:16px 3px}.layout-options span{font-size:14px}
  .bingo-size{display:block;margin-top:20px}.size-options{margin-top:9px;max-width:none}
  .size-options span{font-size:16px}.size-options label{padding:9px}
  .media-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.media-options button{font-size:13px}
}
.itunes-badge{display:block;width:110px;height:40px;object-fit:contain}.piece-source .itunes-badge{margin:auto}.catalog-source:has(.itunes-badge){padding:0 0 0 8px}.catalog-source .itunes-badge{width:95px;height:36px}.collection-source .itunes-badge{margin:0}.selected-work .itunes-badge{margin-top:12px}
/* Keep book covers near their useful display resolution. */
.layout-bingo:has(.grid-3){max-width:768px}
.layout-bingo:has(.grid-5){max-width:968px}
.layout-bingo:has(.grid-9){max-width:1200px}
.layout-single{max-width:1080px}
.layout-bingo .collection-heading h1{font-size:clamp(24px,2.6vw,34px)}
.collection-heading{align-items:flex-start}.collection-actions{flex-wrap:wrap}
.like-section{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px;margin:-10px 0 25px;min-height:42px}
.like-section p{margin:0;font-size:13px;color:var(--gray)}
.like-button{border:1px solid var(--red);color:var(--red);background:#fff;padding:10px 18px;font-size:15px;font-weight:700;min-height:44px}
.like-button:hover{background:#fff0f1}.like-button[aria-pressed=true]{background:var(--red);color:#fff}
.like-button:disabled{opacity:.6}.like-section #like-error{flex-basis:100%;text-align:right;color:var(--red)}
.editor-main .format-options{gap:10px;border:0}
.editor-main .format-options label{border:1px solid #aaa;flex-direction:row;padding:16px 12px;min-height:58px;gap:10px}
.editor-main .format-options label+label{border:1px solid #aaa}
.editor-main .format-options label:has(:checked){border-color:var(--red)}
.editor-main .format-options input{position:static;opacity:1;width:16px;height:16px;flex:0 0 16px;margin:0}
.editor-main .format-options span{font-size:17px;line-height:1.6;overflow-wrap:anywhere}
.editor-main .format-options label:focus-within{outline:2px solid var(--red);outline-offset:3px}
.editor-main .brain-display-options label{padding:12px 8px;gap:6px}
.editor-main .brain-display-options label span{font-size:14px;white-space:nowrap}
.editor-main .brain-pattern-options label{padding:12px 6px;gap:6px}
.editor-main .brain-pattern-options label span{font-size:14px;white-space:nowrap}
.editor-main .size-options label{min-height:48px;padding:10px 8px}
.portfolio-style{margin-top:22px}.portfolio-style>p{font-size:14px;margin-bottom:12px}
.portfolio-options{grid-template-columns:repeat(3,minmax(0,1fr))}
#portfolio-item-fields>label{display:block;margin-top:22px}
#portfolio-item-fields>label[hidden]{display:none}
.slot-extra{display:block;font-size:12px;color:var(--red);margin:5px 0}.slot-extra:empty{display:none}
.editor-slots[data-layout=portfolio][data-style=simple]{grid-template-columns:minmax(0,1fr);max-width:560px;margin:auto}
.editor-slots[data-layout=portfolio][data-style=timeline]{grid-template-columns:minmax(0,1fr);max-width:none;margin:0;gap:16px}
.editor-slots[data-layout=portfolio][data-style=timeline] .slot-picker{display:grid;grid-template-columns:26px 70px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:16px;row-gap:4px;min-height:130px;padding:16px;text-align:left;align-items:center}
.editor-slots[data-layout=portfolio][data-style=timeline] .slot-number{grid-column:1;grid-row:1/4;align-self:center;margin:0}
.editor-slots[data-layout=portfolio][data-style=timeline] .slot-picker img,.editor-slots[data-layout=portfolio][data-style=timeline] .slot-book{grid-column:2;grid-row:1/4;width:70px;height:95px;object-fit:contain;font-size:13px}
.editor-slots[data-layout=portfolio][data-style=timeline] .slot-title{grid-column:3;grid-row:1;font-size:16px}
.editor-slots[data-layout=portfolio][data-style=timeline] .slot-extra{grid-column:3;grid-row:2;margin:0}
.editor-slots[data-layout=portfolio][data-style=timeline] .slot-comment{grid-column:3;grid-row:3}
.layout-portfolio{max-width:1180px}
.layout-portfolio.portfolio-simple .collection-details,.layout-portfolio.portfolio-timeline .collection-details{background:#fff;padding:0}
.layout-portfolio.portfolio-simple .collection-items,.layout-portfolio.portfolio-timeline .collection-items{display:block;max-width:980px;margin:auto}
.portfolio-simple .collection-item{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;padding:30px;background:#f5f5f5;margin:0 0 24px}
.portfolio-simple .collection-info{padding:0}.portfolio-simple .collection-art{aspect-ratio:1}
.portfolio-simple .collection-art img{object-fit:contain}
.portfolio-timeline .collection-item{display:grid;grid-template-columns:130px 170px minmax(0,1fr);gap:26px;padding:28px 0 32px;position:relative;margin:0}
.portfolio-timeline .collection-item:before{content:'';position:absolute;left:141px;top:0;bottom:0;width:2px;background:#ddd}
.portfolio-timeline .collection-item:after{content:'';position:absolute;left:135px;top:38px;width:14px;height:14px;background:var(--red);border:3px solid #fff;border-radius:50%}
.timeline-date{color:var(--red);font-size:16px;font-weight:700;line-height:1.8;overflow-wrap:anywhere;padding:2px 12px 0 0}
.portfolio-timeline .collection-info{padding:0 0 0 4px}.portfolio-timeline .collection-art{aspect-ratio:1}.portfolio-timeline .collection-art img{object-fit:contain}
.layout-portfolio.portfolio-bento .collection-details{background:#f5f5f5;padding:18px}
.portfolio-bento .collection-items{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:row;gap:16px;align-items:stretch}
.portfolio-bento .collection-item{border-radius:14px;overflow:hidden;align-self:stretch;display:flex;flex-direction:column;min-width:0}
.portfolio-bento .collection-art{aspect-ratio:1.15;flex-shrink:0}
.portfolio-bento .collection-info{padding:18px}.portfolio-bento .collection-info h3{font-size:19px}
.portfolio-bento .collection-reason{font-size:14px}
.portfolio-bento .collection-item[data-size=wide]{grid-column:span 2}
.portfolio-bento .collection-item[data-size=large],.portfolio-bento .collection-item[data-size=auto]:nth-child(6n+1){grid-column:span 2;grid-row:span 2}
.portfolio-bento .collection-item[data-size=wide] .collection-art{aspect-ratio:2.1}
.portfolio-bento .collection-item[data-size=large] .collection-info h3,.portfolio-bento .collection-item[data-size=auto]:nth-child(6n+1) .collection-info h3{font-size:25px}
.portfolio-bento .collection-items:has(>.collection-item:only-child){grid-template-columns:minmax(0,1fr);max-width:640px;margin:auto}
.portfolio-bento .collection-item[data-size]:only-child{grid-column:1/-1;grid-row:auto}
@media(max-width:1000px){.portfolio-bento .collection-items{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
.editor-page .page-heading h1{font-size:clamp(23px,6.8vw,32px);letter-spacing:.01em}
.editor-page .field-row{grid-template-columns:minmax(0,1fr);gap:20px}
.editor-main .layout-options,.editor-main .portfolio-options{grid-template-columns:minmax(0,1fr);gap:8px}
.editor-main .layout-options label,.editor-main .portfolio-options label{justify-content:flex-start;padding:12px 16px;min-height:49px}
.editor-main .format-options span{font-size:16px}.editor-main .size-options{gap:8px}.editor-main .size-options input{width:14px;height:14px;flex-basis:14px}.editor-main .size-options label{gap:5px;padding:10px 4px}.editor-main .size-options span{font-size:14px;white-space:nowrap}
.like-section{margin:0 0 20px;min-height:0}
.portfolio-simple .collection-item{grid-template-columns:100px minmax(0,1fr);gap:18px;padding:20px 14px}
.portfolio-simple .collection-art{width:100px}.portfolio-simple .collection-info h3{font-size:20px}
.portfolio-timeline .collection-item{grid-template-columns:86px minmax(0,1fr);gap:14px;padding:18px 0 26px 24px}
.portfolio-timeline .timeline-date{grid-column:1/-1;font-size:15px;padding:0}
.portfolio-timeline .collection-item:before{left:5px}.portfolio-timeline .collection-item:after{left:-1px;top:25px}
.portfolio-timeline .collection-info{padding:0}.portfolio-timeline .collection-info h3{font-size:20px}
.portfolio-timeline .collection-item .purchase-links{display:block}.portfolio-timeline .buy-button{display:block;margin-top:10px}
.portfolio-bento .collection-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.portfolio-bento .collection-info{padding:16px}.portfolio-bento .collection-info h3{font-size:18px}
}
@media(max-width:480px){
.portfolio-simple .collection-item{display:block;padding:18px}.portfolio-simple .collection-art{width:100%;max-width:260px;margin:0 auto 20px}
.portfolio-timeline .collection-info{grid-column:1/-1}.portfolio-timeline .collection-art{grid-column:1/-1;width:140px}
.portfolio-bento .collection-items{grid-template-columns:minmax(0,1fr)}
.portfolio-bento .collection-item[data-size]{grid-column:auto;grid-row:auto}.portfolio-bento .collection-item[data-size] .collection-art{aspect-ratio:1.3}
}
/* Overlay controls stay inside the artwork's frame. */
.collection-heading h1,.layout-bingo .collection-heading h1{font-size:clamp(21px,2vw,28px)}
.editor-main .layout-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.piece-pop{inset:0;width:100%;height:100%;max-width:none;transform:none;padding:21px 8px 8px;box-shadow:none;background:rgba(12,12,12,.78);overflow:auto;scrollbar-width:thin}
.piece[data-edge] .piece-pop{left:0;right:0;transform:none}
.piece-pop h2{font-size:clamp(11px,1.15vw,16px);line-height:1.4;margin:0 0 5px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.piece-pop p{font-size:11px;margin:0 0 5px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
.piece-number{top:4px;left:8px;font-size:10px}
.bingo-toggle{min-height:28px;margin:6px 0;padding:4px 6px;font-size:12px}
.piece-amazon,.piece-source{font-size:12px;padding:4px 0}
.piece-source .itunes-badge{max-width:100%;height:auto}
.grid-9 .piece-pop{padding:18px 6px 6px}.grid-9 .piece-pop h2{font-size:11px}.grid-9 .piece-pop p{display:none}
.grid-9 .bingo-toggle{font-size:11px;min-height:26px;margin:4px 0;padding:3px}
.grid-9 .piece-amazon{font-size:11px;padding:2px 0}
.piece.overlay-dismissed .piece-pop{opacity:0;visibility:hidden;pointer-events:none}
.piece.overlay-dismissed .piece-art:after{opacity:0}
.portfolio-bento .collection-items{grid-auto-rows:clamp(180px,21vw,250px)}
.portfolio-bento .collection-item{position:relative;display:block;height:100%;min-height:0;aspect-ratio:auto}
.portfolio-bento .collection-item[data-size] .collection-art{position:absolute;inset:0;aspect-ratio:auto;width:100%;height:100%;margin:0;max-width:none}
.portfolio-bento .collection-art img{object-fit:cover}
.bento-open{position:absolute;inset:0;border:0;background:transparent;width:100%;height:100%;z-index:1;padding:0}
.bento-open:focus-visible{outline:3px solid var(--red);outline-offset:-3px}
.portfolio-bento .collection-info{position:absolute;inset:0;z-index:2;padding:18px;background:rgba(12,12,12,.8);color:#fff;overflow:auto;scrollbar-width:thin;opacity:0;visibility:hidden;transition:opacity .12s}
.portfolio-bento .collection-item[data-size] .collection-info h3{font-size:16px;line-height:1.5;margin:0 0 8px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.portfolio-bento .collection-kind{display:none}
.portfolio-bento .collection-author,.portfolio-bento .collection-info .help{color:#ddd;font-size:12px;margin:0 0 10px}
.portfolio-bento .collection-info a,.portfolio-bento .bento-more{color:#fff}
.portfolio-bento .collection-reason,.portfolio-bento .portfolio-comment{font-size:13px;line-height:1.8;margin:10px 0}
.portfolio-bento .collection-info>.collection-reason{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.portfolio-bento .bento-more{font-size:12px;padding:6px 0;margin-top:8px}
.portfolio-bento .purchase-links .buy-button{font-size:12px;padding:8px;background:transparent;border-color:#bbb;color:#fff}
.portfolio-bento .purchase-links .buy-button:hover{background:#ffffff26}.portfolio-bento .buy-button small{color:#ddd}
.portfolio-bento .collection-source{margin-top:8px}
.portfolio-bento .purchase-links{gap:6px;margin-top:8px}
@media(min-width:761px) and (hover:hover) and (pointer:fine){
.portfolio-bento .bento-card:hover .collection-info,.portfolio-bento .bento-card:focus-within .collection-info{opacity:1;visibility:visible}
.portfolio-bento .bento-card.overlay-dismissed .collection-info{opacity:0;visibility:hidden;pointer-events:none}
}
@media(max-width:760px){
.editor-main .layout-options{grid-template-columns:minmax(0,1fr)}
.portfolio-bento .collection-items{grid-auto-rows:200px}
}
@media(max-width:480px){.portfolio-bento .collection-items{grid-auto-rows:min(330px,calc(100vw - 48px))}}

.editor-slots[data-layout=portfolio][data-style=brain]{grid-template-columns:minmax(0,1fr);max-width:none;gap:16px}
.editor-slots[data-layout=portfolio][data-style=brain] .editor-slot{display:grid;grid-template-columns:minmax(0,1fr) 220px}
.editor-slots[data-layout=portfolio][data-style=brain] .slot-picker{display:grid;grid-template-columns:26px 62px minmax(0,1fr);grid-template-rows:auto auto;gap:6px 14px;min-height:118px;padding:16px;text-align:left;align-items:center}
.editor-slots[data-layout=portfolio][data-style=brain] .slot-number{grid-column:1;grid-row:1/3;margin:0;position:static}
.editor-slots[data-layout=portfolio][data-style=brain] .slot-picker img,.editor-slots[data-layout=portfolio][data-style=brain] .slot-book{grid-column:2;grid-row:1/3;width:62px;height:82px;object-fit:contain}
.editor-slots[data-layout=portfolio][data-style=brain] .slot-title{grid-column:3;grid-row:1;font-size:16px}.editor-slots[data-layout=portfolio][data-style=brain] .slot-comment{grid-column:3;grid-row:2}
.editor-slots[data-layout=portfolio][data-style=brain] .slot-actions{grid-column:1/-1}
.brain-percentage{grid-column:2;grid-row:1;align-self:center;padding:12px 18px;margin:0}
.brain-adjuster{display:flex;align-items:center;gap:8px}
.brain-adjuster button{height:44px;width:44px;border:1px solid #ccc;background:#fff;font-size:23px;flex:none}
.brain-adjuster button:hover:not(:disabled){color:var(--red);border-color:var(--red)}
.brain-adjuster output{flex:1;text-align:center;font-size:22px;font-weight:700;color:var(--red);white-space:nowrap}
.editor-main .brain-percentage input[type=range]{accent-color:var(--red);padding:0;margin:0;border:0;background:transparent;height:44px;min-height:44px;width:100%}
.layout-portfolio.portfolio-brain .collection-details{background:#fff;padding:0}
.portfolio-brain .collection-items{display:block;max-width:880px;margin:auto}
.portfolio-brain .collection-item{display:grid;grid-template-columns:88px minmax(0,1fr);gap:24px;border-top:1px solid #ddd;padding:24px 0}
.portfolio-brain .collection-art{height:88px}.portfolio-brain .collection-art img{object-fit:contain}
.portfolio-brain .collection-art .piece-text strong{font-size:12px}.portfolio-brain .collection-info{padding:0}
.brain-work-heading{display:flex;align-items:center;gap:20px;justify-content:space-between}
.brain-work-heading h3{margin:0;font-size:18px}.brain-work-open{font:inherit;font-weight:700;border:0;padding:8px 0;background:none;text-align:left;cursor:pointer}
.brain-work-open:hover{color:var(--red)}.brain-share{font-size:32px;line-height:1.2;color:var(--red);white-space:nowrap}.brain-share small{font-size:14px;margin-left:3px}
@media(max-width:760px){
  .editor-profile{grid-template-columns:minmax(0,1fr);gap:20px}
  .brain-panel{padding:16px}.brain-toolbar p{font-size:15px}.brain-toolbar .text-button{font-size:12px;white-space:nowrap}
  .editor-slots[data-layout=portfolio][data-style=brain] .editor-slot{display:block}
  .editor-slots[data-layout=portfolio][data-style=brain] .slot-picker{grid-template-columns:46px minmax(0,1fr);gap:5px 10px;padding:12px;min-height:105px}
  .editor-slots[data-layout=portfolio][data-style=brain] .slot-number{display:none}
  .editor-slots[data-layout=portfolio][data-style=brain] .slot-picker img,.editor-slots[data-layout=portfolio][data-style=brain] .slot-book{grid-column:1;width:46px;height:65px}
  .editor-slots[data-layout=portfolio][data-style=brain] .slot-title,.editor-slots[data-layout=portfolio][data-style=brain] .slot-comment{grid-column:2}
  .editor-slots[data-layout=portfolio][data-style=brain] .slot-title{font-size:14px}
  .brain-percentage{padding:0 12px 10px;display:flex;gap:14px;align-items:center}.brain-adjuster{flex:0 0 156px}
  .brain-display-options span{font-size:14px}
  .brain-pattern-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .brain-design-heading .button{font-size:12px;padding:12px}
  .brain-section{margin-bottom:24px}.brain-section>.help{font-size:11px}
  .portfolio-brain .collection-item{grid-template-columns:58px minmax(0,1fr);gap:14px}.portfolio-brain .collection-art{height:70px}
  .brain-work-heading h3{font-size:16px}.brain-share{font-size:27px}
}
