/* Item layouts share the ship encyclopedia's palette, font and original textures. */
.dop-items{--item-gold:#d1b265;--item-paper:url('../images/brand/card-parchment-v2.webp');--item-rope:url('../images/brand/rope-long-full-width.webp');--dop-line:rgba(201,168,76,.33);--dop-shadow:rgba(0,0,0,.48);color:#f1e6cb;background:linear-gradient(90deg,#1c140dd1,#2a1f14c2,#1a130cdb),url('../images/brand/paper.jpg') center/1120px auto repeat;font:18px/1.6 'IM Fell English',Georgia,serif;min-height:100vh}
.dop-items,.dop-items *,.dop-items *::before,.dop-items *::after{box-sizing:border-box}
body:has(>.dop-items){margin:0;background:#17110c}
.dop-items [hidden]{display:none!important}
.dop-items a{color:inherit;text-decoration:none}
.dop-items :is(a,button,input,select):focus-visible{outline:3px solid #e4c46b;outline-offset:4px}
.dop-items img{display:block;max-width:100%}
.dop-items :is(h1,h2,h3){font-family:inherit;font-weight:400;letter-spacing:0;color:inherit;text-wrap:balance}
.dop-item-wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.dop-item-kicker{display:block;margin:0 0 14px;color:var(--item-gold)!important;font-size:.875rem;letter-spacing:.2em;text-transform:uppercase}
.dop-item-hero{position:relative;isolation:isolate;background:linear-gradient(90deg,rgba(9,6,4,.62) 0%,rgba(9,6,4,.34) 48%,transparent 78%),linear-gradient(rgba(60,60,60,.8),rgba(60,60,60,.8)),url('https://www.dawnofpiracy.com/wp-content/uploads/2026/09/the-hull-scaled.png') center/cover;border-bottom:1px solid #c9a84c}
.dop-item-hero::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 76% 48%,transparent 0 180px,#c9a84c21 181px 182px,transparent 183px),repeating-radial-gradient(circle at 76% 48%,transparent 0 44px,#c9a84c09 45px 46px)}
.dop-item-hero::after,.dop-item-category-hero::after{content:'';position:absolute;z-index:2;bottom:clamp(-29px,-1.225vw,-9px);inset-inline:0;height:clamp(18px,2.45vw,58px);background:var(--item-rope) center/100% 100% no-repeat;filter:drop-shadow(0 5px 5px #0009);pointer-events:none}
.dop-item-hero__layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:60px;align-items:center;min-height:580px;padding-block:75px 85px}
.dop-item-hero h1{font-size:clamp(3rem,7vw,6.8rem);line-height:.92;margin:0;text-shadow:0 4px 18px #000}
.dop-item-hero p{max-width:620px;color:#d7c9a9;font-size:1.2rem;margin:24px 0}
.dop-item-total{display:inline-block;border:1px solid #c9a84c55;padding:7px 14px;font-size:1rem;color:#dbc899;background:#0003}
.dop-item-logo{width:100%;filter:drop-shadow(0 15px 25px #0009)}
.dop-item-section{padding-block:76px 36px}
.dop-item-section>h2{font-size:clamp(2.2rem,4vw,3.7rem);line-height:1.1;margin:0 0 36px}
.dop-item-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.dop-item-card.dop-library-card{display:flex;flex-direction:column;position:relative;min-width:0;overflow:hidden;border:1px solid #a8864b77;background:#181512;box-shadow:0 18px 40px #0006;transition:transform .25s,box-shadow .25s}
.dop-item-card:hover{transform:translateY(-4px);box-shadow:0 22px 50px #0009}
.dop-item-card__image{aspect-ratio:16/10;background:radial-gradient(ellipse,#343230,#191919 75%);position:relative;display:grid;place-items:center;overflow:hidden}
/* Keep intrinsic square image sizes from expanding the grid beyond its frame. */
.dop-item-card__image img{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;padding:16px;object-fit:contain;object-position:center;transition:transform .35s}
.dop-item-card:hover img{transform:scale(1.03)}
.dop-item-card__body{position:relative;flex:1;display:flex;flex-direction:column;padding:28px 27px 24px;color:#2b1a0f;background:linear-gradient(#5c371b20,#3e251433),var(--item-paper) center/cover}
.dop-item-card__body::before{content:'';position:absolute;top:-12px;inset-inline:0;height:24px;background:url('../images/brand/rope-longer.png') center/100% 125px no-repeat;pointer-events:none;z-index:2}
.dop-item-eyebrow{font-size:.8rem;font-weight:bold;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;margin:0 0 12px}
.dop-item-card h3{font-size:2.15rem;line-height:1.05;margin:0 0 16px;overflow-wrap:anywhere}
.dop-item-card__body>p:not(.dop-item-eyebrow){margin:0 0 26px;font-size:1.05rem}
.dop-item-cta{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #4b2a1055;margin-top:auto;padding-top:15px;font-size:.875rem;text-transform:uppercase;letter-spacing:.12em;font-weight:bold}
.dop-item-badge{position:absolute;top:14px;left:14px;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;border:1px solid #d1b26577;padding:3px 9px;background:#17120de8;color:#e4c989}
.dop-item-unlisted{color:#c9b991;font-size:1.3rem;font-style:italic;border-block:1px solid #d1b26555;padding:20px}
.dop-item-all{margin-top:40px;border-top:1px solid #c9a84c55;padding-bottom:88px}
.dop-item-more{display:block;margin:32px auto 12px!important;min-height:48px;padding:12px 28px;border:1px solid #d1b26588;background:#30271d;color:#f1e6cb;cursor:pointer}.dop-item-more:hover{background:#493a26}
.dop-item-jumps{display:flex;flex-wrap:wrap;gap:24px;margin-top:24px;font-size:1rem}.dop-item-jumps a{border-bottom:1px solid #c9a84c77;padding-bottom:6px;color:#e4c989}
.dop-item-controls{display:flex;align-items:end;gap:16px;flex-wrap:wrap;border-block:1px solid #c9a84c55;padding:24px 0;margin:0 0 32px}
.dop-item-controls label{display:flex;flex-direction:column;gap:8px;font-size:.875rem;color:#d1b265;min-width:0}
.dop-item-search{flex:1;min-width:230px!important}
.dop-items :is(input,select,button){font:inherit;box-shadow:none;text-shadow:none;border-radius:0}
.dop-item-controls :is(input,select){height:48px;min-width:0;width:100%;border:1px solid #c9a84c66;background:#19150f;color:#f1e6cb;padding:10px 14px;margin:0}
.dop-item-controls input::placeholder{color:#c0b393;opacity:1}
.dop-item-controls button,.dop-item-viewer button{border:1px solid #b6975577;background:#30271d;color:#f1e6cb;min-height:48px;padding:10px 18px;cursor:pointer;margin:0}
.dop-item-controls button:hover,.dop-item-viewer button:hover{background:#493a26}
.dop-item-controls>p{width:100%;margin:0;color:#c9b991;font-size:.95rem}
.dop-item-empty,.dop-item-notice{border:1px solid #c9a84c55;background:#1a140f80;padding:40px;color:#d7c9a9}
.dop-item-notice{margin-bottom:70px}.dop-item-notice h2{margin:0 0 20px;font-size:2.5rem}
.dop-item-notice a{color:#e4c989;text-decoration:underline}
.dop-item-breadcrumb{display:flex;flex-wrap:wrap;gap:8px 14px;padding-block:48px 28px;color:#c9b991;font-size:.95rem}
.dop-item-breadcrumb a:hover,.dop-item-next a:hover{color:#f5d685;text-decoration:underline}
.dop-item-category-hero{position:relative;padding:44px 0 54px;background:radial-gradient(ellipse at 80% 50%,#68533133,transparent 60%),#0e0d0ba6;border-top:1px solid #c9a84c33}
.dop-item-category-hero h1{font-size:clamp(3.2rem,6vw,5.8rem);line-height:1;margin:0 0 22px}
.dop-item-category-hero p:not(.dop-item-kicker){font-size:1.2rem;color:#d7c9a9;max-width:670px}
.dop-item-category-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:50px}
.dop-item-category-nav a{padding:8px 14px;border:1px solid #c9a84c44;font-size:.95rem}
.dop-item-category-nav a:hover,.dop-item-category-nav a[aria-current]{background:#d1b265;color:#21180d}
.dop-item-detail{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:42px;padding-block:20px 72px;align-items:start}
.dop-item-stage{position:relative;aspect-ratio:4/3;display:grid;place-items:center;background:radial-gradient(ellipse,#353332,#191919 75%);border:1px solid #a8864b77;box-shadow:0 18px 45px #0006}
.dop-item-stage img{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;padding:clamp(16px,2vw,28px);object-fit:contain;object-position:center}
.dop-item-record{padding:42px 36px;color:#2b1a0f;background:linear-gradient(#5c371b12,#3e251426),var(--item-paper) center/cover;box-shadow:0 16px 45px #0005}
.dop-item-record h1{font-size:clamp(2.5rem,4vw,4rem);line-height:1.02;margin:0 0 26px;overflow-wrap:anywhere}
.dop-item-description{font-size:1.2rem;line-height:1.75;margin:0 0 30px}
.dop-item-record dl{margin:0 0 30px}.dop-item-record dl>div{display:grid;grid-template-columns:1fr 1.3fr;gap:14px;border-top:1px solid #4b2a1033;padding:12px 0}
.dop-item-record dt{font-size:.95rem;color:#634221}.dop-item-record dd{margin:0}
.dop-item-gallery{margin-top:26px}.dop-item-gallery>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dop-item-gallery a{position:relative;aspect-ratio:4/3;display:grid;place-items:center;border:1px solid #c9a84c55;background:#191919;cursor:zoom-in}
.dop-item-gallery img{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;padding:8px;object-fit:contain;object-position:center}
.dop-item-next{display:flex;justify-content:space-between;gap:24px;align-items:center;border-top:1px solid #c9a84c55;padding-block:30px 60px}
.dop-item-next a:last-child{text-align:right;font-size:1.5rem}.dop-item-next span{display:block;color:#c9b991;font-size:.8rem;text-transform:uppercase;letter-spacing:.15em;margin-bottom:8px}
.dop-item-viewer{position:fixed;inset:0;margin:auto;padding:0;width:min(1120px,calc(100% - 40px));height:min(850px,calc(100dvh - 40px));max-width:none;max-height:none;border:1px solid #b69755;background:#15120e;color:#f1e6cb;font:1rem/1.5 'IM Fell English',Georgia,serif;box-shadow:0 20px 80px #000b}
.dop-item-viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.dop-item-viewer::backdrop{background:#070605e8}
.dop-item-viewer header,.dop-item-viewer footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 20px}
.dop-item-viewer header{border-bottom:1px solid #b6975555}.dop-item-viewer header>span{color:#d1b265;letter-spacing:.12em;text-transform:uppercase}
.dop-item-viewer figure{display:grid;place-items:center;min-height:0;overflow:hidden;margin:0;background:#090a0b}.dop-item-viewer figure>*{grid-area:1/1}
.dop-item-viewer figure img{width:100%;height:100%;object-fit:contain;min-height:0}.dop-item-viewer figure p{padding:24px;text-align:center}.dop-item-viewer figure p:empty{display:none}
.dop-item-viewer footer{border-top:1px solid #b6975555}.dop-item-viewer footer div{text-align:center}.dop-item-viewer footer p{margin:0 0 6px}.dop-item-viewer footer a{color:#d1b265;text-decoration:underline}
@media(max-width:1000px){.dop-item-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dop-item-detail{gap:24px}.dop-item-record{padding:30px 24px}.dop-item-hero__layout{gap:28px}}
@media(max-width:700px){.dop-item-wrap{width:calc(100% - 32px)}.dop-item-hero__layout{grid-template-columns:1fr;gap:34px;min-height:0;padding-block:50px 60px}.dop-item-hero h1{font-size:clamp(2.7rem,11vw,4.4rem)}.dop-item-logo{width:220px}.dop-item-grid{grid-template-columns:1fr}.dop-item-section{padding-block:50px 24px}.dop-item-all{padding-bottom:54px}.dop-item-detail{grid-template-columns:1fr;gap:30px;padding-bottom:48px}.dop-item-record{padding:30px 24px}.dop-item-breadcrumb{padding-block:36px 22px}.dop-item-gallery>div{grid-template-columns:repeat(3,minmax(0,1fr))}.dop-item-controls label{width:100%}.dop-item-controls button{width:100%}.dop-item-next{align-items:start;flex-direction:column}.dop-item-next a:last-child{text-align:left}.dop-item-category-nav{gap:8px}.dop-item-category-nav a{padding:8px 10px}.dop-item-viewer{width:calc(100% - 16px);height:calc(100dvh - 20px)}.dop-item-viewer header,.dop-item-viewer footer{padding:10px;gap:8px}.dop-item-viewer button{padding:10px;min-width:44px}.dop-item-viewer footer button span{display:none}.dop-item-viewer footer div{font-size:.875rem}.dop-item-notice{padding:28px}}
@media(prefers-reduced-motion:reduce){.dop-items *,.dop-items *::before{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
