
/* Base
   ========================================================================== */

// * 1.  Different CJK fonts have different line heights,
// *    assign a unified value for consistency. 
// * 2.  Force WebKit to render texts subpixel-antialiasedly. 
// *
#{$HYU-ROOT}
  // 1
  line-height: $HYU-LINE-HEIGHT
  // 2
  -webkit-font-smoothing: subpixel-antialiased

/* Grouping content
   ========================================================================== */

/**
 * Paragraphs, lists, figures and blockquotes
 * (段落、清單、圖表、區塊引用)
 */

// * Position with `em`-unit (Hanzi), in pursuit of alignments. 
// *
ol,
ul
  padding-left: $HYU-INDENT

figure,
blockquote
  margin-left: $HYU-INDENT
  margin-right: $HYU-INDENT

/**
 * Contact information
 * (聯絡資訊)
 */
address
  font-style: inherit

/**
 * Preformatted text
 * (格式預處理文字)
 */

// * Improve the readability
// *
pre
  white-space: pre
  word-wrap: normal

/* Text-level semantics & edits
   ========================================================================== */

/**
 * Hyperlinks
 * (超連結)
 */

// * Remove the underlines on hyperlinks for presentational
// * purpose. 
// *
a
  text-decoration: inherit

/**
 * Emphases
 * (強調)
 */

// * 1.  Pure CSS fallback. 
// * 2.  Remove fallback on browsers that support `text-emphasis`,
// *    so far, that's only WebKit. 
// *
em
  &:lang(zh),
  &:lang(ja)
    +hyu-text-emphasis
    // typography
    font-style: inherit
    // 1
    border-bottom: 2px dotted
    padding-bottom: .05em
    // 2
    border-bottom-width: -webkit-calc( 0px )
    padding-bottom: -webkit-calc( 0px )

em:lang(ja)
  +hyu-text-emphasis( $HYU-TEXT-EMPHASIS-POSI-JA, $HYU-TEXT-EMPHASIS-MARK-JA )

/**
 * Importance, definitions and Keywords
 * (重點、術語、關鍵字)
 */

// * Improvement for multiple weight fonts. 
// * See: https://github.com/necolas/normalize.css/pull/342
// *

strong,
dfn:lang(zh),
dfn:lang(ja),
b
  font-weight: inherit

strong,
dfn:lang(zh),
dfn:lang(ja),
b
  font-weight: bolder

dfn
  &:lang(zh),
  &:lang(ja)
    font-style: inherit

/**
 * Cites and quotes
 * (來源、引用)
 */
cite
  &:lang(zh),
  &:lang(ja)
    font-style: inherit

q
  quotes: '\201c' '\201d' '\2018' '\2019' '\201c' '\201d' '\2018' '\2019' '\201c' '\201d' '\2018' '\2019'

  &:lang(zh)
    quotes: '\300c' '\300d' '\300e' '\300f' '\300c' '\300d' '\300e' '\300f' '\300c' '\300d' '\300e' '\300f'

  &:lang(zh-CN),
  &:lang(en)
    quotes: '\201c' '\201d' '\2018' '\2019' '\201c' '\201d' '\2018' '\2019' '\201c' '\201d' '\2018' '\2019'

  &:lang(en-GB)
    quotes: '\2018' '\2019' '\201c' '\201d' '\2018' '\2019' '\201c' '\201d' '\2018' '\2019' '\201c' '\201d'

  &:before
    content: open-quote

  &:after
    content: close-quote

  &:lang(ja):before,
  &:lang(ja):after
    content: none

/**
 * Code, user input, computer output and preformatted text
 * (代碼、輸入鍵、計算機輸出示例、格式預處理文字)
 */

// * Correct odd `em`-unit font size rendering in all browsers
// * (still iffy for Chinese in WebKit). 
// *
code,
kbd,
samp,
pre
  font-family: monospace, monospace, sans-serif

/**
 * Alternative voices and variables
 * (變音文字、變數)
 */
i,
var
  &:lang(zh),
  &:lang(ja)
    font-family: cursive, serif
    font-style: inherit

/**
 * Annotations, inaccurate text, insertion and deletion
 * (註記、訛訊、增訂、刪訂)
 */

// * Semantic presentation for two adjacent underlined
// * text runs. 
// *
%hyu-adjacent-deco-line
  margin-left: .125em

u,
ins
  & + u,
  & + ins
    @extend %hyu-adjacent-deco-line
s,
del
  & + s,
  & + del
    @extend %hyu-adjacent-deco-line

u,
ins
  // box
  padding-bottom: 0.05em
  // typography
  border-bottom: 1px solid
  text-decoration: none

/**
 * Ruby annotations
 * (行間注)
 */

// * 1.  Attach parentheses for readability purposes. 
// * 2.  Hide the parentheses on WebKit & IE for they support
// *    native `<ruby>`. 
// *
ruby
  *:before,
  *:after
    line-height: normal

  // 1
  > rt
    &:before
      content: '\ff08'
    &:after
      content: '\ff09'

  // 1
  > rb + rtc
    &:before
      content: '\ff08'
  > rtc
    &:after
      content: '\ff0c'
    &:last-of-type:after
      content: '\ff09'

  > rt
    &:before,
    &:after
      // position
      display: inline-block
      overflow: hidden
      vertical-align: middle
      // box
      // 2
      height: 0
      width:  0
      height: -moz-calc( 1.3em )
      width:  -moz-calc( 1em )
