/* A printed civic dossier: Song type, vermilion rules, and a gilt portrait card.
   The photographic layers are owned by civil-visuals.css. */
body[data-assessment="civil"]{--radius-control:2px;--radius-panel:2px;--radius-stage:2px;--card-ink:#f3dfb9;--card-muted:#dbc6a4;--foil-tone-47:#f3dfb9;--foil-tone-48:#fff0ce;--foil-tone-49:#ead6b6;--foil-tone-50:#e7d1b5}
body[data-assessment="civil"] .page{max-width:1248px}
.civil-nav .brand{font:650 20px/1.5 var(--serif);letter-spacing:.12em}
.civil-nav .seal{background:var(--accent);color:#fff7ec;border:0;outline:1px solid var(--accent);outline-offset:3px;width:30px;height:30px;font-size:20px}
.civil-nav .nav-caption{font-size:11px;letter-spacing:.08em;margin-left:auto}
.civil-nav-entry{display:flex;align-items:center;justify-content:center;gap:18px;min-height:44px;padding:10px 17px;margin-left:24px;background:transparent;color:var(--accent);border:1px solid var(--accent);font-size:12px;border-radius:2px}
body[data-assessment="civil"] :is(button,a,summary){transition:background-color .18s,color .18s,border-color .18s}
body[data-assessment="civil"] .document-meta{font-size:11px;letter-spacing:.13em}
body[data-assessment="civil"] .hero-topic{font-weight:600;letter-spacing:.01em;line-height:1.55}
body[data-assessment="civil"] .hero .intro{max-width:470px;font-size:16px;line-height:2.05;color:#534b48}
body[data-assessment="civil"] .meta{max-width:470px;gap:0;padding:18px 0;margin:26px 0;border-color:#a9988959}
body[data-assessment="civil"] .meta span{font-size:12px;color:#655b54}
body[data-assessment="civil"] .meta b{font:500 34px/1.3 var(--serif);color:var(--accent)}
body[data-assessment="civil"] .meta span:last-child b{font-size:21px;line-height:2.1}
body[data-assessment="civil"] .test-entry{max-width:470px}
body[data-assessment="civil"] .test-entry>label{display:block;font-size:12px;line-height:1.8;color:#655b54;margin-bottom:8px}
body[data-assessment="civil"] .entry-row{grid-template-columns:minmax(0,1fr)}
body[data-assessment="civil"] .entry-row:has(input:not([type="hidden"])){grid-template-columns:120px minmax(0,1fr);gap:10px}
body[data-assessment="civil"] .entry-row button{width:100%;min-height:54px;letter-spacing:.12em;font-size:15px}
body[data-assessment="civil"] .entry-browse{max-width:470px;margin-top:12px}
body[data-assessment="civil"] .entry-browse .secondary{width:100%;min-height:44px;font-size:12px;background:#fffaf2b3;border-color:#b8a798}
body[data-assessment="civil"] .hero-stage{border-radius:2px;border:1px solid #ad978472;padding:22px 25px;background:transparent;box-shadow:none;position:relative}
body[data-assessment="civil"] .stage-heading{padding-bottom:20px;border-bottom:1px solid #b9a48e70;font-size:10px;color:#736350}
body[data-assessment="civil"] .stage-heading b{font:600 15px var(--serif);color:#5a3e36;letter-spacing:.08em}
body[data-assessment="civil"] .hero .card-area{transform:none;padding-top:24px}
body[data-assessment="civil"] .hero .foilcard{width:292px}
body[data-assessment="civil"] .stage-next{font-size:12px;min-height:44px;margin-top:8px}
body[data-assessment="civil"] .foilcard{border-radius:3px;box-shadow:0 22px 36px -18px #471e28a6,0 3px 7px #37201840,0 0 0 1px #af8b59;container-type:inline-size}
body[data-assessment="civil"] .card-face{border-radius:3px;background:radial-gradient(ellipse at 45% 30%,#652832,#2b1119 85%);border:1px solid #b89567}
body[data-assessment="civil"] .card-front::after{inset:7px;border-color:#dbc49b45;border-radius:0}
body[data-assessment="civil"] .fallback-art{filter:sepia(.35);opacity:.9}
body[data-assessment="civil"] .fallback-foil{background:linear-gradient(118deg,transparent 25%,#e4b37815 43%,#f8e7ac38 48%,transparent 65%),repeating-linear-gradient(135deg,transparent 0 4px,#f5dcab04 4px 5px)}
body[data-assessment="civil"] .card-top{top:6.4%;left:9%;right:9%;font:500 2.7cqw/1.5 var(--body);letter-spacing:.09em;color:#edd7b4}
body[data-assessment="civil"] .card-edition{top:12%;left:9%;font:2.25cqw/1.5 Georgia,serif;letter-spacing:.22em;color:#d8be99;opacity:.9}
body[data-assessment="civil"] .card-serial{top:16%;right:9%;font:italic 9cqw/1 Georgia,serif;color:#e6c79b;opacity:.6}
body[data-assessment="civil"] .card-insignia{top:61.5%;font:2.7cqw/1.6 var(--serif);letter-spacing:.25em;color:#dec29a;opacity:1}
body[data-assessment="civil"] .card-title{top:67%;font:600 8.4cqw/1.4 var(--serif);letter-spacing:.08em;color:#f7e6c8;text-shadow:none}
body[data-assessment="civil"] .card-direction{top:76%;font:3cqw/1.7 var(--body);color:#e0c5a0;letter-spacing:0;opacity:1}
body[data-assessment="civil"] .card-quote{top:82%;left:11%;right:11%;font:3.45cqw/1.8 var(--serif);color:#e5d2b7;opacity:1}
body[data-assessment="civil"] .card-bottom{bottom:5%;left:9%;right:9%;font:2.2cqw/1.5 var(--body);letter-spacing:.1em;color:#d5b992;opacity:1}
body[data-assessment="civil"] .card-back{padding:9%;gap:4%;color:#f3dfb9;background:#421d25}
body[data-assessment="civil"] .card-back::after{inset:10px;border-color:#d6b7855c;border-radius:0}
body[data-assessment="civil"] .card-back .eyebrow{font-size:2.8cqw;color:#dac39c;letter-spacing:.08em}
body[data-assessment="civil"] .card-back-emblem{width:21%;height:auto;flex:0 0 auto;color:#e9cfa1}
body[data-assessment="civil"] .card-back h3{font:600 7.3cqw/1.5 var(--serif);color:#fff0d4}
body[data-assessment="civil"] .card-back p{font:3.7cqw/1.9 var(--serif);color:#ebd8bc}
body[data-assessment="civil"] .card-tags span{font-size:2.9cqw;color:#efd6ac;border-color:#c9a57970;padding:4px 6px}
body[data-assessment="civil"] .card-controls{gap:22px;margin-top:18px}
body[data-assessment="civil"] .card-controls .text-btn{font-size:12px;min-height:44px;color:#794841}
body[data-assessment="civil"] .card-hint{font-size:11px;color:#746052;line-height:1.8}
body[data-assessment="civil"] .type-tile{padding:24px 0;gap:17px;transition:background-color .2s}
body[data-assessment="civil"] .type-tile h3{font-weight:600;font-size:24px;letter-spacing:.05em}
body[data-assessment="civil"] .type-tile p{font-size:12px;line-height:1.8;color:#655b54}
body[data-assessment="civil"] .tile-art{border-radius:0;border-color:#ab776e6b;background:#fbf6ebc7;color:#944237}
body[data-assessment="civil"] .type-tile button{border:0;background:transparent;font-size:12px;text-decoration:underline;text-underline-offset:7px}
body[data-assessment="civil"] .type-tile:hover{background:#fffaf166}
body[data-assessment="civil"] .home-bottom h3{font:600 21px/1.6 var(--serif);margin-bottom:10px}
body[data-assessment="civil"] .home-bottom p{font-size:14px;line-height:2;color:#60554e}
body[data-assessment="civil"] .quiz-wrap{max-width:800px}
body[data-assessment="civil"] .question-card{border:1px solid #c6b9aa;border-top:3px double #98443b;border-radius:1px;background:#fffcf5;box-shadow:5px 7px 0 #e5dfd4;padding:34px 38px}
body[data-assessment="civil"] .question-label{color:#93453c;background:transparent;padding:0 0 10px;border-bottom:1px solid #d9c9b7;display:block;font-size:12px;letter-spacing:.12em}
body[data-assessment="civil"] .question-card h1{font-family:var(--serif);font-weight:600;line-height:1.75}
body[data-assessment="civil"] .context{border-radius:0;border:0;border-left:2px solid #b18c67;background:#f1ece1;font-size:15px;line-height:1.9}
body[data-assessment="civil"] .option{border-radius:0;border-color:#d3c5b4;background:transparent;box-shadow:none;min-height:68px}
body[data-assessment="civil"] .option .letter{font-family:Georgia,serif;border-radius:0;border-color:#baa18d;color:#8e3a34}
body[data-assessment="civil"] .option .label{font-size:16px;line-height:1.75}
body[data-assessment="civil"] .option.selected{background:#f5e7dd;border-color:#9b4a40;box-shadow:inset 3px 0 #9b4a40}
body[data-assessment="civil"] .result-grid{gap:48px;border-top:1px solid #b8a591;padding-top:32px}
body[data-assessment="civil"] .card-shelf{background:#e7ded0;border:1px solid #cab9a2;border-radius:1px;padding:23px 15px}
body[data-assessment="civil"] .result-aside .foilcard{width:278px}
body[data-assessment="civil"] .report-block h2{font-size:25px;font-weight:600;letter-spacing:.035em}
body[data-assessment="civil"] .report-block p{font-size:16px;line-height:2.1;color:#514842}
body[data-assessment="civil"] .report-prose{counter-reset:chapter}
body[data-assessment="civil"] .report-prose .report-block h2::before{counter-increment:chapter;content:"0" counter(chapter) " / ";font:12px/1 Georgia,serif;letter-spacing:.08em;color:#a37554;margin-right:8px}
body[data-assessment="civil"] .rec-item{border-radius:1px;background:#fcf8ef;border-color:#d0c0ab;box-shadow:none}
body[data-assessment="civil"] .rec-item:first-child{background:#f4e9da;border-color:#ac7a5f}
body[data-assessment="civil"] .rec-title{font-size:23px;font-weight:600}
body[data-assessment="civil"] .rec-reason{font-size:15px;line-height:1.95}
body[data-assessment="civil"] .rec-intro{font-size:14px;line-height:1.95}
body[data-assessment="civil"] .current-downloads{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0 0 20px;padding-bottom:12px;border-bottom:1px solid #d0c0ab}
body[data-assessment="civil"] .current-downloads a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 8px;color:#802b29;font-size:14px;text-underline-offset:4px;cursor:pointer}
body[data-assessment="civil"] .current-downloads a:focus-visible{outline:3px solid #802b29;outline-offset:4px}
body[data-assessment="civil"] .job-record-current{padding:0 12px;background:#f4e9da;border-left:3px solid #912c2b}
body[data-assessment="civil"] .job-record-current .job-identity>span{padding:3px 8px;background:#802b29;color:#fffaf0;border-radius:2px}
body[data-assessment="civil"] .save-actions{gap:9px}
body[data-assessment="civil"] .save-actions button{min-height:48px;font-size:13px;border-radius:1px}
body[data-assessment="civil"] .secondary-type{background:transparent;border-radius:0;border:0;border-top:1px solid #bfa88d;padding:20px 0}
body[data-assessment="civil"] .share-viewer{border-radius:2px}
body[data-assessment="civil"] #viewer{max-height:calc(100svh - 24px);overflow:auto;padding:38px 30px 20px}
body[data-assessment="civil"] #viewer .foilcard{width:min(328px,calc((100svh - 190px)*.714),calc(100vw - 90px))}
body[data-assessment="civil"] #viewer .card-area{transform:none;padding-top:12px}
body[data-assessment="civil"] #viewer .card-controls .text-btn{color:#efd8b4;background:transparent}
body[data-assessment="civil"] #viewer .card-controls .text-btn:hover{background:#f0d6a61a}
body[data-assessment="civil"] #viewer .card-hint{color:#d3ba98}
body[data-assessment="civil"] #viewer .modal-label{color:#e0c8a6}
body[data-assessment="civil"] .close-viewer{min-width:44px;min-height:44px}
@media(max-width:900px) and (min-width:768px){
 body[data-assessment="civil"] .hero{gap:25px;grid-template-columns:1fr 1fr}
 body[data-assessment="civil"] .hero-stage{padding:19px 16px}
 body[data-assessment="civil"] .hero .foilcard{width:250px}
 body[data-assessment="civil"] .result-grid{gap:25px;grid-template-columns:280px minmax(0,1fr)}
 body[data-assessment="civil"] .result-aside .foilcard{width:240px}
}
@media(max-width:767px){
 .civil-nav .brand{font-size:17px}
 .civil-nav-entry{margin-left:0;padding:10px 12px;gap:8px;background:var(--accent);color:#fffaf0;border-color:var(--accent);font-size:12px}
 body[data-assessment="civil"] .document-meta{font-size:10px;letter-spacing:.02em}
 body[data-assessment="civil"] .hero .intro{font-size:15px;line-height:1.9}
 body[data-assessment="civil"] .meta{margin:16px 0;padding:14px 0}
 body[data-assessment="civil"] .meta b{font-size:29px}
 body[data-assessment="civil"] .meta span{font-size:11px}
 body[data-assessment="civil"] .meta span:last-child b{font-size:18px}
 body[data-assessment="civil"] .test-entry{padding:14px;background:#fffaf0d6;border-color:#b8a390;border-top:2px solid var(--accent)}
 body[data-assessment="civil"] .test-entry>label{margin:0;font-size:12px}
 body[data-assessment="civil"] .entry-row button{min-height:50px;font-size:15px}
 body[data-assessment="civil"] .entry-row:has(input:not([type="hidden"])){grid-template-columns:110px minmax(0,1fr)}
 body[data-assessment="civil"] .hero-stage{grid-template-columns:102px minmax(0,1fr);padding:18px;gap:8px 22px;background:transparent;border-color:#bba68d}
 body[data-assessment="civil"] .hero .card-area{padding:0;transform:none}
 body[data-assessment="civil"] .hero-stage .foilcard{width:247px}
 body[data-assessment="civil"] .stage-heading{border:0;padding:0}
 body[data-assessment="civil"] .stage-heading b{font-size:19px}
 body[data-assessment="civil"] .stage-next{margin:0;font-size:12px}
 body[data-assessment="civil"] .type-tile{padding:21px 0;gap:13px}
 body[data-assessment="civil"] .type-tile h3{font-size:23px}
 body[data-assessment="civil"] .type-tile button{text-decoration:none;font-size:0}
 body[data-assessment="civil"] .type-tile p{font-size:13px;line-height:1.7}
 body[data-assessment="civil"] .question-card{padding:23px 18px}
 body[data-assessment="civil"] .question-card h1{font-size:22px;line-height:1.7}
 body[data-assessment="civil"] .context{font-size:15px}
 body[data-assessment="civil"] .option{min-height:66px;padding:13px 11px}
 body[data-assessment="civil"] .option .label{font-size:15px;line-height:1.7}
 body[data-assessment="civil"] .result-grid{gap:30px;padding-top:22px}
 body[data-assessment="civil"] .result-aside{display:block}
 body[data-assessment="civil"] .card-shelf{padding:24px 14px 14px}
 body[data-assessment="civil"] .result-aside .card-area{position:relative;width:auto;height:auto;perspective:1000px;transform:none;padding:0}
 body[data-assessment="civil"] .result-aside .foilcard{position:relative;inset:auto;max-width:100%;width:min(285px,calc(100vw - 85px));transform:none!important;transform-origin:center}
 body[data-assessment="civil"] .result-aside :is(.card-controls,.card-hint){display:flex;justify-content:center}
 body[data-assessment="civil"] .save-actions{display:grid;grid-template-columns:1fr 1fr;margin:16px 0;max-width:none}
 body[data-assessment="civil"] .save-actions .share-entry{grid-column:1/-1}
 body[data-assessment="civil"] .secondary-type{margin-top:24px}
 body[data-assessment="civil"] .report-block h2{font-size:23px}
 body[data-assessment="civil"] .report-block p{font-size:16px;line-height:2.05}
 body[data-assessment="civil"] .rec-reason{font-size:15px}
 body[data-assessment="civil"] #viewer{padding:38px 20px 15px}
}
@media(max-width:767px) and (max-height:700px){
 body[data-assessment="civil"] .question-card{padding:17px 14px}
 body[data-assessment="civil"] .question-card h1{font-size:19px;line-height:1.5;margin:12px 0}
 body[data-assessment="civil"] .context{font-size:13px;line-height:1.6;padding:10px}
 body[data-assessment="civil"] .options{gap:7px;margin-top:12px}
 body[data-assessment="civil"] .option{min-height:48px;padding:8px 10px}
 body[data-assessment="civil"] .option .label{font-size:14px;line-height:1.5}
}
