:root { color-scheme: dark; }
* { box-sizing: border-box; }
body.photo-search { margin: 0; background: radial-gradient(ellipse at top right, #123442, transparent 55%), #061017; color: #f5f0e5; font-family: Arial, Helvetica, sans-serif; line-height: 1.65; }
.photo-search a { color: #91d9fc; text-underline-offset: .25em; }
.photo-search button, .photo-search input { font: inherit; }
.photo-search :focus-visible { outline: 3px solid #d4a84f; outline-offset: 5px; }
[hidden] { display: none !important; }
.ps-skip { position: absolute; left: -10000px; }
.ps-skip:focus { left: 1rem; top: 1rem; background: #061017; z-index: 3; padding: .7rem; }
.ps-header, .ps-main, .ps-footer { width: min(1120px, calc(100% - 3rem)); margin-inline: auto; }
.ps-header { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid #29404a; }
a.ps-brand { color: #f5f0e5; text-decoration: none; font-family: Georgia, serif; font-size: 1.8rem; font-weight: bold; letter-spacing: .08em; }
.ps-brand span { margin-left: .75rem; font-family: Arial, sans-serif; font-size: .7rem; font-weight: normal; letter-spacing: .03em; color: #9bb2bf; }
.ps-private { border: 1px solid #36515c; padding: .3rem .85rem; border-radius: 2rem; font-size: .75rem; color: #b7c8d2; }
.ps-main { min-height: calc(100vh - 200px); padding-bottom: 4rem; }
.ps-intro { padding: 4rem 0 2.5rem; }
.ps-intro--compact { padding-top: 3rem; }
.ps-eyebrow { color: #91d9fc; font-size: .75rem; font-weight: bold; letter-spacing: .18em; text-transform: uppercase; }
.ps-intro h1 { font-family: Georgia, serif; font-weight: normal; font-size: clamp(2.8rem, 6vw, 5.4rem); line-height: 1.03; letter-spacing: -.055em; margin: 1rem 0 1.5rem; }
.ps-intro h1 em { color: #d4a84f; font-style: normal; }
.ps-lead { max-width: 680px; font-size: 1.08rem; color: #b7c8d2; }
.ps-columns { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); gap: 2rem; align-items: start; }
.ps-panel { background: #0b202a; border: 1px solid #2b4856; border-radius: 1rem; padding: 2rem; }
.ps-panel h2, .ps-note h2 { font-family: Georgia, serif; font-size: 1.65rem; font-weight: normal; margin-top: 0; }
.ps-panel label:not(.ps-consent) { display: block; font-weight: bold; margin-bottom: .65rem; }
.ps-panel input[type=password], .ps-panel input[type=email] { display: block; width: 100%; padding: .9rem 1rem; background: #061017; border: 1px solid #527381; border-radius: .5rem; color: #fff; }
.ps-panel input[type=email] { margin-bottom: 1rem; }
.ps-help { font-size: .82rem; color: #a3bac6; line-height: 1.65; }
.ps-button { display: inline-flex; justify-content: center; align-items: center; gap: 1.25rem; padding: .85rem 1.4rem; border: 0; border-radius: 2rem; background: #91d9fc; color: #061017 !important; font-weight: bold; text-decoration: none; cursor: pointer; }
.ps-button:hover { background: #bee9fd; }
.ps-button:disabled { opacity: .65; cursor: wait; }
.ps-note { padding: 1rem .5rem; color: #a9bfca; }
.ps-note h2 { color: #f5f0e5; margin-top: .75rem; }
.ps-number { font-size: .72rem; letter-spacing: .15em; color: #d4a84f; }
.ps-note ol { padding-left: 1.25rem; }
.ps-note li { padding: .35rem 0; }
.ps-note p { font-size: .9rem; }
.ps-text-button { padding: .5rem 0; border: 0; background: none; color: #91d9fc; text-decoration: underline; text-underline-offset: .25em; cursor: pointer; }
.ps-message { padding: 1rem; border: 1px solid #7794a1; border-radius: .6rem; }
.ps-message--error { border-color: #c99965; color: #ffe4c3; background: #382d24; }
.ps-flow-step { margin: 0 0 1.1rem; color: #d4a84f; font-size: .7rem; font-weight: bold; letter-spacing: .13em; }
.ps-source-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.ps-source-card { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 1rem; min-height: 156px; padding: 1.3rem; border: 1px solid #527381; border-radius: .8rem; background: #071821; color: #f5f0e5; text-align: left; cursor: pointer; }
.ps-source-card svg { flex-shrink: 0; color: #91d9fc; }
.ps-source-card strong { display: block; font-size: 1rem; }
.ps-source-card small { display: block; margin-top: .35rem; color: #a9bfca; font-size: .8rem; line-height: 1.5; }
.ps-source-card:hover { background: #12303e; border-color: #91d9fc; }
.ps-source-card:disabled { opacity: .55; cursor: wait; }
.ps-source-help { margin: 1.1rem 0 0; }
.ps-photo-actions { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; margin: .25rem 0 .5rem; }
.ps-review-actions { margin-top: 1.5rem; padding-top: .25rem; border-top: 1px solid #29404a; }
.ps-button--outline { border: 1px solid #527381; background: #071821; color: #91d9fc !important; gap: .7rem; }
.ps-button--outline:hover { background: #17323f; }
.ps-button--outline svg { flex-shrink: 0; }
.ps-camera { min-width: 0; margin: 0; padding: 0; border: 0; }
.ps-camera legend { font-family: Georgia, serif; font-size: 1.4rem; color: #f5f0e5; }
.ps-camera-viewport { position: relative; isolation: isolate; width: min(100%, 420px); aspect-ratio: 1; overflow: hidden; margin: 1rem auto; border: 2px solid #91d9fc; border-radius: .6rem; background: #020608; }
.ps-camera-viewport video { display: block; width: 100%; height: 100%; object-fit: cover; }
.ps-camera-mirrored { transform: scaleX(-1); }
.ps-camera-guide { position: absolute; width: 62%; height: 78%; left: 19%; top: 11%; border: 2px solid #f5f0e5; border-radius: 50%; box-shadow: 0 0 0 100vmax #02060888; pointer-events: none; }
.ps-camera[data-guide-state="ready"] .ps-camera-viewport { border-color: #6de1a0; }
.ps-camera[data-guide-state="ready"] .ps-camera-guide { border: 3px solid #6de1a0; box-shadow: 0 0 0 100vmax #02060888, 0 0 18px #6de1a044; }
.ps-camera[data-guide-state="ready"] [data-camera-status] { color: #8cedb7; font-weight: bold; }
.ps-camera:is([data-guide-state="no-face"], [data-guide-state="multiple"], [data-guide-state="off-center"], [data-guide-state="too-small"], [data-guide-state="too-close"], [data-guide-state="steady"]) .ps-camera-guide { border-color: #d4a84f; }
.ps-camera:is([data-guide-state="low-light"], [data-guide-state="overexposed"], [data-guide-state="blurry"], [data-guide-state="moving"], [data-guide-state="low-resolution"], [data-guide-state="low-contrast"], [data-guide-state="noisy"]) .ps-camera-guide { border-color: #d4a84f; }
.ps-camera [data-camera-status] { min-height: 2.7em; }
.ps-camera-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.2rem; }
.ps-crop { min-width: 0; margin: 0; padding: 0; border: 0; }
.ps-crop legend { font-family: Georgia, serif; font-size: 1.4rem; color: #f5f0e5; }
.ps-crop-viewport { width: min(100%, 420px); margin: 1rem auto; border: 2px solid #91d9fc; border-radius: .6rem; overflow: hidden; background: #020608; }
.ps-crop-viewport canvas { display: block; width: 100%; height: auto; aspect-ratio: 1; cursor: grab; touch-action: none; }
.ps-crop-viewport canvas:active { cursor: grabbing; }
.ps-crop-viewport:focus-within { outline: 3px solid #d4a84f; outline-offset: 4px; }
.ps-crop-label { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; }
.ps-panel .ps-crop-label label { margin: 0; }
.ps-crop-label span { color: #a9bfca; font-size: .85rem; font-variant-numeric: tabular-nums; }
.ps-crop-controls { display: flex; align-items: center; gap: .8rem; margin: .6rem 0 .2rem; }
.ps-crop-controls input[type=range] { flex: 1; width: 0; min-width: 0; min-height: 44px; accent-color: #91d9fc; }
.ps-crop-step { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid #527381; border-radius: 50%; background: #071821; color: #91d9fc; font-size: 1.5rem !important; cursor: pointer; }
.ps-crop-step:hover { background: #17323f; }
.ps-crop-step:disabled { opacity: .45; cursor: default; }
.ps-consent { display: flex; align-items: flex-start; gap: .75rem; margin: 1.5rem 0; font-size: .9rem; }
.ps-consent input { margin-top: .35rem; width: 18px; height: 18px; flex-shrink: 0; accent-color: #91d9fc; }
.ps-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem 2rem; margin: 0 0 2rem; }
.ps-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.3rem; }
.ps-photo { border: 1px solid #294b5a; border-radius: .75rem; overflow: hidden; background: #0b202a; }
.ps-photo a { display: block; text-decoration: none; }
.ps-photo img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: contain; background: #020608; }
.ps-photo h2 { font-family: inherit; font-size: 1rem; padding: 1rem 1rem 0; margin: 0; }
.ps-photo > .ps-actions { padding: 1rem; margin: 0; gap: .75rem 1.2rem; }
.ps-photo [aria-pressed="true"] { color: #e6b44e; }
.ps-consent--optional { border-top: 1px solid #294b5a; padding-top: 1rem; font-size: .9rem; }
.ps-consent--optional strong { display: block; margin-bottom: .3rem; }
.ps-photo a > span { display: flex; justify-content: space-between; gap: .75rem; padding: 1rem; font-size: .9rem; overflow-wrap: anywhere; }
.ps-footer { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid #29404a; padding: 1.5rem 0; font-size: .8rem; color: #8da6b4; }
@media (max-width: 760px) { .ps-columns { grid-template-columns: 1fr; gap: 1.2rem; } .ps-results { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ps-intro { padding-top: 2.5rem; } }
@media (max-width: 480px) { .ps-header, .ps-main, .ps-footer { width: calc(100% - 2rem); } .ps-brand span { display: none; } .ps-panel { padding: 1.3rem; } .ps-results { grid-template-columns: 1fr; } .ps-footer { flex-direction: column; } .ps-intro h1 { font-size: 3.25rem; } }
@media (max-width: 520px) { .ps-source-options { grid-template-columns: 1fr; } .ps-source-card { flex-direction: row; justify-content: flex-start; align-items: center; min-height: 96px; padding: 1.1rem; } .ps-review-actions > .ps-button { width: 100%; } }
