/* R170.1 — all components inherit current Đạo Quán brand tokens.
 * Component namespace tr- prevents cascade into existing routes. */
:root{--dq-tarot-card-ratio:7/12;--dq-tarot-card-width:70px;--dq-tarot-deck-height:154px;--dq-tarot-motion-orbit:60s;--dq-tarot-motion-reveal:460ms}
.home-page .tr-feature-tile{position:relative;overflow:hidden;background:none!important}.tr-feature-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.tr-feature-tile:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,var(--dq-color-bg))}.home-page .tr-feature-tile b{position:absolute;bottom:7px;left:3px;right:3px;z-index:1;color:var(--dq-color-on-dark);font:700 11px/1.4 var(--dq-font-body);text-align:center;text-shadow:0 2px 4px #000;white-space:normal}.tr-feature-tile>svg{z-index:2}
.tr-content{display:flex;flex-direction:column;gap:var(--dq-space-4);padding-bottom:var(--dq-space-6)}.tr-content .dq-stack{gap:var(--dq-space-4)}.tr-content p{font-size:14px;line-height:1.8}.tr-content h2{line-height:1.4}.tr-content h3{font-size:18px;line-height:1.5}.tr-content h4{font:700 14px/1.6 var(--dq-font-body);margin:0 0 6px;color:var(--dq-color-text)}.tr-content .dq-card{min-width:0;overflow-wrap:break-word}.tr-capsule{display:flex;justify-content:center;margin:0 0 2px}.tr-capsule .dq-chip{width:max-content;gap:8px;white-space:nowrap;padding:9px 18px;min-height:44px;color:var(--dq-color-accent-soft);background:var(--dq-color-button-gradient);border-color:var(--dq-color-border);box-shadow:var(--dq-shadow-control);font-size:13px}.tr-zodiac-link{text-decoration:none;cursor:pointer}.tr-content .tr-eyebrow{font:700 10px/1.6 var(--dq-font-body);letter-spacing:1.4px;color:var(--dq-color-neutral)}.tr-content .tr-muted{color:var(--dq-color-muted);font-size:12px;line-height:1.75}.tr-heading h2{margin:4px 0 6px}.tr-intro-top{display:flex;align-items:center;gap:var(--dq-space-3);margin-bottom:var(--dq-space-4)}.tr-intro-top img{width:90px;height:90px;object-fit:cover;border-radius:var(--dq-radius-card);border:1px solid var(--dq-color-border);box-shadow:var(--dq-shadow-control)}.tr-intro-top>div{min-width:0}.tr-intro h2{margin:4px 0 6px}.tr-intro-count{font-size:10px;color:var(--dq-color-neutral)}.tr-intro>p+p{margin-top:var(--dq-space-3)}
.tr-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:4px;gap:4px;background:var(--dq-color-bg);border:1px solid var(--dq-color-border);border-radius:var(--dq-radius-pill);box-shadow:var(--dq-shadow-control)}.tr-tabs button{min-width:0;min-height:44px;padding:8px 3px;border:0;border-radius:var(--dq-radius-pill);background:none;color:var(--dq-color-accent-soft);font:700 12px/1.4 var(--dq-font-body);white-space:nowrap}.tr-tabs button[aria-selected=true]{background:var(--dq-color-chip-gradient);color:var(--dq-color-text)}
.tr-form-card>summary{cursor:pointer;font-weight:700;min-height:44px;display:list-item;padding-block:8px}.tr-form-card[open]>summary{margin-bottom:var(--dq-space-3)}.tr-form-card fieldset{display:grid;gap:var(--dq-space-4);min-width:0;border:0;padding:0;margin:0}.tr-form-card fieldset[disabled]{opacity:.8}.tr-topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--dq-space-2)}.tr-topics .dq-button{font-size:12px;padding-inline:5px;min-width:0}.tr-content .dq-input{font-size:16px;font-weight:400}.tr-content textarea{resize:vertical;min-height:100px;line-height:1.7}.tr-spread-options{display:grid;gap:var(--dq-space-2)}.tr-spread-options .dq-button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:4px;padding:12px 14px;line-height:1.6}.tr-spread-options b{font-size:13px}.tr-spread-options small{font-size:11px;font-weight:400}.tr-check{display:flex;align-items:flex-start;gap:10px;font-size:13px;cursor:pointer}.tr-check input{width:20px;height:20px;margin:3px 0;accent-color:var(--dq-color-bg);flex:none}.tr-check small{display:block;color:var(--dq-color-muted);font-weight:400;font-size:11px;line-height:1.7;margin-top:4px}.tr-content .tr-primary{width:100%;min-height:48px;background:var(--dq-color-button-gradient);color:var(--dq-color-accent-soft)}.tr-content .tr-private{font-size:11px;color:var(--dq-color-muted);text-align:center;line-height:1.7}.tr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.tr-deck-panel,.tr-spread-map{position:relative;isolation:isolate;border:1px solid var(--dq-color-border);border-radius:var(--dq-radius-panel);background:radial-gradient(ellipse at 50% 35%,#23465b88,transparent 70%),var(--dq-color-bg);overflow:hidden;padding:var(--dq-space-4);color:var(--dq-color-on-dark)}.tr-orbit{position:absolute;z-index:-1;width:290px;height:290px;top:20px;left:calc(50% - 145px);border:1px solid #d4a96938;border-radius:50%;pointer-events:none;animation:tr-orbit var(--dq-tarot-motion-orbit) linear infinite;contain:layout paint}.tr-orbit:before,.tr-orbit:after{content:"";position:absolute;inset:16px;border:1px dashed #d4a96938;border-radius:50%}.tr-orbit:after{inset:40px;border-style:solid;opacity:.45}.tr-orbit>span{position:absolute;top:-12px;left:calc(50% - 7px);color:var(--dq-color-accent);font-size:19px}.tr-deck-top{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap;font-size:12px;font-weight:700}.tr-motion{display:inline-flex;align-items:center;gap:5px;min-height:44px;border:0;background:none;color:var(--dq-color-accent-soft);font:400 10px/1.5 var(--dq-font-body);padding:6px;cursor:pointer}.tr-deck-tools{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-block:8px}.tr-deck-tools>span{font-size:10px;text-align:center;color:var(--dq-color-accent-soft)}.tr-deck-tools .dq-button{width:44px;flex:none;padding:0;min-height:44px}.tr-deck{display:flex;align-items:center;gap:10px;overflow-x:auto;overflow-y:hidden;padding:14px 3px 18px;margin-inline:-3px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--dq-color-border) transparent;overscroll-behavior-x:contain;touch-action:pan-x pan-y;min-height:var(--dq-tarot-deck-height)}.tr-deck-card{position:relative;flex:none;width:var(--dq-tarot-card-width);height:120px;padding:0;border:1px solid var(--dq-color-border);border-radius:9px;color:var(--dq-color-accent-soft);background:var(--dq-color-deep);box-shadow:0 6px 9px #0006;scroll-snap-align:center;transition:transform var(--dq-motion-normal),opacity var(--dq-motion-normal);transform:rotate(-2deg);user-select:none;-webkit-user-select:none}.tr-deck-card:nth-child(3n){transform:rotate(2deg)}.tr-deck-card:nth-child(3n+1){transform:rotate(0)}.tr-deck-card:hover:not(:disabled){transform:translateY(-5px)}.tr-deck-card.is-picked{transform:translateY(-8px);border-width:2px;border-color:var(--dq-color-accent-soft);opacity:.45}.tr-deck-card:focus-visible{outline-offset:3px}.tr-back-art{position:absolute;inset:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid #d4a96988;border-radius:5px;background:radial-gradient(circle,#1a405766,transparent 75%),var(--dq-color-bg);color:var(--dq-color-accent-soft)}.tr-back-art:before{content:"";position:absolute;inset:4px;border:1px solid #d4a96940;border-radius:3px}.tr-back-art>span{font:700 6px/1.3 var(--dq-font-body);letter-spacing:1px}.tr-back-art>i{font-size:15px;font-style:normal}.tr-card-number{position:absolute;bottom:9px;left:0;right:0;font:700 8px/1.2 var(--dq-font-body)}.tr-selected-strip{display:flex;justify-content:center;gap:10px;margin-top:10px;padding-bottom:34px}.tr-slot{position:relative;width:44px;height:72px;border:1px dashed #d4a96988;border-radius:6px;display:grid;place-items:center;font-size:13px;flex:none}.tr-slot b{position:absolute;top:calc(100% + 6px);width:65px;left:calc(50% - 32px);text-align:center;color:var(--dq-color-accent-soft);font:400 9px/1.5 var(--dq-font-body)}.tr-slot .tr-back-art{inset:2px;gap:2px}.tr-slot .tr-back-art>svg{width:16px;height:16px}.tr-slot .tr-back-art>span{font-size:4px;letter-spacing:0}.tr-slot .tr-back-art>i{font-size:9px}.tr-slot-picked{border-style:solid}.tr-content .tr-deck-note{text-align:center;font-size:10px;color:var(--dq-color-accent-soft);margin:6px 0 16px}.tr-content .tr-reveal{width:100%;background:var(--dq-color-chip-gradient);color:var(--dq-color-text);min-height:48px}.tr-text-button{border:0;background:none;color:var(--dq-color-neutral);padding:8px 0;min-height:44px;font:700 12px/1.6 var(--dq-font-body);cursor:pointer}.tr-deck-panel>.tr-text-button{display:block;color:var(--dq-color-accent-soft);margin:3px auto 0;font-size:11px}
.tr-result-banner{padding:var(--dq-space-5) var(--dq-space-4);border:1px solid var(--dq-color-border);border-radius:var(--dq-radius-panel);background:var(--dq-color-button-gradient);color:var(--dq-color-on-dark)}.tr-result-banner .tr-eyebrow,.tr-result-banner .tr-muted{color:var(--dq-color-accent-soft)}.tr-result-banner blockquote{margin:14px 0 0;padding-left:12px;border-left:2px solid var(--dq-color-accent);font-size:14px;line-height:1.8}.tr-result-banner details{margin-top:14px;font-size:12px}.tr-result-banner summary{cursor:pointer;min-height:44px;padding-block:10px}.tr-result-banner p{font-size:12px}.tr-self-feeling{margin-top:8px!important;color:var(--dq-color-accent-soft)}.tr-results:focus{outline:0}.tr-spread-map{padding:22px 14px 8px}.tr-map-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:18px 10px;position:relative}.tr-map-card{width:calc((100% - 20px)/3);max-width:125px;border:0;background:none;padding:0;color:var(--dq-color-on-dark);min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;font:400 11px/1.4 var(--dq-font-body);text-align:center}.tr-map-count-1 .tr-map-card{width:140px;max-width:140px}.tr-map-card .tr-card-art{width:100%;box-shadow:0 5px 18px #0007;animation:tr-reveal var(--dq-tarot-motion-reveal) ease-out both}.tr-map-card:nth-child(2) .tr-card-art{animation-delay:80ms}.tr-map-card:nth-child(3) .tr-card-art{animation-delay:160ms}.tr-map-card:nth-child(4) .tr-card-art{animation-delay:240ms}.tr-map-card:nth-child(5) .tr-card-art{animation-delay:320ms}.tr-map-card small{font-size:9px;margin-top:3px;color:var(--dq-color-accent-soft);line-height:1.6}.tr-map-card b{font-size:11px;font-weight:700;line-height:1.6}.tr-map-card>span:last-child{font-size:9px;color:var(--dq-color-accent-soft)}.tr-spread-map>.tr-motion{display:flex;margin:8px auto 0}.tr-card-art{position:relative;display:block;aspect-ratio:var(--dq-tarot-card-ratio);overflow:hidden;border-radius:7px;border:1px solid var(--dq-color-border);background:var(--dq-color-surface);color:var(--dq-color-text)}.tr-card-art img{display:block;width:100%;height:100%;object-fit:contain}.tr-card-art.tr-reversed img{transform:rotate(180deg)}.tr-image-error{position:absolute;inset:0;display:grid;place-items:center;padding:6px;font-size:10px;line-height:1.6;text-align:center}.tr-context,.tr-reflection{padding:12px;border:1px solid #bd946244;border-radius:var(--dq-radius-control);background:#fffdfa70}.tr-context h3{font-size:15px;margin-bottom:5px}.tr-reading-head{display:flex;gap:var(--dq-space-4);align-items:center}.tr-reading-head>.tr-card-art{width:90px;flex:none}.tr-reading-head>div{min-width:0}.tr-reading-head h3{font:700 22px/1.4 var(--dq-font-display);margin:4px 0}.tr-content .tr-en{font-size:11px;color:var(--dq-color-muted)}.tr-orientation{display:inline-flex;margin-top:8px;border:1px solid var(--dq-color-border);border-radius:var(--dq-radius-pill);padding:2px 8px;font-size:10px;color:var(--dq-color-neutral)}.tr-content .tr-keywords{font-size:12px;line-height:1.6;margin-top:7px;color:var(--dq-color-neutral)}.tr-reading-block{margin-top:var(--dq-space-4);padding-top:var(--dq-space-3);border-top:1px solid #bd946240}.tr-reading-block p+p{margin-top:8px}.tr-inner{border-left:2px solid var(--dq-color-border);padding-left:12px}.tr-reflection{margin-top:var(--dq-space-4)}.tr-reflection small{font-size:9px;letter-spacing:1.3px;color:var(--dq-color-neutral)}.tr-reflection p{margin-top:5px}.tr-action-list{display:grid;gap:12px;padding-left:22px;margin:0;line-height:1.8;font-size:14px}.tr-action-list li::marker{color:var(--dq-color-neutral);font-weight:700}.tr-journal summary{font-weight:700;cursor:pointer;min-height:44px;padding-block:10px}.tr-journal ul{padding-left:20px;display:grid;gap:12px;font-size:13px;line-height:1.8}.tr-result-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tr-result-actions>.tr-primary{grid-column:1/-1}.tr-result-actions>.dq-button{font-size:12px;padding-inline:5px}.tr-content .tr-error{padding:12px 14px;border:1px solid var(--dq-color-bad);border-radius:var(--dq-radius-control);background:var(--dq-color-surface);color:var(--dq-color-bad);font-size:13px}.tr-content .tr-notice{padding:10px 12px;border:1px solid var(--dq-color-border);border-radius:var(--dq-radius-control);background:var(--dq-color-button-gradient);color:var(--dq-color-accent-soft);font-size:12px}.tr-filters{display:flex;gap:8px;overflow-x:auto;padding:3px}.tr-filters .dq-chip{flex:none;min-height:44px;font-size:11px;padding:6px 12px}.tr-filters .dq-chip[aria-pressed=true]{background:var(--dq-color-button-gradient);color:var(--dq-color-accent-soft)}.tr-library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}.tr-library-card{display:flex;flex-direction:column;gap:5px;min-width:0;border:0;padding:0;background:none;color:var(--dq-color-text);text-align:center}.tr-library-card>.tr-card-art{width:100%}.tr-library-card b{font-size:11px;line-height:1.6}.tr-library-card small{font-size:9px;color:var(--dq-color-muted);line-height:1.5}.tr-empty{padding:20px 0;text-align:center;color:var(--dq-color-muted);font-size:13px;grid-column:1/-1}.tr-empty p{margin-top:12px}.tr-history-card{border-top:1px solid var(--dq-color-border);padding-top:14px}.tr-history-card>small{font-size:10px;color:var(--dq-color-muted)}.tr-history-card h3{font-size:16px;margin-top:8px}.tr-history-card p{margin-top:8px;font-size:12px}.tr-history-card>div{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px}.tr-history-card .dq-button{font-size:12px}.tr-footer{color:var(--dq-color-accent-soft);font-size:11px!important;text-align:center;line-height:1.8}
.tr-dialog{width:min(92vw,430px);max-height:88dvh;margin:auto;border:1px solid var(--dq-color-border);border-radius:var(--dq-radius-panel);padding:20px;color:var(--dq-color-text);background:var(--dq-color-surface-gradient);font:400 14px/1.8 var(--dq-font-body);overflow-y:auto}.tr-dialog::backdrop{background:var(--dq-modal-backdrop)}.tr-dialog p{line-height:1.85;margin:0}.tr-dialog h2{font:700 24px/1.4 var(--dq-font-display);margin:4px 0}.tr-dialog h3{font:700 15px/1.6 var(--dq-font-body);margin:0 0 5px}.tr-dialog .tr-muted{font-size:11px;color:var(--dq-color-muted)}.tr-dialog .tr-eyebrow{font:700 10px/1.6 var(--dq-font-body);color:var(--dq-color-neutral)}.tr-dialog-close{position:sticky;top:0;margin-left:auto;display:block;z-index:2;width:44px;height:44px;border:1px solid var(--dq-color-border);border-radius:50%;background:var(--dq-color-surface);color:var(--dq-color-text);font-size:25px}.tr-dialog-art{width:160px;margin:0 auto 20px}.tr-dialog-art>.tr-card-art{width:100%}.tr-dialog .tr-heading{text-align:center}.tr-dialog .tr-keywords{color:var(--dq-color-neutral);font-size:12px;text-align:center;margin-top:8px}
@keyframes tr-orbit{to{transform:rotate(360deg)}}@keyframes tr-reveal{from{opacity:0;transform:translateY(8px) rotateY(-12deg)}to{opacity:1;transform:translateY(0) rotateY(0)}}
.tr-still .tr-orbit,.tr-still .tr-card-art,.tr-paused .tr-orbit{animation:none!important}.tr-paused .tr-card-art{animation-play-state:paused!important}
@media(max-width:359px){.home-page .tr-feature-tile b{font-size:9px}.tr-content .dq-card{padding:13px}.tr-intro-top img{width:72px;height:72px}.tr-intro-count{font-size:9px}.tr-reading-head{gap:12px}.tr-reading-head>.tr-card-art{width:75px}.tr-reading-head h3{font-size:19px}.tr-slot{width:38px;height:64px}.tr-selected-strip{gap:8px}.tr-slot b{width:52px;left:calc(50% - 26px);font-size:8px}.tr-result-actions>.dq-button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.tr-orbit,.tr-map-card .tr-card-art{animation:none!important}.tr-deck-card{transition:none!important}.tr-deck{scroll-behavior:auto}.tr-content{scroll-behavior:auto}}

/* R182 local Tarot conclusion */
.tr-conclusion{border:1px solid rgba(199,155,66,.45);background:linear-gradient(140deg,rgba(199,155,66,.08),transparent)}.tr-links h3{font-size:1rem;line-height:1.5}.tr-links p,.tr-conclusion p{overflow-wrap:anywhere}.tr-action-list li+li{margin-top:.65rem}
